/* ============ st60 — het werkgebied onder Gevestigd in 2006 (#feiten): de keuze uit st59-gebied vastgezet, op de
   computer variant 2 (de fries), op de telefoon variant 3 (vanuit Den Haag); de grens is 620/621px. Gezet door
   ../st60-gebied-vast.py. Elke .vN is :root geworden (zelfde gewicht), zie clients/_pipeline/VARIANTS.md. ============ */

/* ── het lint heeft zijn oude plek verlaten; de naad onder Onze diensten krijgt onderaan de grond van de sectie
   eronder in plaats van het groen van het lint (anders hangt er een halve groene strook) ── */
:root .naar__naad{background:var(--kalk-100)}
/* de schaduw van de kaart viel op het groen en werd daar door de sectie eronder afgesneden; op de lichte grond is die
   rand te zien (4/255). De kaart ligt nu boven de sectie, zodat de schaduw zacht uitloopt. */
:root .naar{z-index:1}
:root .gb{margin:0;container-type:inline-size}
:root .gb p{margin:0}
:root .gb__plaatsen{margin:0;padding:0;list-style:none}


@media (min-width:621px){

  /* ═════════ 2 · de fries ═════════
     Geen vlak: een regel tussen twee donkergroene haarlijnen op de lichte grond. "Ons werkgebied" cursief, midden op de
     bovenste lijn; de zeven plaatsen in kapitalen (Inter, de letter van de labels van de pagina, op leesbare maat), Den
     Haag voorop en vet. Op de computer onder het blok én de foto door, de namen op één regel met goudstippen ertussen;
     smaller Den Haag erboven en de zes in kolommen. */
  @media (max-width:1040px){
    :root .feiten__in{row-gap:32px}
    :root .feit--spec{margin-top:calc(3.2rem - 32px)}
  }
  @media (min-width:1041px){
    :root .gv{grid-column:1;grid-row:1}
    :root .feit--spec{grid-column:2;grid-row:1}
    :root .gb--fries{grid-column:1 / -1;grid-row:2}
  }
  :root .gb--fries{
    display:block;text-align:center;
    border-bottom:1px solid var(--groen-900);
    padding-bottom:clamp(16px,1.5vw,20px);
  }
  :root .gb--fries .gb__label{
    display:flex;align-items:center;gap:18px;
    font-family:var(--serif);font-style:italic;font-weight:400;line-height:1;
    font-size:clamp(20px,5.6cqi,24px);color:var(--groen-900);white-space:nowrap;
  }
  :root .gb--fries .gb__label::before,:root .gb--fries .gb__label::after{
    content:"";flex:1 1 0;height:1px;background:var(--groen-900);
  }
  :root .gb--fries .gb__plaatsen{
    display:grid;grid-template-columns:repeat(2,auto);justify-content:center;column-gap:clamp(28px,8cqi,44px);row-gap:4px;
    margin-top:16px;
    font-family:var(--sans);font-weight:600;font-size:14px;line-height:1.6;letter-spacing:.16em;text-transform:uppercase;
    color:var(--groen-800);
  }
  :root .gb--fries .gb__thuis{
    grid-column:1 / -1;justify-self:center;margin-bottom:6px;
    font-weight:700;font-size:15px;letter-spacing:.2em;color:var(--groen-900);
  }
  @container (min-width:420px){
    :root .gb--fries .gb__plaatsen{grid-template-columns:repeat(3,auto)}
  }
  @container (min-width:1000px){
    :root .gb--fries .gb__plaatsen{display:flex;justify-content:center;align-items:center;gap:0;margin-top:18px}
    :root .gb--fries .gb__plaatsen li{white-space:nowrap}
    :root .gb--fries .gb__thuis{margin:0}
    :root .gb--fries .gb__plaatsen li+li::before{
      content:"";display:inline-block;vertical-align:middle;width:5px;height:5px;margin:0 18px 0 calc(18px - .16em);
      border-radius:50%;background:var(--bak-600);position:relative;top:-1px;
    }
  }
  /* breed genoeg (de volle breedte van de pagina, vanaf 1200px scherm): de kapitalen een maat groter */
  @container (min-width:1100px){
    :root .gb--fries .gb__plaatsen{font-size:15px}
    :root .gb--fries .gb__thuis{font-size:16px}
  }

  /* het blok van de telefoon staat hier niet */
  :root .gb--vanuit{display:none}

}


@media (max-width:620px){

  /* ═════════ 3 · vanuit Den Haag ═════════
     Herkomst en bereik. Links "Vanuit" cursief en Den Haag groot, rechts tegen een goudlijn; rechts van de lijn de zes
     plaatsen onder elkaar. De lijn staat op de middenas van het blok, dus precies onder het midden van 2006.
     Op de lichte grond, 32px onder het blok. */
  @media (max-width:1040px){
    :root .feiten__in{row-gap:32px}
    :root .feit--spec{margin-top:calc(3.2rem - 32px)}
  }
  :root .gb--vanuit{
    display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;
    column-gap:clamp(16px,4.4vw,28px);
  }
  :root .gb--vanuit .gb__basis{text-align:right;line-height:1.1}
  :root .gb--vanuit .gb__vanuit{
    display:block;font-family:var(--serif);font-style:italic;font-weight:400;
    font-size:clamp(19px,5.4cqi,24px);color:var(--groen-700);
  }
  :root .gb--vanuit .gb__thuis{
    display:block;margin-top:4px;font-family:var(--serif);font-weight:400;line-height:1.05;white-space:nowrap;
    font-size:clamp(26px,8.6cqi,40px);color:var(--groen-900);
  }
  :root .gb--vanuit .gb__as{align-self:stretch;width:1px;background:var(--bak-600)}
  :root .gb--vanuit .gb__plaatsen{
    font-family:var(--serif);font-weight:400;font-size:clamp(17px,4.8cqi,19px);line-height:1.55;color:var(--groen-900);
    text-align:left;
  }

  /* het blok van de computer staat hier niet */
  :root .gb--fries{display:none}

}