.entry_photo:has(.cover-words), .sheet_photo:has(.cover-words) {
  position: relative;
}

.cover-words[data-astro-cid-g7zdzlxh] {
  position: absolute;
  inset: 0;
  container-type: size;
  pointer-events: none;
  color: #fff;
  background: radial-gradient(62% 32% at 50% 47%, #0406289e, #04062800 100%), radial-gradient(55% 50% at 100% 100%, #040628d1, #04062880 40%, #04062800 100%), linear-gradient(#04062800 68%, #040628b3 100%);
}

.cover-words_main[data-astro-cid-g7zdzlxh] {
  position: absolute;
  left: 6cqw;
  right: 6cqw;
  top: 47%;
  transform: translateY(-50%);
  text-align: center;
}

.cover-words_title[data-astro-cid-g7zdzlxh] {
  margin: 0;
  font-weight: var(--w-regular);
  font-size: min(9.3cqw, 19cqh);
  line-height: 1;
  letter-spacing: var(--ls-display);
}

.cover-words_line[data-astro-cid-g7zdzlxh] {
  margin: .9em 0 0;
  font-weight: var(--w-regular);
  font-size: min(2.8cqw, 5.6cqh);
  line-height: 1.2;
  letter-spacing: -.01em;
  opacity: .92;
}

.cover-words_logo[data-astro-cid-g7zdzlxh] {
  position: absolute;
  right: min(5cqw, 8cqh);
  bottom: min(5cqw, 8cqh);
  display: block;
  width: auto;
  max-width: none;
  height: min(6.5cqw, 13cqh);
}

html:not(.reduce) .sheet_photo .cover-words_logo[data-astro-cid-g7zdzlxh] {
  opacity: 0;
  transition: opacity 1s var(--ease-move) 1.1s;
}

html:not(.reduce) .sheet_photo.is-in .cover-words_logo[data-astro-cid-g7zdzlxh] {
  opacity: 1;
}

@container (width <= 707px) or (height <= 353px) {
  .cover-words_logo[data-astro-cid-g7zdzlxh] {
    display: none;
  }
}

@container (width <= 520px) {
  .cover-words_line[data-astro-cid-g7zdzlxh] {
    display: none;
  }
}
@font-face{font-family:'TWK Everett';src:url('/fonts/everett/TWKEverett-Bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
/* The sheet study (D273; StudySheet.astro). A read sheet on two lines: the left column for what a reader looks for first
   (the facts, the titles and, on a panel, its line under its title), the right one from the 40% line for the reading.
   The panels on the night and on the light grey keep the same two lines inside them. Tokens only; the two values the
   design rules do not give stay here, not in tokens.css, until the layout is adopted. */
:root{
  --read-wait:.3;                                   /* D273: a statement's word before it fills in (study.js) */
}
/* the sheet's own padding half as wide again as the other sheets' (Zana, 2 November 2026: "the main modal right/left
   padding should be increased here also by 50% of its current value"): 48px for 32, 36 for 24 on a tablet, 24 for 16
   on a phone */
.sheet.is-study{--sheet-pad:var(--s-7)}
@media (max-width:991px){.sheet.is-study{--sheet-pad:calc(var(--s-5) + var(--s-3))}}
@media (max-width:767px){.sheet.is-study{--sheet-pad:var(--s-5)}}

/* ---- The bar (Zana, 2 November 2026: Contact taken out of the test sheet, and the close control redrawn). Its words
   in the small text's size and in sentence case, as the design rules ask; the cross in a circle drawn by a hairline.
   Pointed at or focused, the circle fills with the accent from its middle and the cross turns white once the fill is
   under it: the colour switches without a transition, a little after the fill starts to come and to go, so the cross
   is never white on white or ink on the accent. Focus is marked by the filled circle, not the browser's ring (as
   D272). Over the night at the foot the circle's line is the night's, it fills with white and the cross turns ink ---- */
.sheet.is-study .sheet_where{font-size:var(--fs-kicker);line-height:var(--lh-kicker);letter-spacing:0;text-transform:none}
.sheet.is-study .sheet_actions .close-button{position:relative;isolation:isolate;gap:var(--s-3);padding:0;font-size:var(--fs-kicker);line-height:var(--lh-kicker);letter-spacing:0;text-transform:none;color:var(--text)}
.sheet.is-study .sheet_actions .close-button .icon{box-sizing:border-box;width:var(--s-6);height:var(--s-6);padding:var(--s-2);border:var(--stroke-hair) solid var(--divider);border-radius:var(--r-round);color:var(--text);transition:color 0s linear .15s,border-color 0s linear .15s}
.sheet.is-study .sheet_actions .close-button::after{content:"";position:absolute;right:0;top:50%;z-index:-1;width:var(--s-6);height:var(--s-6);margin-top:calc(var(--s-6) / -2);border-radius:var(--r-round);background:var(--accent);transform:scale(0);transition:transform var(--d-respond) var(--ease-arrive);pointer-events:none}
@media (hover:hover){
  .sheet.is-study .sheet_actions .close-button:hover::after{transform:none}
  .sheet.is-study .sheet_actions .close-button:hover .icon{color:var(--text-inverse);border-color:var(--accent);transition:color 0s linear .1s,border-color 0s linear .1s}
}
.sheet.is-study .sheet_actions .close-button:focus-visible{outline:none}
.sheet.is-study .sheet_actions .close-button:focus-visible::after{transform:none}
.sheet.is-study .sheet_actions .close-button:focus-visible .icon{color:var(--text-inverse);border-color:var(--accent);transition:color 0s linear .1s,border-color 0s linear .1s}
.sheet.is-study.is-on-foot .sheet_actions .close-button{color:var(--text-inverse)}
.sheet.is-study.is-on-foot .sheet_actions .close-button .icon{color:var(--text-inverse);border-color:var(--border-inverse)}
.sheet.is-study.is-on-foot .sheet_actions .close-button::after{background:var(--accent-inverse)}
@media (hover:hover){.sheet.is-study.is-on-foot .sheet_actions .close-button:hover .icon{color:var(--text);border-color:var(--accent-inverse)}}
.sheet.is-study.is-on-foot .sheet_actions .close-button:focus-visible .icon{color:var(--text);border-color:var(--accent-inverse)}
/* a phone: the circle alone, its word still its name */
@media (max-width:767px){.sheet.is-study .sheet_actions .close-button{gap:0;font-size:0}}
/* Back (D276), shown on the full story to name the overview: drawn as Close is, its arrow in the circle before its
   words; where it shows, the place's name gives way */
.sheet.is-study .sheet_back{position:relative;isolation:isolate;gap:var(--s-3);padding:0;font-size:var(--fs-kicker);line-height:var(--lh-kicker);letter-spacing:0;text-transform:none;color:var(--text)}
.sheet.is-study .sheet_back .icon{box-sizing:border-box;flex:none;width:var(--s-6);height:var(--s-6);padding:var(--s-2);border:var(--stroke-hair) solid var(--divider);border-radius:var(--r-round);color:var(--text);transform:none;transition:color 0s linear .15s,border-color 0s linear .15s}
.sheet.is-study .sheet_back::after{content:"";position:absolute;left:0;top:50%;z-index:-1;width:var(--s-6);height:var(--s-6);margin-top:calc(var(--s-6) / -2);border-radius:var(--r-round);background:var(--accent);transform:scale(0);transition:transform var(--d-respond) var(--ease-arrive);pointer-events:none}
@media (hover:hover){
  .sheet.is-study .sheet_back:hover::after{transform:none}
  .sheet.is-study .sheet_back:hover .icon{color:var(--text-inverse);border-color:var(--accent);transform:none;transition:color 0s linear .1s,border-color 0s linear .1s}
}
.sheet.is-study .sheet_back:focus-visible{outline:none}
.sheet.is-study .sheet_back:focus-visible::after{transform:none}
.sheet.is-study .sheet_back:focus-visible .icon{color:var(--text-inverse);border-color:var(--accent);transition:color 0s linear .1s,border-color 0s linear .1s}
.sheet.is-study .sheet_start:has(.sheet_back:not([hidden])) .sheet_where{display:none}

/* ---- The way to the full story (D276): the site's text link under the first statement, at the size the News entries'
   links have, with the expand mark in its circle (Zana, 2 November 2026, of a pill first drawn here: "that does not
   belong to my design system. it should be this cta style") ---- */
.read_more{margin:var(--s-6) 0 0}

/* ---- The full story as a sheet over the overview (D278; Zana, 2 November 2026: "this should open from below"): as
   wide as the sheet, its top a step below the sheet's, so the overview shows above it, dimmed; it scrolls by itself and
   has its own bar, Back to the overview and Close, with a hairline under it once it has scrolled (study.js) ---- */
.sheet.is-study .sheet_over{position:fixed;z-index:1;top:calc(var(--sheet-top) + var(--s-5));left:var(--sheet-side);right:var(--sheet-side);bottom:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;border-radius:var(--r-sheet) var(--r-sheet) 0 0;background:var(--surface);color:var(--text)}
.sheet.is-study .sheet_over::-webkit-scrollbar{display:none}
.sheet.is-study .sheet_over[hidden]{display:none}
.sheet.is-study .sheet_over-bar::after{opacity:0}
.sheet.is-study .sheet_over.is-scrolled .sheet_over-bar::after{opacity:1}
.sheet.is-study .sheet_over-body{padding:var(--s-6) var(--sheet-pad) var(--s-8)}
/* the overview under it dimmed by the dialogs' darkness, coming as the sheet rises and going as it goes down */
/* hidden, not only clear, once it has gone: a clear layer over the whole panel still answered the style panel's
   picking, which makes every layer answer the pointer, and took every pick */
.sheet.is-study .sheet_panel::after{content:"";position:absolute;inset:0;z-index:3;border-radius:inherit;background:var(--scrim);opacity:0;visibility:hidden;transition:opacity var(--motion-fold),visibility 0s var(--motion-fold);pointer-events:none}
.sheet.is-study.is-over .sheet_panel::after{opacity:1;visibility:visible;transition:opacity var(--motion-lift),visibility 0s}

/* ---- The full story's opening (D276): its name on the left, what it tells at the statement size on the 40% line ---- */
.read_story-kind{margin:0;color:var(--text-3)}
.read_story-title{margin:0;color:var(--text);text-wrap:pretty;outline:none}

/* ---- The two lines. The parts of text stand in from both sides by the panels' padding, so their words start where the
   panels' words do (Zana, 2 November 2026: "text content elements like this... should have an indent from left and
   right"); the photograph and the panels keep the full width ---- */
.read{--panel-pad:var(--s-7)}
.read_intro,.read_part,.read_close,.read_panel{display:grid;grid-template-columns:calc(40% - .2 * var(--panel-pad)) minmax(0,1fr)}
.read :is(.read_intro,.read_part,.read_close){padding-inline:var(--panel-pad)}
.read_side{grid-column:1;min-width:0;padding-right:var(--s-6)}
.read_main{grid-column:2;min-width:0}

/* ---- The opening: the title at the long titles' size and its line, and under them the kind and the date on one
   line, all from the sheet's left edge (Zana, 2 November 2026: the title stacked over the date rather than two
   columns); the photograph framed under them, opening as the topics' do ---- */
.read_opening{padding:var(--s-6) 0 var(--s-7)}
.read_head{min-width:0}
.read_meta{display:flex;flex-wrap:wrap;gap:0 var(--s-4);margin:var(--s-7) 0 0}
.read_kind{color:var(--text)}
.read_date{color:var(--text-3)}
.sheet.has-opening .read_title{margin:0;max-width:var(--measure-statement)}
#sheet-vinnova .read_title{max-width:none}
.read_photo.sheet_photo{margin:0}

/* ---- The facts beside the first statement ---- */
.read_intro{padding:var(--s-8) 0 0}
/* each value straight under its label, the facts a step apart (Zana, 2 November 2026, of a case study's facts: "all 3
   should have a closer gap like this. mine have to much gap") */
.read_facts{grid-column:1;display:grid;align-content:start;gap:var(--s-4);margin:0;padding-right:var(--s-6)}
/* each fact in a narrow column, so a long one runs to two lines (Zana, the same day: "this should be the width, so some
   of the lines would be 2 lines"): 11rem, two steps of the scale, which holds "the site's design rules" (10.4rem) on one
   line and breaks "News, the five areas and" (11.9rem) and "Nine references and the" (11.6rem) */
.read_fact{max-width:calc(var(--s-9) + var(--s-7))}
/* the label in ink and its value in the quiet grey (Zana, the same day: "the muted text is actually the value and the
   attribute is the one with ink") */
.read_fact dt{font-size:var(--fs-kicker);line-height:var(--lh-kicker);color:var(--text)}
.read_fact dd{margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-3)}
/* the Vinnova copy's facts: each label a title, larger than its value */
#sheet-vinnova .read_fact dt{font-size:var(--fs-title-s);font-weight:var(--w-regular);line-height:var(--lh-title-s);letter-spacing:var(--ls-title-s)}
/* and each value on one line where the column allows it, two at most */
#sheet-vinnova .read_fact{max-width:none}
.read_statement{grid-column:2;margin:0;color:var(--text);text-wrap:pretty}
/* waiting to fill in: the words at a third of the ink, until the statement comes into view (study.js) */
html:not(.reduce) .read_statement.is-waiting .read_word{opacity:var(--read-wait)}

/* ---- A reading part: its title alone on the left, the paragraphs or the list on the 40% line ---- */
.read_part{padding:var(--s-8) 0 0}
.read_part-title{margin:0;text-wrap:balance}
.read_main>.read_text{margin:0;max-width:var(--measure-text)}
.read_main>.read_text+.read_text{margin-top:var(--s-4)}
/* the points under small titles: the Vinnova article's (sheet.css: article_questions), after the part's paragraph */
.read_main>.read_text+.article_questions{margin-top:var(--s-6)}

/* ---- The panels: the night and the light grey in place of a hairline where the sheet changes subject. The text
   column starts on the sheet's own 40% line: 40% of the panel's inner width less a fifth of its padding ---- */
.read_panel{row-gap:var(--s-7);margin:var(--s-8) 0 0;padding:var(--s-8) var(--panel-pad);border-radius:var(--r-card)}
.read_panel.is-night{background-color:var(--surface-prussian);background-image:var(--depth-prussian);color:var(--text-inverse)}
.read_panel.is-light{background:var(--surface-1)}
.read_panel-title{margin:0;color:inherit;text-wrap:balance}
/* a panel's line under its title on the left; only a part that is just text has its title alone there (Zana,
   2 November 2026: "The top paragraph for elements like this should be under the title") */
.read_panel-text{margin:var(--s-5) 0 0;max-width:var(--measure-body)}
/* the line no wider than its title (Zana, the same day: "the paragraph should be indented more so that it doesn't...
   get wider than its title"): the title alone sets the left column's width, and the line fills it without adding to it */
.read_panel .read_side{width:fit-content}
.read_panel .read_panel-text{contain:inline-size}
.read_panel.is-night .read_panel-text{color:var(--text-inverse-2)}

/* ---- The parts at a glance: two to a row, each a card drawn by the night's line, its drawing on the left and its
   name running into its sentence ---- */
.glance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3);margin:0;padding:0;list-style:none}
.glance_item{display:flex;align-items:flex-start;gap:var(--s-5);min-width:0;padding:var(--s-5);border:var(--stroke-hair) solid var(--line-night);border-radius:var(--r-card)}
.glance_text{margin:0;font-size:var(--fs-body);font-weight:var(--w-light);line-height:var(--lh-body);color:var(--text-inverse-2);text-wrap:pretty}
.glance_name{font-weight:var(--w-regular);color:var(--text-inverse)}
#sheet-vinnova .read_panel.is-night .read_panel-text,
#sheet-vinnova .glance_text{color:var(--text-inverse)}
/* the Vinnova copy's framework panel (D283): its title and line above the cards, the cards across the panel two to a
   row, each with its drawing and its sentence centred on each other, the name in bold running into its sentence at the
   sentence's size, the drawings lit in their own blue */
