/* YSSE Fabricator - shared styles (page layout styles live inline in each page) */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
img{max-width:100%}
a:focus-visible,button:focus-visible{outline:2px solid #9FD0EA;outline-offset:3px}
[hidden]{display:none!important}

/* Project filter chips */
.chip{font:600 15px Manrope,sans-serif;padding:12px 20px;min-height:44px;cursor:pointer;border-radius:2px;background:#FFFFFF;color:#0A2233;border:1px solid #C9CED4}
.chip:hover{border-color:#044C71}
.chip[aria-pressed="true"]{background:#044C71;color:#FFFFFF;border-color:#044C71}

/* Contact office buttons follow aria-pressed */
.office[aria-pressed="true"]{background:#044C71!important;color:#FFFFFF!important;border-color:#044C71!important}
.office[aria-pressed="false"]{background:#FFFFFF!important;color:#0A2233!important;border-color:#C9CED4!important}
button[disabled]{opacity:.6;cursor:wait}

/* Phones: keep the header tidy */
@media (max-width: 640px){
  header nav[aria-label="Main"]{gap:6px 18px!important;font-size:14px!important}
  header nav[aria-label="Main"] a[href="/contact"]{padding:10px 14px!important}
}

/* === Project gallery + lightbox === */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));grid-auto-rows:220px;grid-auto-flow:dense;gap:10px}
.g-tile{display:block;overflow:hidden;background:#E6E9EC;cursor:zoom-in}
.g-tile img{width:100%;height:100%;object-fit:cover;display:block}
.g-big{grid-column:span 2;grid-row:span 2}
.g-tall{grid-row:span 2}
@media (max-width:620px){.gallery{grid-template-columns:1fr 1fr;grid-auto-rows:150px;gap:6px}.g-big{grid-column:1 / -1}}
.lb{position:fixed;inset:0;z-index:100;background:rgba(2,16,26,.94);display:flex;align-items:center;justify-content:center;padding:56px 12px}
.lb[hidden]{display:none}
.lb img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.lb button{position:absolute;background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.35);width:52px;height:52px;font:600 24px/1 Manrope,sans-serif;cursor:pointer;border-radius:2px}
.lb button:hover{background:rgba(255,255,255,.2)}
.lb .lb-x{top:12px;right:12px}.lb .lb-p{left:12px;top:50%;transform:translateY(-50%)}.lb .lb-n{right:12px;top:50%;transform:translateY(-50%)}
.lb .lb-c{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:rgba(255,255,255,.75);font:600 14px Manrope,sans-serif}
.t-scene{position:relative;border-radius:6px;overflow:hidden;background:radial-gradient(120% 90% at 50% 10%,#2C5D7C 0%,#123349 55%,#0A2233 100%);box-shadow:0 30px 80px rgba(0,0,0,.35)}
.t-scene svg{display:block;width:100%;height:auto}
.t-legend{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.t-legend a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid rgba(255,255,255,.28);border-radius:2px;font-weight:600;font-size:15px;transition:background .2s,border-color .2s}
.t-legend a:hover,.t-legend a:focus-visible,.t-legend a.t-on{background:rgba(159,208,234,.16);border-color:#9FD0EA}
.t-legend a span{width:8px;height:8px;border-radius:50%;background:#E8B517}
.t-swipe{display:none;margin:10px 0 0;font-size:13px;font-weight:600;color:rgba(255,255,255,.7)}
.t-hs{cursor:pointer;outline:none}
.t-hs > .t-body{transition:filter .25s}
.t-hs.t-on > .t-body,.t-hs:focus-visible > .t-body{filter:brightness(1.12) drop-shadow(0 0 8px rgba(232,181,23,.8))}
.t-pin{fill:#E8B517;stroke:#fff;stroke-width:2}
.t-ring{fill:none;stroke:#E8B517;stroke-width:2;transform-box:fill-box;transform-origin:center;animation:t-ring 2.4s ease-out infinite}
@keyframes t-ring{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.t-tag{opacity:0;transition:opacity .25s;pointer-events:none}
.t-tag rect{fill:#0A2233;stroke:rgba(159,208,234,.5)}
.t-tag text{fill:#fff;font:700 15px Manrope,sans-serif}
.t-tag .t-sub{fill:#9FD0EA;font:600 12px Manrope,sans-serif}
.t-pinw.t-on .t-tag{opacity:1}
.t-pinw{cursor:pointer}
@media (hover:none){.t-tag{opacity:1}.t-tag .t-sub{display:none}}
@media (max-width:760px){.t-scene{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.t-scene::-webkit-scrollbar{display:none}.t-scene svg{width:1150px;max-width:none}.t-swipe{display:block}}
@keyframes t-puff{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:.7}100%{opacity:0;transform:translate(14px,-46px) scale(1.6)}}
.t-smoke{animation:t-puff 3.2s ease-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes t-blink{0%,100%{opacity:1}50%{opacity:.15}}
.t-beacon{animation:t-blink 1.4s ease-in-out infinite}
@keyframes t-wave{0%,100%{transform:skewX(0)}50%{transform:skewX(-8deg)}}
.t-flag{animation:t-wave 2.2s ease-in-out infinite;transform-box:fill-box;transform-origin:0 50%}
@media (prefers-reduced-motion:reduce){.t-ring,.t-smoke,.t-beacon,.t-flag{animation:none}}/* News */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:28px}
.news-card{border:1px solid #DDE1E6;display:flex;flex-direction:column;background:#fff}
.news-img{display:block;aspect-ratio:16/10;overflow:hidden;background:#E6E8EB}
.news-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.motion-on .news-card:hover .news-img img{transform:scale(1.05)}
.news-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.news-body time{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#5F6B7A}
.news-body h2{margin:0;font-size:22px;line-height:1.25;font-weight:700;color:#0A2233}
.news-body p{margin:0;font-size:15px;line-height:1.65;color:#3C4757}
.news-more{margin-top:auto;padding-top:6px;font-weight:700;color:#044C71}