/* RegelWerk site styles: one visual system for all pages (see docs/reference/style-guide.md).
   Scope: .rw-page wraps the content of every RegelWerk page. Components: chart.css, process.css, header.css. */

/* 1. Tokens ---------------------------------------------------------------------------------- */
.rw-page{
 --rw-navy:#183152; --rw-cyan:#009ccd; --rw-text:#43566c; --rw-muted:#607387;
 --rw-tint:#eef4f8; --rw-tint-line:#e1eaf1; --rw-line:#dce5ed; --rw-white:#fff;
 --rw-measure:720px;            /* reading width for running text */
 --rw-pad:clamp(24px,3.2vw,40px);/* inner padding of panels and the page intro */
 --rw-card-pad:24px;
 --rw-gap:20px;                 /* gap in card grids */
 --rw-section:64px;             /* space between sections */
 --rw-radius:12px;              /* panels and cards */
 --rw-radius-media:8px;         /* photos, logo tiles, icon tile */
 font-family:var(--wp--preset--font-family--body,Inter,system-ui,sans-serif);
 font-size:16px; line-height:1.7; color:var(--rw-text);
}
.rw-page *{box-sizing:border-box}

/* 2. Type ------------------------------------------------------------------------------------ */
.rw-page h1,.rw-page h2,.rw-page h3{font-family:inherit;color:var(--rw-navy);font-weight:600;font-style:normal;margin:0;overflow-wrap:break-word}
.rw-page h1{font-size:clamp(2.1rem,3.6vw,3rem);line-height:1.15;letter-spacing:-.03em;margin-bottom:24px;max-width:var(--rw-measure)}
.rw-page h2{font-size:clamp(1.6rem,2.6vw,2.1rem);line-height:1.2;letter-spacing:-.02em;margin-bottom:20px;scroll-margin-top:24px}
.rw-page h3{font-size:1.25rem;line-height:1.35;letter-spacing:-.01em;margin-bottom:12px}
.rw-page p,.rw-page li{font-size:16px;line-height:1.7;color:var(--rw-text)}
.rw-page p{margin:0 0 16px;max-width:var(--rw-measure)}
.rw-page p:last-child{margin-bottom:0}
.rw-page .has-small-font-size,.rw-page details p{font-size:14px;line-height:1.65}
.rw-page .rw-meta{font-size:13px;line-height:1.55;color:var(--rw-muted);margin-bottom:12px}
.rw-page figcaption{font-size:12px;line-height:1.5;color:var(--rw-muted);margin:8px 0 0;text-align:left}
.rw-page .rw-eyebrow{font-size:12px;font-weight:600;line-height:1.5;letter-spacing:.07em;color:var(--rw-muted);margin:0 0 16px}
/* One highlighted word per H1: logo-blue underline drawn once. */
.rw-page .rw-highlight{position:relative;display:inline-block;white-space:nowrap}
.rw-page .rw-highlight::after{content:"";position:absolute;left:.02em;right:0;bottom:-.04em;height:3px;border-radius:3px;background:var(--rw-cyan);transform-origin:left;animation:rw-highlight 650ms cubic-bezier(.2,.65,.3,1) 180ms both}
.rw-page .rw-highlight+.rw-highlight::after,.rw-page .rw-highlight~.rw-highlight::after{animation-delay:420ms}
@keyframes rw-highlight{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* 3. Links ----------------------------------------------------------------------------------- */
.rw-page a{color:var(--rw-navy);text-decoration:underline;text-decoration-color:var(--rw-cyan);text-decoration-thickness:1px;text-underline-offset:3px}
.rw-page a:hover{text-decoration-thickness:2px}
.rw-page a:focus-visible,.rw-page summary:focus-visible{outline:3px solid var(--rw-navy);outline-offset:4px;border-radius:2px}
/* Standalone action link: one per item or section end; arrow marks it as a link out of the text. */
.rw-page .rw-action{font-size:15px;font-weight:600;line-height:1.5;margin:24px 0 0}
.rw-page .rw-action a{text-decoration-thickness:2px;text-underline-offset:4px}
.rw-page .rw-action a::after{content:" →"}
.rw-page .rw-action a:hover{text-decoration-color:var(--rw-navy)}
/* Jump links in the page intro: one per H2, same words as the heading. */
.rw-page .rw-jump-links{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;line-height:1.6;margin:24px 0 0;max-width:none}
.rw-page .rw-jump-links a{text-decoration-thickness:2px;text-underline-offset:4px}
/* The only button: primary action in the homepage intro. */
.rw-page .wp-block-buttons{margin:0 0 16px;gap:12px}
.rw-page .wp-block-button__link{display:inline-block;font-family:inherit;font-size:15px;font-weight:600;line-height:1.5;padding:12px 20px;border-radius:8px!important;background:var(--rw-navy)!important;color:var(--rw-white)!important;text-decoration:none;transition:background-color 160ms ease}
.rw-page .wp-block-button__link:hover{background:#304b6e!important}

/* 4. Layout: sections, intro, panels, cards, item lists ----------------------------------------- */
.wp-block-group.rw-page{margin:0}
.rw-page>*{margin-block:0!important}
.rw-page>*+*{margin-block-start:var(--rw-section)!important}
/* Page intro: tinted panel, first block of every page; text keeps the reading width. */
.rw-page .rw-intro{background:var(--rw-tint);border:1px solid var(--rw-tint-line);border-radius:var(--rw-radius);padding:var(--rw-pad)!important;color:var(--rw-navy)}
.rw-page .rw-intro p:not(.rw-eyebrow):not(.rw-meta):not(.rw-jump-links){font-size:18px;line-height:1.65}
.rw-page .rw-intro .rw-meta{margin:0}
.rw-page .rw-hero-grid,.rw-page .rw-team-page-hero{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:40px;align-items:center;margin:0}
.rw-page .rw-hero-grid>*,.rw-page .rw-team-page-hero>*{min-width:0;margin:0;flex-basis:auto!important}
/* Panel: tinted box for content that stands apart (chart, facts, definition, partners, contact). */
.rw-page .rw-panel{background:var(--rw-tint);border:1px solid var(--rw-tint-line);border-radius:var(--rw-radius);padding:var(--rw-pad)}
/* Card grids: parallel items of equal weight. */
.rw-page .rw-question-grid,.rw-page .rw-home-research-grid,.rw-page .rw-project-areas,.rw-page .rw-team-page-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--rw-gap);align-items:stretch;margin:0}
.rw-page .rw-team-page-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.rw-page .rw-card{display:flex;flex-direction:column;min-width:0;margin:0;padding:var(--rw-card-pad);background:var(--rw-tint);border:1px solid var(--rw-tint-line);border-radius:var(--rw-radius)}
.rw-page .rw-card::before{content:"";display:block;flex-shrink:0;width:36px;height:3px;border-radius:3px;background:var(--rw-cyan);margin-bottom:20px}
.rw-page .rw-card .rw-action{margin-top:auto;padding-top:16px}
/* Item lists: consecutive entries separated by a hairline. */
.rw-page .rw-news-item,.rw-page .rw-project-step,.rw-page .rw-project-method,.rw-page .rw-project-fact-row,.rw-page .rw-related-entry,.rw-page .rw-project-questions>li{border-top:1px solid var(--rw-line);margin:0}
/* Section intro text below an H2. */
.rw-page .rw-research-intro,.rw-page .rw-home-research-intro{margin:0 0 24px}

