:root{--red-object:#b82219;--red-ink:#151515;--red-paper:#eee9e1}.red-table-page{background:var(--red-paper);color:var(--red-ink)}.red-table-header{height:90px;padding:0 3.2vw;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(0,0,0,.2);font:300 10px "DM Mono";text-transform:uppercase;letter-spacing:.1em}.red-table-header nav{display:flex;gap:30px}.red-table-header>a:last-child{justify-self:end}.red-table-hero{min-height:calc(100svh - 90px);padding:7vh 5vw 6vh;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;isolation:isolate;color:#fff}.red-table-hero-image,.red-table-hero-shade{position:absolute;inset:0;margin:0;z-index:-2}.red-table-hero-image img{width:100%;height:100%;object-fit:cover;object-position:center}.red-table-hero-shade{z-index:-1;background:linear-gradient(90deg,rgba(30,0,0,.62),rgba(30,0,0,.06) 72%),linear-gradient(0deg,rgba(25,0,0,.78),rgba(25,0,0,.04) 62%)}.red-table-status{display:flex;justify-content:space-between;font:300 9px "DM Mono";text-transform:uppercase;letter-spacing:.13em;color:#fff}.red-table-hero h1{font-size:clamp(78px,12vw,178px);line-height:.76;letter-spacing:-.075em;font-weight:300;margin:8vh 0;text-shadow:0 4px 30px rgba(40,0,0,.25)}.red-table-hero h1 em,.red-table-story h2 em,.red-table-next a em{font-family:"Playfair Display";font-weight:500}.red-table-deck{display:grid;grid-template-columns:1.4fr .6fr;gap:10vw;border-top:1px solid rgba(255,255,255,.45);padding-top:22px}.red-table-deck p{font-size:18px;line-height:1.6;max-width:700px;margin:0}.red-table-deck span{font:300 9px/1.7 "DM Mono";text-transform:uppercase;text-align:right}.red-table-object-view{margin:0;padding:8vw 5vw 7vw;background:var(--red-object);color:#fff}.red-table-object-view img{display:block;width:100%;height:auto;object-fit:contain}.red-table-object-view figcaption{display:flex;justify-content:space-between;gap:30px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.42);font:300 9px/1.5 "DM Mono";text-transform:uppercase;letter-spacing:.1em}.red-table-story{padding:140px 5vw;display:grid;grid-template-columns:.45fr 1.55fr;gap:8vw}.red-table-label{font:300 9px "DM Mono";text-transform:uppercase;letter-spacing:.12em}.red-table-label span{color:var(--red-object);margin-right:24px}.red-table-story h2{font-size:clamp(55px,8vw,115px);line-height:.86;letter-spacing:-.06em;font-weight:300;margin:0 0 75px}.red-table-story>div>p{font-size:16px;line-height:1.8;max-width:760px;margin:0 0 28px}.red-table-construction{background:#171717;color:#eee;padding:0 5vw;display:grid;grid-template-columns:repeat(3,1fr)}.red-table-construction>div{padding:75px 35px 85px 0;border-right:1px solid rgba(255,255,255,.2)}.red-table-construction>div+div{padding-left:35px}.red-table-construction>div:last-child{border-right:0}.red-table-construction span{font:300 9px "DM Mono";color:#d26a61}.red-table-construction strong{display:block;font-size:20px;font-weight:300;margin:48px 0 25px}.red-table-construction p{font-size:13px;line-height:1.75;color:#aaa}.red-table-facts{padding:95px 5vw 120px;display:grid;grid-template-columns:repeat(4,1fr);gap:3vw;background:#171717;color:#eee}.red-table-facts>div{border-top:1px solid rgba(255,255,255,.22);padding-top:18px}.red-table-facts span{display:block;font:300 9px "DM Mono";text-transform:uppercase;color:#777;margin-bottom:28px}.red-table-facts strong{font-size:14px;line-height:1.6;font-weight:300}.red-table-next{padding:120px 5vw 140px;background:var(--red-object);color:#fff}.red-table-next>p{font:300 9px "DM Mono";text-transform:uppercase}.red-table-next a{display:block;font-size:clamp(62px,9vw,134px);line-height:.84;letter-spacing:-.06em;border-bottom:1px solid rgba(255,255,255,.45);padding:50px 0}.red-table-page footer{background:#171717;color:#aaa;border-color:#333}@media(max-width:800px){.red-table-header{grid-template-columns:1fr auto}.red-table-header nav{display:none}.red-table-story{grid-template-columns:1fr}.red-table-construction{grid-template-columns:1fr}.red-table-construction>div,.red-table-construction>div+div{padding:50px 0;border-right:0;border-bottom:1px solid rgba(255,255,255,.2)}.red-table-facts{grid-template-columns:1fr 1fr}}@media(max-width:560px){.red-table-header{height:75px}.red-table-header .brand span:last-child{display:none}.red-table-hero{min-height:calc(100svh - 75px);padding:7vh 6vw 6vh}.red-table-hero-image img{object-position:58% center}.red-table-status span:last-child{display:none}.red-table-hero h1{font-size:20vw}.red-table-deck{grid-template-columns:1fr;gap:28px}.red-table-deck span{text-align:left}.red-table-object-view{padding:55px 0}.red-table-object-view figcaption{margin:14px 6vw 0;display:block}.red-table-object-view figcaption span{display:block}.red-table-object-view figcaption span+span{margin-top:8px}.red-table-story{padding:90px 6vw}.red-table-story h2{font-size:15vw;margin:50px 0}.red-table-construction,.red-table-facts{padding-left:6vw;padding-right:6vw}.red-table-facts{grid-template-columns:1fr}.red-table-next{padding:90px 6vw 110px}.red-table-next a{font-size:16vw}}
/* Five verified project facts */
.red-table-facts{grid-template-columns:repeat(5,1fr)}
@media(max-width:800px){.red-table-facts{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.red-table-facts{grid-template-columns:1fr}}

/* Utopia Mesa — installation documentation */
.utopia-gallery{padding:8vw 5vw;background:var(--red-paper);color:var(--red-ink);display:grid;grid-template-columns:1.25fr .75fr;gap:3vw;align-items:start}
.utopia-gallery figure{margin:0}
.utopia-gallery img{display:block;width:100%;height:auto;object-fit:contain}
.utopia-gallery figcaption{display:flex;justify-content:space-between;gap:22px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(0,0,0,.24);font:300 9px/1.5 "DM Mono";text-transform:uppercase;letter-spacing:.1em}
.utopia-gallery figcaption span:last-child{text-align:right}
@media(max-width:560px){
  .red-table-hero-image img{object-position:center}
  .utopia-gallery{grid-template-columns:1fr;padding:60px 6vw;gap:70px}
  .utopia-gallery figcaption{display:block}
  .utopia-gallery figcaption span{display:block}
  .utopia-gallery figcaption span+span{margin-top:8px;text-align:left}
}

/* Let the realised object carry the colour; keep the page architecture neutral. */
.red-table-next{background:var(--red-paper);color:var(--red-ink);border-top:1px solid rgba(0,0,0,.18)}
.red-table-next a{border-bottom-color:rgba(0,0,0,.28)}

/* Portrait and narrative form one human-scale chapter; the object detail follows. */
.utopia-story{padding:9vw 5vw;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:8vw;align-items:center}
.utopia-story figure,.utopia-detail{margin:0}
.utopia-story img,.utopia-detail img{display:block;width:100%;height:auto}
.utopia-story figcaption,.utopia-detail figcaption{display:flex;justify-content:space-between;gap:22px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(0,0,0,.24);font:300 9px/1.5 "DM Mono";text-transform:uppercase;letter-spacing:.1em}
.utopia-story figcaption span:last-child,.utopia-detail figcaption span:last-child{text-align:right}
.utopia-story-copy h2{font-size:clamp(52px,6.7vw,104px);line-height:.88;letter-spacing:-.06em;font-weight:300;margin:70px 0 60px}
.utopia-story-copy h2 em{font-family:"Playfair Display";font-weight:500}
.utopia-story-copy>p:not(.red-table-label){font-size:16px;line-height:1.8;max-width:700px;margin:0 0 28px}
.utopia-detail{padding:0 5vw 9vw}
.utopia-detail img{max-height:92vh;object-fit:contain;background:#e8e3db}
.utopia-final{margin:0;padding:9vw 5vw;background:var(--red-paper)}
.utopia-final img{display:block;width:100%;height:auto;max-height:92vh;object-fit:contain}
.utopia-final figcaption{display:flex;justify-content:space-between;gap:22px;margin-top:16px;padding-top:14px;border-top:1px solid rgba(0,0,0,.24);font:300 9px/1.5 "DM Mono";text-transform:uppercase;letter-spacing:.1em}
.utopia-final figcaption span:last-child{text-align:right}
@media(max-width:800px){
  .utopia-story{grid-template-columns:1fr;gap:70px;padding:80px 6vw}
  .utopia-story figure{max-width:680px}
  .utopia-story-copy h2{margin:45px 0}
  .utopia-detail{padding:0 6vw 80px}
  .utopia-final{padding:80px 6vw}
}
@media(max-width:560px){
  .utopia-story figcaption,.utopia-detail figcaption,.utopia-final figcaption{display:block}
  .utopia-story figcaption span,.utopia-detail figcaption span,.utopia-final figcaption span{display:block}
  .utopia-story figcaption span+span,.utopia-detail figcaption span+span,.utopia-final figcaption span+span{margin-top:8px;text-align:left}
  .utopia-story-copy h2{font-size:15vw}
}