#sheet-vinnova .read_panel.is-night{grid-template-columns:minmax(0,1fr)}
#sheet-vinnova .read_panel.is-night .read_main{grid-column:1}
#sheet-vinnova .glance{gap:var(--s-4)}
#sheet-vinnova .glance_item{align-items:center}
#sheet-vinnova .glance_name{font-weight:700}
#sheet-vinnova .glance_layer.is-key :is(line,rect,circle,path){stroke:var(--c-blue-300)}
#sheet-vinnova .glance_layer.is-key .is-fill{fill:var(--c-blue-300);stroke:none}
/* its line as wide as its title, in two even lines */
#sheet-vinnova .read_panel.is-night .read_panel-text{max-width:none;text-wrap:balance}
/* the drawing: its lines on one layer, its point on another over them */
.glance_drawing{position:relative;flex:none;display:block;width:var(--s-8);aspect-ratio:4/3}
.glance_layer{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.glance_layer *{vector-effect:non-scaling-stroke}
.glance_layer :is(line,rect,circle,path){fill:none;stroke:var(--line-art);stroke-width:var(--stroke-hair)}
.glance_layer .is-tick{stroke-width:var(--stroke-icon)}
.glance_layer .is-dash{stroke-dasharray:3 3}
.glance_layer .is-frame{stroke:var(--line-night)}
.glance_layer .is-faint{stroke:var(--border-inverse)}
.glance_layer .is-fill{fill:var(--line-art);stroke:none}
.glance_layer .is-fill.is-faint{fill:var(--border-inverse)}
.glance_layer.is-key :is(line,rect,circle,path){stroke:var(--accent-inverse)}
.glance_layer.is-key .is-fill{fill:var(--accent-inverse);stroke:none}
/* waiting to come up as the panel comes into view, each part's point lighting last (study.js) */
html:not(.reduce) .glance.is-waiting :is(.glance_item,.glance_layer.is-key){opacity:0}

/* ---- The figures: few and large, in the accent, each with the line that says what it counts ---- */
.figures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-7) var(--s-6);margin:0;padding:0;list-style:none}
.figure{min-width:0}
.figure_value{margin:0;font-size:var(--fs-display);font-weight:var(--w-regular);line-height:var(--lh-display);letter-spacing:var(--ls-display);color:var(--accent)}
#sheet-vinnova .figure_value{font-size:var(--fs-statement);line-height:var(--lh-statement);letter-spacing:var(--ls-statement)}
.figure_line{margin:var(--s-3) 0 0;max-width:var(--measure-body);color:var(--text);text-wrap:pretty}
/* the Vinnova copy's grey panel: its lines in Light, the weight of paragraphs at the body size; the main action at the
   foot of the left column, level with the last line beside it */
