/* Stylesheet for locations.php */



/* ================================
   LOGO 
   ================================ */

   .offices__logo {
    display: flex;              
    align-items: center;       
    justify-content: flex-start;
    gap: 12px;        
    margin-top: 10px;
    margin-bottom: 10px;        
  }
  
  .offices__logo img {
    height: 100px;               
    width: auto;                
  }
  
  .offices__logo h2 {
    font-size: 28px;            
    margin: 0;                  
  }
  

/* ================================
   FEATURED (Wichita) 
   ================================ */
   .wichita-img {
    display: block;
    margin: 0 auto;           
    width: 100%;               
    max-width: 1200px;         
    height: auto;
    object-fit: cover;      
    border-radius: 16px;      
  }
  
  .office-card--feature {
    max-width: 1200px;
    margin: 0 auto 36px auto;
    background: #fff;
    text-align: left;        
    padding: 22px;
    border-radius: 22px;
    box-shadow: 0 18px 40px rgba(0,0,0,0.22);
    margin-bottom: 20px;
    text-align: center; 
  }
  
  .office-card__body--feature {
    margin: 12px 0;
  }

/* ================================
    FEATURED IMAGE
    ================================ */
    .office-card__img--feature {
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;               
    border-radius: 16px;
    object-fit: cover;   
    margin: 0 0 16px 0;     
  }
  
  @media (min-width: 820px) {
    .office-card--feature .office-card__img--feature {
      aspect-ratio: 16 / 8; 

    }
  }
  
/* ================================
     SECTION SHELL
     ================================ */
  .offices {
    background: #DDDDDD;            
    padding: 64px 16px;
    margin-top: 10px;
  }
  .offices__wrap {
    max-width: 1200px;
    margin: 0 auto;                  
    text-align: center;
    color: #fff;
  }
  .offices__title {
    font-size: clamp(28px, 4vw, 48px);
    margin: 0 0 20px 10px;
    font-weight: 600;
  }
  .offices__sub {
    max-width: 840px;
    margin: 0 auto 32px;
    line-height: 1.6;
    opacity: 0.9;
  }
  
/* ================================
     GRID
     ================================ */
  .office-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
  }
  @media (max-width: 1024px) {
    .office-grid { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 680px) {
    .office-grid { grid-template-columns: 1fr; }
  }
  
/* ================================
     CARD STYLE (non-Wichita cards)
     ================================ */

   .office-card {
    background: #fff;
    color: #1a1a1a;
    border: 2px solid #35e9bc;                      
    border-radius: 22px;              
    box-shadow: 0 18px 40px rgba(0,0,0,.18);
    padding: 22px;                     
    text-align: left;
    display: flex;
    flex-direction: column;
  }
  
  .office-card__media,
  .office-card__img {
    display: block;
    width: 100%;  
    max-width: 400px;                     
    aspect-ratio: 16 / 9;              
    height: auto;                      
    border-radius: 16px;               
    object-fit: cover;                
    object-position: center;
    margin: 0 0 16px 0;               
  }
  
  .office-card__city,
  .office-card__name {
    margin: 0;
    font-size: 20px;
    font-style: italic;                
    font-weight: 500;
    text-align: left;
  }
  
/* ================================
    ANIMATION
    ================================ */
  .reveal {
    opacity: 0;
    transform: translateY(28px) scale(0.98);
    transition: opacity 600ms ease, transform 600ms ease;
    will-change: opacity, transform;
  }
  .reveal.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
  }