/* Project gallery, installation journal and service chapters. */
.project-showcase{padding:75px 0 55px;overflow:hidden;background:var(--surface-blue);color:#fff}
.portfolio-heading{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:end;margin-bottom:45px}.portfolio-heading .kicker{color:#adc6d6;font-size:12px;letter-spacing:.19em}.portfolio-heading h2{font:400 clamp(46px,7vw,90px)/1.02 Prompt,sans-serif;letter-spacing:-.045em;margin:20px 0 0}.portfolio-heading h2 span{color:#c4d6e2}.project-subtitle{font-size:25px;margin:0 0 18px}.portfolio-heading .project-belief{font-size:17px;line-height:1.9;color:#c7d8e4;margin:0}.project-category{font-size:12px;letter-spacing:.13em;color:#a6becf;margin:25px 0 0}
.roof-reel{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#b2c9d4 #ffffff10;padding-bottom:12px;overscroll-behavior-x:contain}
.project-showcase .roof-card{flex:0 0 88%;min-width:0;margin:0;position:relative;scroll-snap-align:center;border-radius:0;overflow:hidden}.project-showcase .roof-card a{display:block;color:#fff}.project-showcase .roof-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:0;transition:transform .9s cubic-bezier(.2,.65,.3,1)}.project-showcase .roof-card a:hover img{transform:scale(1.025)}
.project-showcase .roof-number{position:absolute;top:22px;left:24px;width:auto;height:auto;background:#081c3299;padding:5px 12px;font:400 22px Prompt,sans-serif;backdrop-filter:blur(6px);border:1px solid #ffffff40;border-radius:0}
.project-showcase .roof-card figcaption{background:none;border-radius:0;text-align:left;padding:20px 0 12px;font-size:25px;font-weight:400;border-bottom:1px solid #ffffff30}.reel-controls{align-items:center;justify-content:space-between;margin-top:12px}.reel-controls:not([hidden]){display:flex}.reel-count{font:400 14px Prompt,sans-serif;letter-spacing:.12em;color:#cbdce7}.reel-controls>div{display:flex;gap:10px}.reel-controls button{font:inherit;font-size:14px;min-height:44px;background:transparent;color:#fff;border:1px solid #ffffff40;padding:10px 18px;border-radius:30px;cursor:pointer}.reel-controls button:disabled{opacity:.3;cursor:default}.reel-hint{font-size:12px;color:#a9c1d2;margin:15px 0 0}.project-showcase .more-projects{margin-top:35px;border-color:#ffffff30}.project-showcase .more-projects summary{color:#d9e7f0}.project-showcase .more-projects figcaption{color:#d9e7f0}
.project-journal{padding-top:90px;padding-bottom:65px}.project-journal .catalog-heading{align-items:end;margin-bottom:42px}.project-journal h2{font-size:clamp(30px,4vw,50px);font-weight:400}.project-journal .catalog-grid{display:block}.project-journal .journal-entry{border:0;margin:0 0 65px;padding:0;background:none}.project-journal .journal-entry>a{display:grid;grid-template-columns:1.15fr 1fr;gap:7%;align-items:center;background:none}.project-journal .journal-entry:nth-child(even)>a{grid-template-columns:1fr 1.15fr}.project-journal .journal-entry:nth-child(even) .card-photo{order:2}.project-journal .card-photo{aspect-ratio:4/3;height:auto;overflow:hidden}.project-journal .card-photo img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.4s cubic-bezier(.2,.65,.3,1)}.project-journal .journal-entry.is-visible .card-photo img{transform:scale(1)}.project-journal .card-copy{padding:15px 0}.journal-number{display:block;font:400 58px/1 Prompt,sans-serif;letter-spacing:-.05em;color:#a2b9c8;margin-bottom:24px}.project-journal .card-label{font-size:12px;letter-spacing:.08em;color:#52738c}.project-journal .card-copy h3{font-size:clamp(24px,2.8vw,34px);font-weight:400;line-height:1.5;margin:14px 0 18px}.project-journal .card-copy>p:not(.card-label){font-size:16px;line-height:1.9;color:#627486}.project-journal .card-link{display:inline-block;color:#153e60;border-bottom:1px solid #a9bece;padding-bottom:8px;margin-top:16px;font-size:15px}.journal-entry.motion-entry{opacity:.3;transform:translateY(22px);transition:opacity .8s ease,transform .9s ease}.journal-entry.motion-entry.is-visible{opacity:1;transform:none}
.service-showcase{padding-top:60px;padding-bottom:80px}.service-showcase>.section-heading{display:block;max-width:750px;margin-bottom:45px}.service-showcase h2{font-size:clamp(32px,4vw,50px);font-weight:400}.service-showcase>.section-heading>p:last-child{text-align:left}.service-chapter{border-top:1px solid #b8c9d5;border-bottom:0}.service-chapter:last-child{border-bottom:1px solid #b8c9d5}.service-chapter summary{display:grid;grid-template-columns:55px 1fr 30px;gap:24px;padding:28px 0;align-items:center}.service-number{font:400 22px Prompt,sans-serif;color:#7d98ab}.service-chapter summary small{display:block;font:400 12px Prompt,sans-serif;letter-spacing:.08em;color:#738d9f;margin-bottom:7px}.service-chapter summary strong{font:400 clamp(21px,2.4vw,30px)/1.5 Prompt,sans-serif;color:#173a56}.service-chapter summary:after{display:grid;place-items:center;border:1px solid #b5c7d4;border-radius:50%;width:30px;height:30px;font-size:22px}.service-chapter[open] .service-number{color:#153e60}.service-content{display:grid;grid-template-columns:1.1fr 1fr;gap:6%;align-items:center;padding:0 0 36px 79px;animation:service-open .45s ease}.service-content .card-photo{height:290px;aspect-ratio:auto;overflow:hidden;background:#edf3f7}.service-content .card-photo img{height:100%;width:100%;object-fit:cover}.service-content .phone-photo img{object-fit:contain}.service-content p{font-size:17px;line-height:1.9;color:#637789}.service-detail-link{display:inline-block;border-bottom:1px solid #9db6c8;padding:12px 0;color:#153e60;font-size:15px}.service-showcase .service-extras{margin-top:60px;border:0;background:#f1f5f7;padding:30px}.service-extras h3{font-weight:400}
@keyframes service-open{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:720px){.project-showcase{padding-top:48px;padding-bottom:38px}.portfolio-heading{grid-template-columns:1fr;gap:25px;margin-bottom:28px}.portfolio-heading h2{font-size:51px}.portfolio-heading h2 br{display:none}.portfolio-heading h2 span{display:block}.project-subtitle{font-size:23px;margin-bottom:12px}.portfolio-heading .project-belief{font-size:15px}.project-category{margin-top:18px;font-size:11px}.roof-reel{gap:16px;margin-right:-20px;padding-right:20px}.project-showcase .roof-card{flex-basis:94%}.project-showcase .roof-card img{aspect-ratio:4/3}.project-showcase .roof-card figcaption{font-size:21px;padding:17px 0}.project-showcase .roof-number{font-size:18px;top:14px;left:14px}.project-journal{padding-top:55px;padding-bottom:15px}.project-journal .catalog-heading{display:block;margin-bottom:28px}.project-journal .catalog-all{margin-top:15px;display:inline-block}.project-journal .journal-entry{margin-bottom:50px}.project-journal .journal-entry>a,.project-journal .journal-entry:nth-child(even)>a{grid-template-columns:1fr;gap:0}.project-journal .journal-entry:nth-child(even) .card-photo{order:0}.project-journal .card-copy{padding-top:24px}.journal-number{font-size:40px;margin-bottom:18px}.project-journal .card-copy h3{font-size:25px;margin-top:10px}.project-journal .card-copy>p:not(.card-label){font-size:15px}.service-showcase{padding-top:40px;padding-bottom:50px}.service-chapter summary{grid-template-columns:30px 1fr 28px;gap:12px;padding:23px 0}.service-number{font-size:18px}.service-chapter summary strong{font-size:21px}.service-chapter summary small{font-size:11px}.service-chapter summary:after{width:27px;height:27px}.service-content{grid-template-columns:1fr;gap:12px;padding:0 0 28px}.service-content .card-photo{height:240px}.service-content p{font-size:15px}.service-showcase .service-extras{padding:22px;margin-top:40px}}
@media(prefers-reduced-motion:reduce){.roof-reel{scroll-behavior:auto}.project-showcase img,.journal-entry,.journal-entry img,.service-content{animation:none!important;transition:none!important;transform:none!important;opacity:1!important}}

/* Match the site's Thai editorial hierarchy. */
.portfolio-heading h2{font-family:Prompt,'Noto Sans Thai',sans-serif;font-size:clamp(32px,4vw,54px);font-weight:400;line-height:1.4;letter-spacing:-.025em;margin:16px 0 0}
.portfolio-heading .kicker{font-size:13px;letter-spacing:.18em}
.portfolio-heading .project-subtitle{font-size:clamp(20px,2vw,26px);font-weight:400;line-height:1.6}
.project-showcase .roof-card figcaption{font-family:Prompt,'Noto Sans Thai',sans-serif;font-size:clamp(20px,2vw,26px);font-weight:400;line-height:1.6}
@media(max-width:720px){.portfolio-heading h2{font-size:34px}.portfolio-heading h2 br{display:initial}.portfolio-heading h2 span{display:inline}}