/* 5. Details (sources, original titles) -------------------------------------------------------- */
.rw-page .wp-block-details{border-top:1px solid var(--rw-line);padding-top:12px;margin:24px 0 0}
.rw-page .wp-block-details summary{font-size:14px;font-weight:600;line-height:1.6;color:var(--rw-navy);cursor:pointer;padding-block:4px}
.rw-page .wp-block-details>*+*{margin-top:12px}
.rw-page .rw-news .wp-block-details{margin-top:16px}

/* 6. Media: photos, logos, icon ---------------------------------------------------------------- */
.rw-page figure{margin:0}
.rw-page figure img{display:block;max-width:100%;height:auto;border-radius:var(--rw-radius-media)}
.rw-page .rw-hero-photo img{width:100%;height:clamp(370px,32vw,460px);object-fit:cover;object-position:48% 55%}
.rw-page .rw-hero-photo figcaption{text-align:right}
.rw-page .rw-team-photo img,.rw-page .rw-team-page-photo img{width:100%}
/* Logos on a tinted panel sit on white tiles; logos on white do not. */
.rw-page .rw-team-partners,.rw-page .rw-team-page-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--rw-gap);align-items:stretch;margin:0}
.rw-page .rw-team-partners>.wp-block-column,.rw-page .rw-team-page-logo{min-width:0;margin:0}
.rw-page .rw-team-partners .wp-block-image,.rw-page .rw-team-page-logo figure{display:flex;justify-content:center;align-items:center;height:116px;padding:16px;background:var(--rw-white);border-radius:var(--rw-radius-media);margin:0}
.rw-page .rw-team-partners .wp-block-image a,.rw-page .rw-team-page-logo a{display:flex;align-items:center;justify-content:center;max-width:100%;height:100%;text-decoration:none}
.rw-page .rw-team-partners img,.rw-page .rw-team-page-logo img{width:auto!important;max-width:100%;max-height:64px;height:auto!important;object-fit:contain;border-radius:0}
.rw-page .rw-collaborator-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--rw-gap);list-style:none;padding:0;margin:0}
.rw-page .rw-collaborator{min-width:0;margin:0;text-align:center}
.rw-page .rw-collaborator>a{display:block;text-decoration:none}
.rw-page .rw-collaborator-mark{display:flex;align-items:center;justify-content:center;height:58px}
.rw-page .rw-collaborator-mark img{display:block;width:auto;max-width:124px;max-height:42px;object-fit:contain}
.rw-page .rw-collaborator--fdz img{width:152px;max-width:none;max-height:none}
.rw-page .rw-collaborator--hu img{width:42px;height:42px}
.rw-page .rw-collaborator-name{display:block;font-size:12px;line-height:1.5;margin-top:6px;color:var(--rw-muted)}
.rw-page .rw-collaborator>a:hover .rw-collaborator-name{text-decoration:underline;text-decoration-color:var(--rw-cyan);text-underline-offset:3px}