#sheet-vinnova .figure_line{font-weight:var(--w-light)}
#sheet-vinnova .read_panel.is-light .read_side{display:flex;flex-direction:column}
#sheet-vinnova .read_panel.is-light .sheet_action{margin-top:auto;padding-top:var(--s-6)}
html:not(.reduce) .figures.is-waiting .figure{opacity:0}

/* ---- The close: its statement, a line and the main action, the pair at the body size as the article's ---- */
.read_close{padding:var(--s-8) 0 var(--s-8)}
.read_close-statement{margin:0;text-wrap:balance}
.read_close .read_main>.read_text{margin-top:var(--s-4)}
/* the list under the statement, in the area topics' bullets (sheet.css: sheet_scope), the main action under it */
.read_close .read_list{margin:var(--s-5) 0 0}
.read_close .sheet_action{margin-top:var(--s-6)}
.read .sheet_action .team_button{gap:var(--s-1)}
.read .sheet_action .team_button-text{min-height:var(--s-7);padding:var(--s-3) var(--s-5);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:var(--w-regular);letter-spacing:var(--ls-body);text-transform:none}
.read .sheet_action .team_button-arrow{width:var(--s-7);height:var(--s-7);margin-left:0}
.read .sheet_action :is(.team_button-text,.team_button-arrow){border-radius:var(--r-card)}

