/* ===========================================================
   TMT Framework
   Component: Layout
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* ===========================================================
   TMT Layout CSS
   Global centering, container, language and mobile layout fixes.
   Split from former tmt-footer.css in Phase 4B.
   =========================================================== */

/* ===========================================================
   TMT global centering hotfix after Sinatra/Gutenberg update
   Keeps page content centered on ZH/DE and prevents left drift
   =========================================================== */

/* Main site structure */
.site-content,
#content,
#primary,
#main,
.site-main,
.entry-content{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  float:none !important;
  box-sizing:border-box !important;
}

/* Theme/container classes */
.si-container,
.sinatra-container,
.site-content .container,
.entry-content .container,
.wp-block-group .container,
.container{
  width:min(1200px,92%) !important;
  max-width:1200px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Gutenberg alignment wrappers */
.entry-content > .wp-block-group,
.entry-content > section,
.wp-site-blocks > .wp-block-group{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}

/* Prevent accidental theme/sidebar column offsets on static pages */
body.page #primary,
body.page .content-area,
body.page .site-main{
  float:none !important;
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Language-specific reinforcement */
body.lang-zh .site-content,
body.lang-de .site-content,
html.zh .site-content,
html.de .site-content,
body.lang-zh .entry-content,
body.lang-de .entry-content,
html.zh .entry-content,
html.de .entry-content{
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:initial;
}

/* Keep section content centered, but do not center all text */
body.lang-zh .section > .container,
body.lang-de .section > .container,
html.zh .section > .container,
html.de .section > .container,
body.lang-zh #about > .container,
body.lang-de #about > .container,
body.lang-zh #services > .container,
body.lang-de #services > .container,
body.lang-zh #portfolio > .container,
body.lang-de #portfolio > .container,
body.lang-zh #contact > .container,
body.lang-de #contact > .container{
  width:min(1200px,92%) !important;
  max-width:1200px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Footer: keep the working 2-row SiteLock/copyright centered */
.site-footer,
.site-footer *{
  box-sizing:border-box !important;
}

.site-footer .si-copyright-widget__text,
.tmt-footer-stack,
.tmt-footer-sitelock-row,
.tmt-footer-copyright-row{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
  justify-content:center !important;
  align-items:center !important;
}

/* Mobile safety */
@media (max-width:768px){
  .si-container,
  .sinatra-container,
  .site-content .container,
  .entry-content .container,
  .wp-block-group .container,
  .container{
    width:min(100%,92%) !important;
    max-width:100% !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  body.page #primary,
  body.page .content-area,
  body.page .site-main,
  .entry-content{
    overflow-x:hidden !important;
  }
}


/* ===========================================================
   TMT Framework
   Component: Legal Pages
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* Legal pages should use the same card language as the About/feature sections,
   but with a clean, readable text width and no inline layout styles. */
.tmt-legal-page{
  padding-block:clamp(4rem,8vw,7rem);
}

.tmt-legal-page .container{
  width:min(1100px,92%);
}

.tmt-legal-page .feature-item{
  display:block;
}

.tmt-legal-page .feature-content{
  grid-column:1 / -1;
  max-width:880px;
  margin:0 auto;
}

.tmt-legal-page h2{
  margin-bottom:2rem;
}

.tmt-legal-page .feature-intro{
  margin:0 0 1.75rem;
}

.tmt-legal-page h3,
.tmt-legal-page h4{
  margin-top:2rem;
  margin-bottom:.75rem;
}

.tmt-legal-page h3:first-child,
.tmt-legal-page h4:first-child{
  margin-top:0;
}

.tmt-legal-page p,
.tmt-legal-page ul,
.tmt-legal-page ol{
  margin-bottom:1.25rem;
  line-height:1.75;
}

.tmt-legal-page ul,
.tmt-legal-page ol{
  padding-left:1.35rem;
}

.tmt-legal-page li + li{
  margin-top:.35rem;
}

.tmt-legal-page a{
  word-break:break-word;
}

@media (max-width:700px){
  .tmt-legal-page{
    padding-block:3.25rem;
  }

  .tmt-legal-page .container{
    width:min(100% - 2rem,1100px);
  }

  .tmt-legal-page .feature-content{
    max-width:none;
  }
}


/* ===========================================================
   TMT Framework
   Component: Content Card
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* Reading/content cards: About, legal pages, longer text blocks.
   Do not apply to service icon grids, players, galleries or timelines. */
.tmt-content-card{
  padding:35px;
}

@media (max-width:700px){
  .tmt-content-card{
    padding:28px;
  }
}


/* ===========================================================
   TMT Framework
   Component: Legal Pages / Content Card Spacing Fix
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* Width belongs to the card wrapper.
   Content should not be centered again inside the card,
   otherwise left spacing becomes wider than 35px. */
.tmt-legal-page .feature-item{
  display:block;
  max-width:880px;
  margin-inline:auto;
}

.tmt-legal-page .feature-content{
  max-width:none;
  margin:0;
}

.tmt-legal-page .feature-content.tmt-content-card{
  padding:35px;
}

@media (max-width:700px){
  .tmt-legal-page .feature-item{
    max-width:none;
  }

  .tmt-legal-page .feature-content.tmt-content-card{
    padding:28px;
  }
}


/* ===========================================================
   TMT Framework
   Component: About Reading Card Inset
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* About is the reference reading card.
   Goal: visible card-to-content inset of 35px on all four sides. */
#about .about-flex{
  padding:35px !important;
}

/* Remove first-child top margin so visible top inset stays 35px,
   instead of becoming padding + paragraph margin. */
#about .about-text > :first-child{
  margin-top:0;
}

/* Keep the lower edge clean and predictable. */
#about .about-flex > :last-child{
  margin-bottom:0;
}

@media (max-width:700px){
  #about .about-flex{
    padding:28px !important;
  }
}


/* ===========================================================
   TMT Framework
   Component: About Image Top Alignment
   Status: Active
   Version: 1.0 RC
   =========================================================== */

/* Align the image column with the top of the text column.
   The current inline HTML has margin-top:1rem on the figure,
   so this override removes that extra offset. */
#about .about-image{
  margin-top:0 !important;
  align-self:flex-start;
}

/* TMT Responsive Overflow Fix — revised */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

#page,
#main,
.site-main,
.entry-content{
  max-width:100%;
  overflow-x:hidden;
}

.tl-hero-slider,
.tl-hero-slider.is-fullbleed{
  width:100vw;
  max-width:100vw;
  overflow:hidden;
}

#cc-banner,
.cc-banner{
  max-width:100vw;
  box-sizing:border-box;
  left:0;
  right:0;
}

#tmt-theme-toggle,
.tmt-theme-toggle{
  position:fixed;
  right:16px;
  max-width:calc(100vw - 32px);
  box-sizing:border-box;
}