/* 7. Components -------------------------------------------------------------------------------- */
/* Key figure + chart (homepage) */
.rw-page .rw-comparison-row{display:grid;grid-template-columns:minmax(240px,1fr) minmax(0,2fr);gap:36px;align-items:center;margin:0}
.rw-page .rw-comparison-stat,.rw-page .rw-comparison-chart{min-width:0;margin:0}
.rw-page .rw-stat-headline{font-size:clamp(1.25rem,1.9vw,1.5rem);font-weight:600;line-height:1.3;letter-spacing:-.015em;color:var(--rw-navy);margin:0 0 12px}
.rw-page .rw-stat-number{display:block;font-size:clamp(4.5rem,7.5vw,6rem);font-weight:700;line-height:1;letter-spacing:-.055em;margin-bottom:16px;white-space:nowrap}
.rw-page .rw-stat-number::after{content:"";display:block;width:56px;height:3px;background:var(--rw-cyan);margin-top:16px;border-radius:3px}
.rw-page .rw-comparison-chart{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
.rw-page .rw-comparison .rw-chart{min-width:620px;margin:0}
.rw-page .rw-comparison .rw-chart .rw-vertical{display:block}
.rw-page .rw-comparison .rw-chart .rw-horizontal{display:none}
.rw-page .rw-comparison .rw-controls{margin:8px 0 0}
.rw-page .rw-chart .rw-tooltip{font-size:13px;line-height:1.5;color:#526172;max-width:none;margin:0}
.rw-page .rw-comparison .rw-tooltip{font-size:12px}
.rw-page .rw-comparison-context{font-size:12px;line-height:1.5;color:var(--rw-muted);margin:8px 0 0}
.rw-page .rw-project-chart{min-width:0;margin:0}
.rw-page .rw-project-chart .rw-chart{margin:0}
/* Process diagram: placed directly in its section, labelled by an H3 on the homepage. */
.rw-page .rw-process-section{margin:32px 0 0}
.rw-page .rw-process{margin:16px 0 0}
.rw-page .rw-project-phases .rw-process{margin:0 0 24px}
/* News */
.rw-page .rw-news-item{display:grid;grid-template-columns:minmax(0,1fr) 260px;column-gap:40px;align-items:start;padding:28px 0}
.rw-page .rw-news-item:last-child{padding-bottom:0}
.rw-page .rw-news-copy{min-width:0;margin:0}
.rw-page .rw-news-copy>h3{margin-bottom:8px}
.rw-page .rw-news-copy .rw-action{margin-top:16px}
.rw-page figure.rw-news-photo{width:100%;max-width:260px}
.rw-page .rw-news-photo--banner img{aspect-ratio:16/9;object-fit:contain;background:var(--rw-tint)}
/* Team section (homepage) */
.rw-page .rw-team-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:40px;align-items:center;margin:0 0 32px}
.rw-page .rw-team-copy{min-width:0;margin:0}
.rw-page .rw-team-partner-section>h3{margin-bottom:20px}
.rw-page .rw-team-collaborators{margin:32px 0 0}
.rw-page .rw-team-collaborators>h3,.rw-page .rw-team-funding>h3{margin-bottom:16px}
.rw-page .rw-team-funding{border-top:1px solid var(--rw-line);margin:32px 0 0;padding-top:28px}
.rw-page .rw-team-funding-row{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:32px;align-items:center;margin:0}
.rw-page figure.rw-funding-logo{width:220px;max-width:100%}
.rw-page .rw-funding-logo img{border-radius:0}
/* Contact: H2 like every section; one panel row: icon tile · invitation · email. */
.rw-page .rw-contact{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:16px 28px;align-items:center}
.rw-page .rw-contact::before{content:"";display:block;width:64px;height:64px;border-radius:var(--rw-radius-media);background:var(--rw-white) url('assets/icons/mail.svg') center/32px 32px no-repeat}
.rw-page .rw-contact>p{margin:0}
.rw-page .rw-contact-email{font-size:20px;font-weight:600;line-height:1.5;white-space:nowrap}
.rw-page .rw-contact-email a{text-decoration-thickness:2px;text-underline-offset:5px}
/* Project page */
.rw-page .rw-project-questions{list-style:none;counter-reset:rw-q;padding:0;margin:0}
.rw-page .rw-project-questions>li{counter-increment:rw-q;display:grid;grid-template-columns:42px minmax(0,1fr);gap:16px;padding:20px 0;font-size:20px;font-weight:500;line-height:1.5;color:var(--rw-navy);max-width:calc(var(--rw-measure) + 58px)}
.rw-page .rw-project-questions>li::before,.rw-page .rw-project-step::before{font-size:15px;font-weight:600;color:var(--rw-navy);border-top:3px solid var(--rw-cyan);padding-top:4px;align-self:start}
.rw-page .rw-project-questions>li::before{content:counter(rw-q,decimal-leading-zero)}
.rw-page .rw-project-steps{counter-reset:rw-step;margin:0}
.rw-page .rw-project-step{counter-increment:rw-step;display:grid;grid-template-columns:42px minmax(0,1fr);gap:0 16px;padding:24px 0}
.rw-page .rw-project-step::before{content:counter(rw-step,decimal-leading-zero);grid-row:1 / span 3}
.rw-page .rw-project-step>*{grid-column:2}
.rw-page .rw-project-method{display:grid;grid-template-columns:240px minmax(0,1fr);gap:0 32px;padding:24px 0}
.rw-page .rw-project-method>h3{grid-column:1;grid-row:1 / span 4}
.rw-page .rw-project-method>p{grid-column:2}
.rw-page .rw-project-fact-row{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px;padding:16px 0}
.rw-page .rw-project-fact-row:first-of-type{border-top:0;padding-top:0}
.rw-page .rw-project-fact-row p{margin:0}
.rw-page .rw-project-fact-label{color:var(--rw-navy)}
/* Team page */
.rw-page .rw-team-page-intro{min-width:0;margin:0}
.rw-page .rw-team-page-names{color:var(--rw-navy);font-weight:500;line-height:1.85}
/* Related research */
.rw-page .rw-related-entries{margin:0}
.rw-page .rw-related-entry{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);gap:32px;padding:28px 0}
.rw-page .rw-related-entry:first-child{border-top:0;padding-top:4px}
.rw-page .rw-related-publication,.rw-page .rw-related-description{min-width:0;margin:0}
.rw-page .rw-related-entry h3{overflow-wrap:anywhere}
.rw-page .rw-related-publication .rw-action{margin-top:12px}