/* ---- The way on: a panel of the night inside the sheet, as the parts' panel is, with the sheet's white round it, so
   it reads as the sheet's own end; as a band to the sheet's edges it met the night round the sheet, and the cards on
   it looked outside the sheet (Zana, 2 November 2026: "I don't like that the cards are just floating"). The bar stays
   white over it, as over the other panels. Each place a white card (Zana, the same day: "can you try make these cards
   white"), its photograph inset at the top, its tag at the top left of its words, its title in ink and its line in grey,
   and at its foot, at the same height on every card, the site's text link. Pointed at (Motion's hover, study.js: is-on)
   or focused, the card's link answers as the map's entries' do (theme.css): the ring goes, the name steps into its
   place and the accent's circle comes with the expand mark (D274) ---- */
.read_close{padding-bottom:0}
.read_way{margin:var(--s-8) 0 0;padding:var(--s-7);border-radius:var(--r-card);background-color:var(--surface-prussian);background-image:var(--depth-prussian);color:var(--text-inverse)}
.places{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3);margin:0;padding:0;list-style:none}
.places_item{display:flex;min-width:0}
.place-card{position:relative;flex:1;display:flex;flex-direction:column;min-width:0;padding:var(--s-1);border-radius:var(--r-card);background:var(--surface);color:var(--text);text-decoration:none;scroll-margin-top:calc(var(--sheet-bar) + var(--s-4))}
.place-card_photo{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;border-radius:var(--r-inset);background:var(--surface-2)}
.place-card_photo img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover}
.place-card_text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3);padding:var(--s-5) var(--s-4) 0}
.place-card_tag{margin-bottom:var(--s-1)}
.place-card_title{font-size:var(--fs-title-s);line-height:var(--lh-title-s);letter-spacing:var(--ls-title-s);text-wrap:balance}
.place-card_line{font-size:var(--fs-body);font-weight:var(--w-light);line-height:var(--lh-body);color:var(--text-3);text-wrap:pretty}
.place-card_go{display:inline-flex;align-self:flex-start;align-items:center;margin-top:auto;padding:var(--s-6) var(--s-4) var(--s-4);font-size:var(--fs-body);line-height:1.2;color:var(--text)}
#sheet-vinnova .place-card_photo{aspect-ratio:3/2}
@media (min-width:992px){#sheet-vinnova .place-card{min-height:calc(var(--s-9) * 4 + var(--s-7))}}
#sheet-vinnova .place-card_text{gap:var(--s-2);padding-top:var(--s-4)}
#sheet-vinnova .place-card_go{padding-top:var(--s-5)}
#sheet-vinnova .place-card_tag{position:absolute;z-index:1;top:calc(var(--s-1) + var(--s-4));left:calc(var(--s-1) + var(--s-4));max-width:calc(100% - var(--s-6) - var(--s-2));margin:0;background:var(--surface);color:var(--text)}
/* the Vinnova overview's way on: its title as the parts' titles are, in the night's white; the cards drawn by a quiet
   outline, as tall as their words, their links under them */
#sheet-vinnova-topic-0 .sheet_way-head{margin:0 0 var(--s-6);color:var(--text-inverse)}
#sheet-vinnova-topic-0 .place-card{min-height:0;border:var(--stroke-hair) solid var(--border)}
@media (hover:hover){
  .place-card.is-on .go-ring{opacity:0;transform:scale(0)}
  .place-card.is-on .go-label{transform:translateX(-.92em)}
  .place-card.is-on .go-label::after{transform:scaleX(0)}
  .place-card.is-on .go-dot::before{transform:scale(1)}
  .place-card.is-on .go-dot .icon{opacity:1;transform:none;transition:transform var(--motion-unfold),opacity .25s linear .15s}
}
.place-card:focus-visible{outline:var(--focus-width) solid var(--focus-inverse);outline-offset:var(--focus-offset)}
.place-card:focus-visible .go-ring{opacity:0;transform:scale(0)}
.place-card:focus-visible .go-label{transform:translateX(-.92em)}
.place-card:focus-visible .go-label::after{transform:scaleX(0)}
.place-card:focus-visible .go-dot::before{transform:scale(1)}
.place-card:focus-visible .go-dot .icon{opacity:1;transform:none;transition:transform var(--motion-unfold),opacity .25s linear .15s}

/* ---- Narrower windows ---- */
/* the parts' cards too narrow for a drawing beside the words: the drawing above them */
@media (min-width:992px) and (max-width:1599px){
  .glance_item{flex-direction:column;gap:var(--s-4)}
}
/* the right column holds one card to a row */
@media (min-width:992px) and (max-width:1199px){
  .glance{grid-template-columns:minmax(0,1fr)}
  .glance_item{flex-direction:row;gap:var(--s-5)}
}
/* one column: the left column above the text it belongs to; the facts two to a row */
@media (max-width:991px){
  .read_intro,.read_part,.read_close,.read_panel{grid-template-columns:minmax(0,1fr)}
  .read_side,.read_main,.read_facts,.read_statement{grid-column:1}
  .read_side{padding-right:0}
  .read_meta{margin-top:var(--s-6)}
  .read_facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4) var(--s-6);margin-bottom:var(--s-6);padding-right:0}
  /* a fact alone in its row has the row, up to the facts' width */
  .read_fact:last-child:nth-child(odd){grid-column:1/-1}
  .read_part .read_side,.read_close .read_side{margin-bottom:var(--s-5)}
  .read_story .read_side{margin-bottom:var(--s-3)}
  .read{--panel-pad:var(--s-5)}
  .read_panel{row-gap:var(--s-6);padding:var(--s-7) var(--panel-pad)}
  .read_way{padding:var(--s-6) var(--s-5)}
  .places{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* a phone: the parts and the cards one under another */
@media (max-width:767px){
  .read_opening{padding:var(--s-5) 0 var(--s-6)}
  .read_intro,.read_part{padding-top:var(--s-7)}
  .read{--panel-pad:var(--s-4)}
  .read_panel{margin-top:var(--s-7);padding:var(--s-6) var(--panel-pad)}
  .read_close{padding:var(--s-7) 0 0}
  .read_way{margin-top:var(--s-7);padding:var(--s-5) var(--s-4)}
  .glance{grid-template-columns:minmax(0,1fr)}
  #sheet-vinnova .read_facts{grid-template-columns:minmax(0,1fr)}
  .glance_item{gap:var(--s-4);padding:var(--s-4)}
  .glance_drawing{width:var(--s-7)}
  .figures{gap:var(--s-6) var(--s-5)}
  .places{grid-template-columns:minmax(0,1fr)}
  .read_photo.sheet_photo{aspect-ratio:4/3}
}

/* Preserve the reviewed article typography when released with the earlier site baseline. */
#sheet-vinnova .figure_line{font-size:var(--fs-body);line-height:var(--lh-body)}
#sheet-vinnova .tag{padding:.5em 1.05em;font-size:var(--fs-kicker);line-height:1}
@media (min-width:992px){#sheet-vinnova{--gx:max(var(--gs),calc((100vw - var(--page-max,1920px)) / 2 + var(--gs)));--sheet-side:calc(var(--gx) + (100vw - 2 * var(--gx) + 1.5rem) / 12)}}

#sheet-vinnova .article_questions{list-style:none;margin:0;padding:0}
#sheet-vinnova .article_questions li+li{margin-top:var(--s-6);padding-top:var(--s-6);border-top:var(--stroke-hair) solid var(--divider)}
#sheet-vinnova .article_questions h4{margin:0}
#sheet-vinnova .article_questions p{margin:var(--s-4) 0 0}