/* v3.23: roomy navigation, legible photo tagline, safe notice imagery, stronger orbit, DAU footer */
/* Desktop: put login & signup on a small secondary row, freeing actual width for navigation. */
@media(min-width:1221px){
  .site-header .header-inner{min-height:91px;position:relative;align-items:center;padding:1px 0 18px;gap:clamp(10px,.9vw,18px)}
  .site-header .brand{flex-shrink:0}
  .site-header .desktop-nav{gap:clamp(11px,.87vw,18px);margin-left:auto;justify-content:flex-end}
  .site-header .desktop-nav a{font-size:clamp(12px,.76vw,14px)!important;letter-spacing:-.04em}
  .site-header .header-actions{flex:0 0 auto;position:static;gap:8px}
  .site-header .header-actions>.nav-cta{min-height:37px;padding:9px 12px}
  .site-header .sg-auth-shift{position:absolute;right:155px;bottom:5px;display:flex;align-items:center;gap:10px;height:25px;z-index:2}
  .site-header .sg-auth-shift .sg-auth-top{padding:4px 10px;font-size:11px;border-radius:6px;line-height:1.25}
  .site-header .sg-auth-shift .sg-auth-register{font-size:11px;padding:3px 4px}
}
@media(min-width:1221px) and (max-width:1470px){
  .site-header .desktop-nav{gap:clamp(8px,.66vw,11px)}
  .site-header .brand .brand-name{font-size:14px!important}
  .site-header .sg-auth-shift{right:145px}
}
@media(max-width:1220px){
  .site-header .desktop-nav{display:none!important}
  .site-header .menu-toggle{display:flex!important}
  .site-header .sg-auth-shift{position:static;display:flex;align-items:center;gap:8px}
  .site-header .sg-auth-shift .sg-auth-register{display:none}
}
@media(max-width:600px){.site-header .sg-auth-shift{display:none}}
/* Hovered/scrolled navigation remains readable on top of city photography. */
.sg-first-chapter .hero .hero-signature{
  display:flex!important;position:absolute;align-items:flex-start;text-align:left;
  top:clamp(135px,16.5vh,198px)!important;right:max(100px,8vw)!important;bottom:auto;
  width:max-content;max-width:min(28vw,330px);
  padding:17px 20px 17px 22px;
  border:1px solid rgba(224,255,253,.43);border-radius:16px;
  color:#fff!important;
  background:linear-gradient(126deg,rgba(9,40,58,.86),rgba(7,66,73,.78));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 16px 38px rgba(6,33,44,.24);
  text-shadow:0 2px 7px rgba(0,0,0,.3);
}
.sg-first-chapter .hero .hero-signature strong{color:#fff!important;font-size:clamp(14px,.93vw,17px);line-height:1.6;font-weight:850}
.sg-first-chapter .hero .hero-signature small{color:#c4f3e7!important;opacity:1;font-size:9px;letter-spacing:.18em}
.sg-first-chapter .hero .hero-signature .signature-line{width:31px;height:3px;background:#82f1dc}
@media(max-width:1023px){.sg-first-chapter .hero .hero-signature{right:24px!important;max-width:260px;top:160px!important;padding:12px 14px}}
@media(max-width:740px){.sg-first-chapter .hero .hero-signature{display:none!important}}
/* Notice: prevent CSS blend/filter artifacts, transparent PNG black glitches and layout overflow. */
.sg-first-chapter .v31-news-live .v31-news-picture{
  isolation:isolate;overflow:hidden;background-color:#e3eee9;background-image:linear-gradient(135deg,rgba(5,54,67,.23),rgba(1,53,63,.40)),url('assets/hero/01-cityhall-day.webp');
  background-position:center,center 62%;background-size:cover,cover;
}
.sg-first-chapter .v31-news-live .v31-news-picture::before,
.sg-first-chapter .v31-news-live .v31-news-picture.has-notice-photo::before{background:linear-gradient(90deg,rgba(8,39,55,.52) 0%,rgba(8,45,57,.12) 85%)!important;opacity:1;transform:none;clip-path:none!important;mix-blend-mode:normal!important;filter:none!important}
.sg-first-chapter .v31-news-live .sg-notice-cover{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;mix-blend-mode:normal;filter:none;clip-path:none;z-index:0}
.sg-first-chapter .v31-news-live .sg-notice-cover[hidden]{display:none!important}
.sg-first-chapter .v31-news-live .v31-picture-word,.sg-first-chapter .v31-news-live .v31-picture-icon{position:relative;z-index:3}
/* 3D platform: stronger perception of depth while preserving compact page-2 sizing. */
#projects .platform-showcase-visual{perspective:1000px;perspective-origin:50% 46%;overflow:visible}
#projects .platform-showcase-visual .hero-art{perspective:780px;transform-style:preserve-3d}
#projects .platform-showcase-visual .hero-art .orbit-core{font-size:19px;line-height:1.32;font-weight:900;letter-spacing:-.045em}
#projects .platform-showcase-visual .hero-art .orbit-tag{min-width:124px;padding:14px 15px;box-shadow:0 15px 34px rgba(9,52,64,.19)}
#projects .platform-showcase-visual .hero-art .orbit-tag strong{font-size:15px;font-weight:900}
#projects .platform-showcase-visual .hero-art .orbit-tag small{font-size:11px}
#projects .platform-showcase-visual .hero-art .orbit-three{border:2px dashed rgba(9,140,125,.27)}
@media(min-width:1024px) and (hover:hover) and (pointer:fine){
 html.sg-scene-ready #projects .platform-showcase-visual .hero-art{transform:translate(-50%,-50%) scale(.69)!important}
 html.sg-scene-ready #projects .platform-showcase-visual{height:230px}
}
@media(min-width:1024px) and (hover:hover) and (pointer:fine) and (max-height:750px){
 html.sg-scene-ready #projects .platform-showcase-visual .hero-art{transform:translate(-50%,-50%) scale(.62)!important}
}
@media(min-width:741px) and (max-width:1023px){#projects .platform-showcase-visual .hero-art{transform:scale(.88)}}
@media(max-width:740px){#projects .platform-showcase-visual .hero-art .orbit-tag strong{font-size:14px}}
/* Partner signature in the lowermost sitemap/footer area. */
.footer-bottom{align-items:center}
.sg-footer-dau{display:inline-flex;align-items:center;justify-content:center;margin-left:auto;flex:0 0 140px;max-width:140px;min-height:65px;border-radius:9px;background:rgba(255,255,255,.94);padding:7px 9px;box-shadow:0 4px 15px rgba(0,0,0,.12)}
.sg-footer-dau img{display:block;width:100%;max-height:59px;object-fit:contain}
@media(max-width:740px){.sg-footer-dau{margin-left:0;flex-basis:130px;min-height:52px}.sg-footer-dau img{max-height:54px}}
@media(prefers-reduced-motion:reduce){#projects .platform-showcase-visual .hero-art .orbit-tag{transition:none!important}}

@media(min-width:1024px) and (hover:hover) and (pointer:fine){
 html.sg-scene-ready #projects .platform-showcase-copy h3{font-size:26px!important}
 html.sg-scene-ready #projects .platform-showcase-copy>p:last-of-type{font-size:14.2px;line-height:1.46}
 html.sg-scene-ready #projects .platform-points strong{font-size:14.3px}
 html.sg-scene-ready #projects .platform-points span{font-size:12px}
}