/* 8. Responsive -------------------------------------------------------------------------------- */
@media(max-width:900px){
 .rw-page .rw-comparison-row{grid-template-columns:1fr;gap:24px}
 .rw-page .rw-related-entry{grid-template-columns:1fr;gap:16px}
 .rw-page .rw-contact{grid-template-columns:64px minmax(0,1fr)}
 .rw-page .rw-contact-email{grid-column:2}
}
@media(max-width:800px){
 .rw-page{--rw-section:48px}
 .rw-page .rw-hero-grid,.rw-page .rw-team-page-hero,.rw-page .rw-team-intro{grid-template-columns:1fr;gap:28px}
 .rw-page .rw-hero-photo img{height:auto;aspect-ratio:16/10}
 .rw-page .rw-question-grid,.rw-page .rw-home-research-grid,.rw-page .rw-project-areas,.rw-page .rw-team-page-grid{grid-template-columns:1fr;gap:16px}
 .rw-page .rw-team-partners,.rw-page .rw-team-page-logos,.rw-page .rw-collaborator-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
 .rw-page .rw-project-method{grid-template-columns:1fr}
 .rw-page .rw-project-method>h3,.rw-page .rw-project-method>p{grid-column:1;grid-row:auto}
}
@media(max-width:700px){
 .rw-page .rw-news-item{grid-template-columns:1fr;row-gap:20px;padding:24px 0}
 .rw-page figure.rw-news-photo{max-width:320px}
}
@media(max-width:600px){
 .rw-page .rw-intro p:not(.rw-eyebrow):not(.rw-meta):not(.rw-jump-links){font-size:17px}
 .rw-page .rw-project-fact-row{grid-template-columns:1fr;gap:4px}
 .rw-page .rw-project-questions>li{font-size:18px;grid-template-columns:32px minmax(0,1fr);gap:12px}
 .rw-page .rw-project-step{grid-template-columns:32px minmax(0,1fr);gap:0 12px}
 .rw-page .rw-team-funding-row{grid-template-columns:1fr;gap:16px}
 .rw-page .rw-contact{grid-template-columns:1fr;gap:16px;align-items:start}
 .rw-page .rw-contact::before{width:48px;height:48px;background-size:28px 28px}
 .rw-page .rw-contact-email{grid-column:auto;font-size:18px;white-space:normal;overflow-wrap:anywhere}
 .rw-page .rw-team-partners .wp-block-image,.rw-page .rw-team-page-logo figure{height:96px;padding:12px}
}
@media(prefers-reduced-motion:reduce){.rw-page .rw-highlight::after{animation:none}.rw-page .wp-block-button__link{transition:none}}
@media print{.rw-page .rw-highlight::after{animation:none}}
