/* Cutover fixes only — Transitions theme (not Sozo Paris).
   Weebly editor/CDN scripts are stripped; keep layout usable offline. */

/* Basic Weebly element helpers formerly in sites.css */
.wsite-elements { word-wrap: break-word; }
.wsite-image img { max-width: 100%; height: auto; border: 0; }
.wsite-image-border-none a { display: inline-block; }
.wsite-social { display: inline-block; }
.wsite-social-item {
  display: inline-block;
  vertical-align: middle;
  text-indent: -9999px;
  overflow: hidden;
}
.wsite-social-item-inner { display: block; width: 100%; height: 100%; }

/* Multicol tables stay fluid on narrow viewports */
.wsite-multicol-table { width: 100%; border-collapse: collapse; border-spacing: 0; }
.wsite-multicol-col { vertical-align: top; }

/* Hide leftover editor selection markers if any remain */
.rangySelectionBoundary { display: none !important; }

/* Footer: archive had Weebly promo; leave empty container for spacing */
#footer { min-height: 1em; color: transparent; font-size: 0; }
#footer a { display: none; }

/* Phase-1 mobile pass (max-width:700px): keep desktop look; fix phone overflow/stacking.
   Prefer width fixes over overflow-x:hidden (body overflow-x only as last resort). */
@media (max-width: 700px) {
  /* 1. Fluid wrappers — kill fixed 960px floor */
  #wraper,
  .container,
  #header-wrap,
  #nav-wrap,
  #banner-wrap,
  #main-wrap,
  #footer-wrap {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }
  .container {
    padding-left: 12px;
    padding-right: 12px;
  }
  #banner-wrap .container {
    width: auto !important;
    max-width: 100% !important;
    padding-left: 8px;
    padding-right: 8px;
  }

  /* 2. Nav: wrap to ~2 rows so all 6 links stay visible */
  #nav-wrap {
    text-align: center;
  }
  #nav-wrap #topnav {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0;
    padding: 4px 4px 8px !important;
    display: block !important;
    background-size: 100% 100%;
    box-sizing: border-box;
  }
  #nav-wrap ul {
    float: none !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
    padding: 0;
  }
  #nav-wrap ul li,
  #nav-wrap ul > span {
    float: none !important;
    display: inline-block;
    padding: 0 2px !important;
    background: none !important; /* hide nav-sep on wrapped rows */
  }
  #nav-wrap ul li a {
    float: none !important;
    display: inline-block;
    padding: 10px 10px 8px !important;
    font-size: 12px;
    box-sizing: border-box;
  }

  /* 3. Multicol: stack full-width */
  .wsite-multicol-table-wrap {
    margin: 0 !important;
  }
  .wsite-multicol-table,
  .wsite-multicol-tbody,
  .wsite-multicol-tr {
    display: block !important;
    width: 100% !important;
  }
  .wsite-multicol-col {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 4. Images shrink with viewport */
  img,
  .wsite-image img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* 5. Soften header; center logo */
  #header {
    height: auto !important;
    min-height: 0;
  }
  #header td {
    display: block;
    width: 100% !important;
    text-align: center !important;
  }
  #logo,
  #logo a {
    padding: 16px 8px !important;
    text-align: center;
  }
  #header-right {
    float: none !important;
    padding: 0 8px 12px !important;
  }
  #header-right table {
    float: none !important;
    margin: 0 auto;
  }
  #header-wrap .social {
    float: none !important;
    clear: none;
    text-align: center;
  }

  /* 6. Store short banner: shrink without odd crush */
  #banner-wrap,
  #banner,
  #banner-top,
  #banner-mid,
  #banner-inner {
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
    background-size: 100% auto;
  }
  .short-header-page .wsite-header,
  .tall-header-page .wsite-header {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 100px;
    background-size: cover !important;
    background-position: center top !important;
  }
  #banner #tl,
  #banner #br,
  #banner #inner-top,
  #banner #inner-bottom,
  #banner #inner-left,
  #banner #inner-right {
    display: none; /* decorative corners crush oddly when scaled */
  }

  /* Last resort only if a stray fixed child still overflows */
  body {
    overflow-x: hidden;
  }
}
