:root{font-family:Arial,Helvetica,sans-serif;color:#202c30;background:#f5f3ee;--ink:#202c30;--muted:#5c686b;--line:#d9ddd7;--accent:#337f73;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:28px}body{margin:0}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}a:focus-visible,video:focus-visible{outline:3px solid #429a8c;outline-offset:5px}.wrap{width:min(1240px,calc(100% - 96px));margin:auto}.skip{position:fixed;top:-100px;left:20px;background:var(--ink);color:white;padding:15px;z-index:10}.skip:focus{top:15px}.header{display:flex;justify-content:space-between;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);gap:20px}.author{font-size:17px;font-weight:700}.author span{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:5px}.back{font-size:14px}.hero{padding:64px 0 52px}.eyebrow{font-size:12px;line-height:1.55;text-transform:uppercase;letter-spacing:.085em;color:var(--accent);margin:0 0 25px;font-weight:700}h1{font-size:clamp(42px,5.9vw,82px);line-height:1.06;letter-spacing:-.045em;margin:0 0 30px;max-width:1100px}h1 span{color:var(--accent)}p{font-size:18px;line-height:1.6;color:var(--muted);margin:0 0 18px}.lead{font-size:23px;line-height:1.5;max-width:830px}.project-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:42px}.project-nav a{display:block;border-bottom:1px solid var(--line);padding-bottom:18px}.project-nav img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:#172026}.project-nav span{position:relative;display:block;padding:17px 25px 0 0}.project-nav small{display:block;font-size:11px;color:var(--muted);margin-bottom:7px}.project-nav strong{font-size:19px;letter-spacing:-.015em}.project-nav b{position:absolute;right:0;top:32px;font-size:19px;font-weight:400}.project{padding:68px 0}.pioneer{border-top:1px solid var(--line)}.project-heading{display:flex;justify-content:space-between;gap:25px;align-items:baseline;margin-bottom:33px}.project-heading .eyebrow{margin:0}.medium{font-size:12px;color:var(--muted);line-height:1.5;text-align:right}h2{font-size:clamp(31px,3.8vw,52px);line-height:1.12;letter-spacing:-.035em;margin:0 0 25px}h3{font-size:28px;line-height:1.2;letter-spacing:-.025em;margin:0 0 22px}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:65px;margin-bottom:26px}.intro-grid p:last-child{margin-bottom:0}.media-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:38px}figure{margin:0;min-width:0}video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#111719;object-fit:contain}figcaption{font-size:13px;line-height:1.55;color:var(--muted);padding-top:13px}figcaption strong{display:block;font-size:14px;color:var(--ink);margin-bottom:3px}.credit{font-size:13px;line-height:1.65;margin:28px 0 0;max-width:870px}.book-band{background:#e9e8df}.book-object{margin-top:38px}.book-object video{max-height:590px}.label{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.03em;padding:3px 7px;background:#d5dfd7;color:#335b50;margin-right:8px}.book-detail{display:grid;grid-template-columns:.7fr 1fr;gap:70px;margin-top:48px;align-items:center}.book-detail p{font-size:17px}.book-detail .credit{font-size:13px;margin-top:22px}.transneft-band{background:#17252b;color:#f1f3ef;--ink:#f1f3ef;--muted:#b9c7c8;--accent:#91c2b6;--line:#37474b;color-scheme:dark}.transneft-band .label{color:#c0dcd4;background:#30474a}.plan{margin-top:38px}.plan img{width:100%;height:auto;display:block;background:#28363c}.transneft-band .credit{color:#b9c7c8}.closing{padding:76px 0;display:grid;grid-template-columns:1fr 1fr;column-gap:65px}.closing>.eyebrow{grid-column:1/-1}.closing>h2{grid-row:2/4}.closing>p{margin-bottom:28px}.next{font-size:15px;line-height:1.65;border-top:1px solid var(--line);padding-top:18px;display:flex;gap:20px;justify-content:space-between}.footer{display:flex;gap:28px;justify-content:space-between;border-top:1px solid var(--line);padding:27px 0 38px;font-size:13px;color:var(--muted)}@media(max-width:950px){.wrap{width:calc(100% - 56px)}.hero{padding-top:45px}.intro-grid,.book-detail,.closing{gap:35px}.project-heading{gap:20px}.project-nav{gap:14px}.project-nav strong{font-size:16px}.project{padding:52px 0}}@media(max-width:650px){.wrap{width:calc(100% - 36px)}.header{padding:22px 0}.author{font-size:15px}.back{font-size:12px}.hero{padding:34px 0 35px}h1{font-size:clamp(38px,10vw,58px)}h1 br{display:none}.lead{font-size:19px}.eyebrow{font-size:11px;letter-spacing:.06em}.project-nav{grid-template-columns:1fr;margin-top:27px;gap:14px}.project-nav a{display:grid;grid-template-columns:104px 1fr;gap:16px;padding-bottom:14px;align-items:center}.project-nav img{aspect-ratio:4/3}.project-nav span{padding:0 20px 0 0}.project-nav b{top:20px}.project-nav strong{font-size:17px}.project-nav small{font-size:10px}.project{padding:40px 0}.project-heading{display:block;margin-bottom:24px}.medium{display:block;text-align:left;margin-top:9px;font-size:11px}.intro-grid{display:block}.intro-grid h2{margin-bottom:24px}h2{font-size:34px}.intro-grid p{font-size:17px}.media-pair{grid-template-columns:1fr;gap:26px;margin-top:27px}.credit{margin-top:23px}.book-object,.plan{margin-top:27px}.book-detail{grid-template-columns:1fr;gap:27px;margin-top:35px}.book-detail h3{font-size:26px}.closing{display:block;padding:43px 0}.closing>p{font-size:17px}.footer{flex-wrap:wrap;gap:20px;font-size:12px}.footer span{width:100%}figcaption{font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.cube-visual{margin-top:38px}.cube-visual img{display:block;width:100%;height:auto;background:#d8dedc}@media(max-width:650px){.cube-visual{margin-top:27px}}

/* Stage 6: real objects and original content before explanatory visuals. */
.hero { padding: 32px 0 30px; }
body.case-spatial .hero h1 { font-size: clamp(72px, 7.6vw, 112px); margin-bottom: 24px; }
.hero .eyebrow { margin-bottom: 20px; }
.hero .lead { font-size: 21px; max-width: 900px; margin-bottom: 0; }
.project-nav { margin-top: 26px; gap: 24px; }
.project-nav a { padding-bottom: 15px; min-height: 74px; }
.project-nav span { padding-top: 0; }
.project-nav b { top: 15px; }
.project { padding: 40px 0; }
.project-heading { margin-bottom: 24px; }
.intro-grid { gap: 48px; margin-bottom: 24px; }
body.case-spatial .intro-grid h2 { font-size: clamp(40px, 4.1vw, 60px); margin: 0; }
.intro-grid p { font-size: 16px; }
.book-object { max-width: 1040px; margin: 28px auto 0; }
.book-object video { max-height: none; }
.book-detail { gap: 48px; margin-top: 32px; }
.book-detail p { font-size: 16px; }
.book-detail .credit { font-size: 13px; }
.primary-content { max-width: 1040px; margin: 28px auto 0; }
.compact-geometry { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 28px; align-items: center; margin-top: 28px; }
.compact-geometry figcaption { max-width: 590px; font-size: 13px; padding-top: 0; }
.compact-plan { max-width: 760px; margin: 28px auto 0; }
.extra-media { border-top: 1px solid var(--line); margin-top: 24px; }
.extra-media > summary { min-height: 48px; padding: 13px 0; cursor: pointer; color: var(--accent); font-size: 13px; line-height: 1.6; }
.extra-media > figure { max-width: 840px; padding-top: 10px; }
.closing { padding: 48px 0; }
@media (max-width: 760px) {
  body.case-spatial .hero h1 { font-size: clamp(46px, 13.8vw, 80px); line-height: .9; }
  body.case-spatial .hero h1 br { display: inline; }
  .hero .lead { font-size: 17px; }
  .project-nav { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 22px; }
  .project-nav a { display: block; min-height: 63px; padding: 12px 0; }
  .project-nav span { padding: 0 24px 0 0; }
  .project-nav small { margin-bottom: 3px; }
  .project-nav strong { font-size: 16px; }
  .project-nav b { top: 12px; }
  .project { padding: 30px 0; }
  .intro-grid { display: block; margin-bottom: 20px; }
  body.case-spatial .intro-grid h2 { font-size: 38px; margin-bottom: 18px; }
  .intro-grid p { font-size: 15px; }
  .book-object, .primary-content { margin-top: 22px; }
  .book-detail { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-top: 28px; }
  .book-detail p { font-size: 15px; }
  .compact-geometry { grid-template-columns: minmax(0, 1fr); gap: 15px; margin-top: 24px; }
  .compact-geometry img { max-width: 420px; }
  .compact-geometry figcaption { font-size: 12px; }
  .compact-plan { margin-top: 24px; }
  .extra-media > summary { font-size: 12px; }
}