/* Layouts for item counts the design did not draw. Loaded after style.css.

   Every repeatable list prints data-count="N". The count the design was drawn with
   matches no rule here, so it keeps the design's own layout; any other count gets one
   of the rules below, inside the same breakpoint range as the design rule it adjusts
   ( the mobile layouts in style.css already work for any count ). */

/* ── project bento ( style.css 931: 4 columns, 1st card 2×2, 4th card 2 wide; drawn for 8 ) ── */
@media (min-width:1100px){
  .bento:not(.flat)[data-count="1"]{grid-template-columns:minmax(0,820px)}
  .bento:not(.flat)[data-count="2"],.bento:not(.flat)[data-count="3"]{grid-template-columns:repeat(var(--n,3),1fr)}
  .bento:not(.flat)[data-count="2"]{--n:2}
  .bento:not(.flat)[data-count="1"]>*,.bento:not(.flat)[data-count="2"]>*,.bento:not(.flat)[data-count="3"]>*{grid-column:auto;grid-row:auto}
  /* 5, 6, 7, 9: the 4th card stays one cell so the 2×2 card is framed by full rows */
  .bento:not(.flat)[data-count="5"]>:nth-child(4),.bento:not(.flat)[data-count="6"]>:nth-child(4),
  .bento:not(.flat)[data-count="7"]>:nth-child(4),.bento:not(.flat)[data-count="9"]>:nth-child(4){grid-column:auto}
  .bento:not(.flat)[data-count="6"]{grid-template-columns:repeat(3,1fr)}
  .bento:not(.flat)[data-count="7"]>:nth-child(n+6){grid-column:span 2}
  /* 10 and more: an even grid */
  .bento:not(.flat):not([data-count="1"]):not([data-count="2"]):not([data-count="3"]):not([data-count="4"]):not([data-count="5"]):not([data-count="6"]):not([data-count="7"]):not([data-count="8"]):not([data-count="9"])>*{grid-column:auto;grid-row:auto}
}

/* ── image-and-title cards ( style.css 909: .svcs 2 columns; .three and .seven by count ) ── */
.svcs[data-count="1"]{grid-template-columns:1fr}
@media (min-width:1100px){
  /* an odd count in two columns: the last card takes the whole row */
  .svcs:not(.three):not(.seven)>.scard:last-child:nth-child(odd){grid-column:1/-1;aspect-ratio:auto;min-height:clamp(300px,26vw,420px)}
}

@media (max-width:1099px) and (min-width:700px){
  /* .three falls to two columns here: an odd last card takes the row */
  .svcs.three>.scard:last-child:nth-child(odd){grid-column:1/-1;aspect-ratio:auto;min-height:320px}
}

/* ── team ( style.css 967: 6 columns, first 2 cards half, then rows of 3; drawn for 2 + 3n ) ── */
@media (min-width:1100px){
  .crew[data-count="1"] article{grid-column:1/-1}
  .crew[data-count="3"] article,.crew[data-count="3"] article:nth-child(-n+2){grid-column:span 2;flex-direction:column}
  /* one left over after the rows of three: the last two share a row */
  .crew[data-count="4"] article:nth-last-child(-n+2),.crew[data-count="7"] article:nth-last-child(-n+2),
  .crew[data-count="10"] article:nth-last-child(-n+2),.crew[data-count="13"] article:nth-last-child(-n+2){grid-column:span 3}
  /* two left over: the last one takes the row */
  .crew[data-count="6"] article:last-child,.crew[data-count="9"] article:last-child,
  .crew[data-count="12"] article:last-child{grid-column:1/-1;flex-direction:row;align-items:flex-start}
}

/* ── picture strips ( style.css 881–884: .strip 4, .pano 3, .mosaic 3 pictures ) ── */
@media (min-width:900px){
  .strip[data-count="1"]{grid-template-columns:minmax(0,1fr)}
  .strip[data-count="2"]{grid-template-columns:repeat(2,1fr)}
  .strip[data-count="3"]{grid-template-columns:repeat(3,1fr)}
  .pano[data-count="1"]:not(.two){grid-template-columns:1fr}
  .pano[data-count="2"]:not(.two){grid-template-columns:1.4fr 1fr}
  .pano.two[data-count="1"]{grid-template-columns:1fr}
  .mosaic[data-count="1"]{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr)}
  .mosaic[data-count="1"]>:first-child{grid-row:auto}
  .mosaic[data-count="2"]{grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr)}
  .mosaic[data-count="2"]>:first-child{grid-row:auto}
}
@media (max-width:899px){
  .pano[data-count="1"]{grid-template-columns:1fr}
  .mosaic[data-count="1"],.mosaic[data-count="2"]{grid-template-rows:minmax(0,1fr)}
  .mosaic[data-count="1"]{grid-template-columns:1fr}
  .mosaic[data-count="1"]>:first-child,.mosaic[data-count="2"]>:first-child{grid-row:auto}
}
.sub .ph .ph-pano[data-count="1"]{grid-template-columns:1fr}
@media (min-width:900px){.sub .ph .ph-pano[data-count="2"]{grid-template-columns:1.4fr 1fr}}

/* ── footer offices ( style.css 227: logo + 4 offices + sitemap ) ── */
@media (min-width:1181px){
  .foot-grid[data-count="0"]{grid-template-columns:1.1fr .7fr}
  .foot-grid[data-count="1"]{grid-template-columns:1.1fr 1fr .7fr}
  .foot-grid[data-count="2"]{grid-template-columns:1.1fr 1fr 1fr .7fr}
  .foot-grid[data-count="3"]{grid-template-columns:1.1fr 1fr 1fr 1fr .7fr}
  .foot-grid:not([data-count="0"]):not([data-count="1"]):not([data-count="2"]):not([data-count="3"]):not([data-count="4"]){grid-template-columns:repeat(4,1fr)}
}

/* ── home: figures ( style.css 190: 4 columns ) and partner logos ( 216: 3 columns ) ── */
@media (min-width:900px){
  .stat-row[data-count="1"]{grid-template-columns:1fr}
  .stat-row[data-count="2"]{grid-template-columns:repeat(2,1fr)}
  .stat-row[data-count="3"],.stat-row[data-count="5"],.stat-row[data-count="6"]{grid-template-columns:repeat(3,1fr);row-gap:34px}
  .stat-row[data-count="5"]>div:nth-child(3n+1),.stat-row[data-count="6"]>div:nth-child(3n+1){border-left:0;padding-left:0}
}
@media (max-width:899px){.stat-row>div:nth-child(odd){border-left:0;padding-left:0}}
.logos[data-count="1"]{grid-template-columns:1fr}
.logos[data-count="2"],.logos[data-count="4"]{grid-template-columns:repeat(2,1fr)}

/* ── checklist of the vision block ( style.css 1252: 4 columns ) ── */
@media (min-width:900px){
  .fut-checks:has(>:only-child){grid-template-columns:minmax(0,420px);justify-content:center}
  .fut-checks:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
  .fut-checks:has(>:nth-child(3):last-child),.fut-checks:has(>:nth-child(5):last-child),.fut-checks:has(>:nth-child(6):last-child){grid-template-columns:repeat(3,1fr)}
}
