/* Shared phone fixes, linked from every page. Page-specific layout stays in each page's own <style>. */

/* Pages whose banner is dark (<body data-dark-hero>) start with a dark header, so the header and the
   phone browser bar match the banner. assets/js/header.js adds .tec-scrolled once the page is scrolled,
   which brings back the white glass header. Dark is the default, so the first paint never flashes white. */
body[data-dark-hero] header:not(.tec-scrolled) { background: #08080c !important; border-bottom-color: transparent !important; }
body[data-dark-hero] header:not(.tec-scrolled) img[alt="TEC"] { filter: brightness(0) invert(1); }
body[data-dark-hero] header:not(.tec-scrolled) .tec-burger { color: #fff !important; }
body[data-dark-hero] header:not(.tec-scrolled) .tec-nav-links > a,
body[data-dark-hero] header:not(.tec-scrolled) .tec-nav-dropdown > a { color: rgba(255,255,255,0.85) !important; }
body[data-dark-hero] header { transition: background 0.3s; }

@media (max-width: 768px) {
  /* iOS Safari zooms into any form field with text smaller than 16 px. */
  input, select, textarea { font-size: 16px !important; }
}

@media (max-width: 640px) {
  /* Footer "#STRONGER TOGETHER": 190 px instead of 280 px, so less empty space around the phone-size text. */
  #tec-stronger-together { height: 190px !important; }
}