/* ===================================================================
   🐢  Turtle Programming Language (TPL)
   -------------------------------------------------------------------
   Document:   /assets/css/company-info.css
   Component:  Company Info — Executive Board Mosaic Slot
   Version:    v6.1.0-TRTL
   Rules:
   - Slot scoped only (.exec-board)
   - Zero bleed, no global tags
   - No PHP logic coupling
   - Portable across sub-stations
   =================================================================== */

/* ============================================================
   PAGE CONTAINER
   ============================================================ */

.company-info{
  max-width:1200px;
  margin:48px auto;
  padding:0 20px;
}

/* Executive board heading */

.company-exec-heading{
  font-size:clamp(20px,2.6vw,28px);
  margin:36px 0 22px;
  color:var(--t-green);
}

/* ============================================================
   SLOT: EXECUTIVE BOARD MOSAIC
   PURPOSE: 2 × 3 locked corporate gallery
   ROOT: .exec-board
   ============================================================ */

.exec-board{
  position:relative;
  isolation:isolate;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  grid-template-rows:repeat(2, 1fr);
  gap:20px;
  margin:0 0 72px;
}

/* Single frame */

.exec-frame{
  position:relative;
  border-radius:20px;
  overflow:hidden;
  background:radial-gradient(circle at 0 0,#0e4727,#02130b);
  box-shadow:0 18px 40px rgba(0,0,0,.22);
}

/* Height authority — prevents poster blow-outs */
.exec-frame::before{
  content:"";
  display:block;
  padding-top:125%; /* portrait board ratio */
}

/* Image containment */

.exec-frame img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Hover focus affordance */

.exec-frame:focus-within,
.exec-frame:hover{
  box-shadow:0 24px 54px rgba(0,0,0,.32);
}

/* Tablet */

@media (max-width:960px){
  .exec-board{
    grid-template-columns:repeat(2,1fr);
    grid-template-rows:repeat(3,1fr);
  }
}

/* Mobile */

@media (max-width:600px){
  .exec-board{
    grid-template-columns:1fr;
    grid-template-rows:none;
  }
}