/*!
Theme Name: EaG LS EC2026
Theme URI: eag-lausanne.ch
Author: Niels Wehrspann
Author URI: https://www.niels-wehrspann.com
Description: Thème pour le site Ensemble à Gauche Lausanne pour les élections communales 2026
Version: 1.0.2
Text Domain: eag-lausanne-26 */

*,*::before,*::after {box-sizing: inherit;}

@font-face {
	font-family: 'Azeret Mono';
	src: url('polices/AzeretMono-Regular.woff2') format('woff2'), url('polices/AzeretMono-Regular.woff') format('woff');
	font-weight: 400; font-style: normal;
}

@font-face {
	font-family: 'Azeret Mono';
	src: url('polices/AzeretMono-Bold.woff2') format('woff2'), url('polices/AzeretMono-Bold.woff') format('woff');
	font-weight: 700; font-style: normal;
}

@font-face {
	font-family: 'Azeret';
	src: url('polices/Azeret-SemiBold.woff2') format('woff2'), url('polices/Azeret-SemiBold.woff') format('woff');
	font-weight: 400; font-style: normal;
}

@font-face {
	font-family: 'Azeret';
	src: url('polices/Azeret-SemiBoldItalic.woff2') format('woff2'), url('polices/Azeret-SemiBoldItalic.woff') format('woff');
	font-weight: 400; font-style: italic;
}

html {box-sizing: border-box; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%;
--rouge-eag26: #ff3f00; font-size: 1vw;}
body {margin: 0; transition: 1s; -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s;}

a {background-color: transparent; text-decoration: none; color:inherit;}
p a:after, #subpage td a:after {content:" \2197"; font-size:1rem; width:1rem; display: inline-block; text-align: center; transform: translateY(-.25rem);}
p a:hover:after, #subpage td a:hover:after {transform: translateY(-.25rem) rotateZ(45deg); transition:all .2s ease-in-out}
abbr[title] {border-bottom: none;text-decoration: underline;text-decoration: underline dotted;}
b,strong {font-weight: bolder;}
code,kbd,samp {font-family: monospace, monospace;font-size: 1em;}
small {font-size: 80%;}
sub,sup {font-size: 75%;line-height: 0;position: relative;vertical-align: baseline;}
sub {bottom: -0.25em;}
sup {top: -0.5em;}
img {border-style: none;}
button,input,optgroup,select,textarea {font-family: inherit;font-size: 100%;line-height: 1.15;margin: 0;}
button,input {overflow: visible;}
button,select {text-transform: none;}
button,[type="button"],[type="reset"],[type="submit"] {-webkit-appearance: button;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style: none;padding: 0;}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline: 1px dotted ButtonText;}
fieldset {padding: 0.35em 0.75em 0.625em;}
legend {color: inherit;display: table;max-width: 100%;padding: 0;white-space: normal;}
progress {vertical-align: baseline;}
textarea {overflow: auto;}
[type="checkbox"],[type="radio"] {padding: 0;}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height: auto;}
[type="search"] {-webkit-appearance: textfield;outline-offset: -2px;}
[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
::-webkit-file-upload-button {-webkit-appearance: button;font: inherit;}
details {display: block;}
summary {display: list-item;}
template {display: none;}
[hidden] {display: none;}

hr {border-top:.5rem solid black !important; margin:none; padding:none; width:100vw; transform:translateX(-4rem);}


h1,h2,h3,h4,h5,h6 {clear: both;}
h1, h2, h3, h4, h5, h6, #masthead p, #masthead a, #masthead li, #menu-toggle, #menu-close {font-family: 'Azeret Mono', monospace; text-transform: uppercase; hyphens: none; margin:0; padding:0; font-feature-settings: "ss04", "ss05", "ss11";}
.wp-block-table table, .wp-block-table td {font-family: 'Azeret Mono', Azeret Mono, monospace;}
td, .wp-block-table table td {border:none; padding:.5rem 2rem .5rem 0; vertical-align: text-top;}
tr {border-top:.15rem solid;}

h1 {font-size: 9rem; line-height:7rem;}
h2 {font-size:6rem; line-height:5rem;}
h3 {font-size:4.8rem ; line-height:4rem}
h4 {font-size:3.6rem ; line-height:3rem}
h5 {font-size:2.4rem; line-height:2rem;}
p, ul {font-family: 'Vollkorn', serif;}
p, li {margin: 0; font-size:1.5rem; line-height:2rem;}
dfn,cite,em,i {font-style: italic;}
ul {list-style-type: none; padding:0; margin:0;}
li { padding-left: 4rem; text-indent: -4rem; }
li:before { content: "\2192"; padding-right: 2rem; }


/* Header */
#masthead {display:grid; grid-template-columns: 1fr 1fr 4fr; position: fixed; top:0; left:0; width:100vw; padding:1vh 1.5vw; z-index:100;}
#masthead p, #masthead a, #masthead li {font-size: 1rem; line-height: .9rem; color:black; margin:0; padding:1rem 1rem 1rem 0;}
#primary-menu {display:flex; justify-content: space-between;}
#primary-menu li {width:auto;}
#primary-menu li, #site-title, #site-description {max-width:15ch;}
#site-navigation a, #site-navigation a:visited {text-decoration: none;}
#masthead .current_page_item a {font-weight: 700; font-size: 1.1rem;}
nav li {padding-left:0; text-indent: 0;}
nav li:before {content:""; padding:0;}
.page {margin: 0;}
#menu-toggle {display:none; z-index:1000; position:fixed; top:0; left:0; background:none; border:none; width:100%; padding:1rem;}
#menu-close {display:none; position:fixed; top:1rem; right:1rem; background:none; border:none; font-size:2rem; line-height: 2rem; padding:1rem;}

/* Accueil */
#image-fond {width:100%; height:100vh; overflow:hidden; position:fixed; top:0; left:0; z-index:0;}
#image-fond img {width:100%; height:auto; position:absolute; top:0%; left:0; transform-origin: top left; image-rendering: crisp-edges;}

#intro {position: relative; margin:50vh 0;}
#intro h1, #intro h2 {z-index:100; position: relative; color:white; margin:0 0 0 5vw; font-size:9vw; line-height:7.2vw; mix-blend-mode: normal; hyphens:none;}
#intro h1:not(#doubleh1) {opacity: 0.5;}
h2#doubleh1 {position:absolute; top:0; left:0; color:var(--rouge-eag26); mix-blend-mode: multiply;}


#logos .wp-block-columns {width:52vw; margin:1rem 0 0 5vw;}
.wp-block-image {fill:var(--rouge-eag26); mix-blend-mode: multiply;}

/* Texte intro */
#introduction {position:relative; display: block; background:white; z-index: 20; min-height:100vh; display: flex; align-items: center; justify-content: center; padding:4rem 5rem;}
#intro-content {columns:2; column-gap:4vw; orphans: 3;}
#introduction p {font-family: 'Azeret', Azeret, sans-serif; orphans: 3; text-wrap: balance;}
#introduction h2, #introduction h3, #introduction h4 {position: relative; display: block; color:var(--rouge-eag26); margin-bottom:4.2rem;}
#introduction h2, #introduction h3 {column-span: all;}
#introduction h4 {margin:2rem 0 0 2rem; font-size:1.6rem; line-height:2rem;}
#introduction p + p {text-indent:2rem;}

/* Programme */
section.programme {position:relative; width:100%; height:100vh; margin:0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr;}
.programme-title { padding:4vh 5vw; margin:0; position:relative; display: block;}
.programme-title h2, .programme-title h3 {font-size:6vw; line-height:5vw; text-align:left; text-indent:none; margin:0; padding:0; hyphens: auto; width:45vw;}
.programme-title h2 {top:0; left:0; color:white; opacity: .5;}
.programme h3 {position:absolute; top:4vh; left:5vw; color:var(--rouge-eag26); mix-blend-mode:multiply; display: block;}
.programme-content {overflow:hidden; margin:0 auto; font-size:2rem; line-height:2.4rem; padding:4vh 4vw; background:white;}

.programme-text {padding-bottom:4rem;}

.programme-content li {border-top:.2rem solid; margin:0; padding-top:.6rem; padding-bottom:.6rem;}
.programme-content li:first-child, .programme-content li:nth-child(2) {color:var(--rouge-eag26);}

.pin-spacer {pointer-events:none; width:1vw !important;}

/* À propos */


/* Candidat·exs */
#candidates h1 {color:var(--rouge-eag26);}
#candidates {margin-top:25vh; padding:0 2vw; overflow: hidden;}
#candidates-container {width:100%; margin:4vh 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));  grid-gap: 1vw; margin-top:2rem;}
.candidatex {margin-top:1rem;}
.candidatex h3 {font-family: Azeret Mono, 'Azeret Mono', monospace; font-size:2rem; line-height: 1.75rem; text-transform: uppercase; hyphens: manual; margin-top:.5rem;}
.candidatex p {font-size:1rem; line-height: 1.2rem; margin:.5rem 0 0 0;}
.photo-container {width:100%; aspect-ratio: 4/5; display: block; overflow: hidden; position:relative;}
.candidatex-photo {height:100%; width:100%; object-fit: cover;}
p.cand-parti, p.cand-annee {font-family: Azeret Mono, ' Azeret Mono', monospace; font-size:1rem; line-height: 1.25rem; text-transform: uppercase; margin:0;}


/* Page */
#subpage {margin:25vh 0 5vh 0; padding:3rem;}
#subpage h1 {font-size:4.5rem; line-height: 4rem;}
#subpage h2, #subpage h3 {font-size:2.5rem; line-height: 2rem;}
.info-container {width:75vw; margin:0 0 5rem 0;}
.info-container h1, .info-container h2, .info-container h3, #subpage h2, #subpage h3 
{width:25vw; transform: translateY(110%);}
#subpage .numerote {width:75vw; display:grid; grid-template-columns:27vw 50vw; transform: none; margin:4rem 0 2rem 0;}
.info-container p, #subpage p, .info-container h4, #subpage h4 {width:50vw; margin-left:27vw;}
.info-container h4, #subpage h4, .info-container h5, #subpage h5 {margin:4rem 0 2rem 27vw;}
.info-container p + p, #subpage p + p {text-indent: 2rem;}

/* Pied de page */
#colophon {display: block; position: relative; background:var(--rouge-eag26); min-height: 100vh; padding:10vh 5rem;}
#colophon p {font-family: Azeret, 'Azeret', sans-serif; margin:0;}
#colophon a {padding:.2rem .4rem 1rem 0;}
#colophon .wp-block-image svg {width:2.5rem; height:2.5rem; fill:black;}
#colophon .wp-block-image img {width:2.5rem; height:2.5rem; display: block; text-align:left;}
#colophon a:hover img {width:2.9rem; height:2.9rem; transition:all .2s;}
#colophon a:hover {padding:0rem 0 .8rem 0; transition:all .2s;}


/* Forms */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, 0.8);
	line-height: 1;
	padding: 0.6em 1em 0.4em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}


.custom-logo-link {display: inline-block;}


/* Accessibility */

/* Text meant only for screen readers. */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus {
	outline: 0;
}

@media all and (orientation:portrait) {
	html {font-size:1.25vw;}

	/* Texte intro */
	#intro {margin-top:93vh;}
	#intro-content {columns:1;}

	/* Programme */
	section.programme {display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr 1fr;}
	.programme-title h2, .programme-title h3 {hyphens: none; width:auto; padding-left:5vw; padding-right:5vw;}
	.programme-text {padding-bottom:4rem; padding-left:5vw; padding-right:5vw;}
	.programme-text p, .programme li {font-size:2rem; line-height:1.25;}
	.programme-content li {border-top:.2rem solid; margin:0; padding-top:.6rem; padding-bottom:.6rem;}

	/* Candidat·exs */
	#candidates-container {grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));  grid-gap: 2vw;}
	.candidatex h3 {font-size:3rem; line-height: 2.5rem; margin-top:.5rem;}
	.candidatex p {font-size:1.8rem; line-height: 2rem; margin:.5rem 0 0 0;}
	p.cand-parti, p.cand-annee {font-size:1.7rem; line-height: 1.7rem; margin:0;}
	
	.info-container {width:100%;}
	.info-container h1, .info-container h2, .info-container h3, #subpage h2, #subpage h3 
	{width:33vw; transform: translateY(110%);}
	#subpage .numerote {width:100%; display:grid; grid-template-columns:35vw 60vw;}
	.info-container p, #subpage p, .info-container h4, #subpage h4 {width:60vw; margin-left:35vw;}
	.info-container h4, #subpage h4, .info-container h5, #subpage h5 {margin:4rem 0 2rem 35vw;}
	.info-container p + p, #subpage p + p {text-indent: 2rem;}

	footer .wp-block-columns.is-layout-flex {flex-wrap:nowrap !important;}

}

@media all and (orientation:portrait) and (max-width:600px) {
	html {font-size:16px;}

	h1 {font-size: 3.4rem; line-height:3rem; hyphens: auto;}
	h2 {font-size:3.4rem; line-height:3rem; hyphens: auto;}
	h3, .programme-title h2, .programme-title h3 {font-size:3.4rem ; line-height:3rem; hyphens: auto;}
	h4, #introduction h4 {font-size:2.2rem ; line-height:2rem; hyphens: auto;}
	h5 {font-size:1.5rem; line-height:2rem; hyphens: auto;}
	li {padding:2rem; text-indent:-2rem;}
	li::before {padding-right:1rem;}
	#masthead {display: none; position:fixed; width:100%; height:100vh; background:white; border:1px solid black; z-index:1001; padding:2rem;}
	#menu-toggle {display:block;}
	#masthead p, #masthead li, #masthead a, #masthead .current_page_item a {font-size:1.5rem; line-height: 1.5rem;}

	#masthead.mobile-menu-open {display: block;}
	#menu-toggle.mobile-menu-open {display:none;}
	.mobile-menu-open #menu-close {display:block;}
	.mobile-menu-open #site-title, .mobile-menu-open #site-description {color:var(--rouge-eag26);}
	.mobile-menu-open #primary-menu {display: block;}

	#intro h1, #intro h2 {font-size:16vw; line-height:13vw;}
	#logos .wp-block-columns {width:85vw; margin:.5rem 0 0 5vw; font-size:1vw;}

	#introduction {padding:2rem .5rem;}

	.programme-title h2, .programme-title h3 {width:90vw;}
	.programme-title h2 {padding:1rem;}
	.programme-title h3 {padding:0; top:1rem; left:1rem;}
	.programme-title {padding:0;}
	.programme-content {padding:1rem 1rem;}
	.programme-text {padding:0;}
	.programme-text p, .programme li {font-size:1rem; line-height:1.25;}
	.programme-text p + p {text-indent: 2rem;}
	.programme-content ul {margin-top:1rem;}
	.programme-content li {border-top:.1rem solid; margin:0; padding-top:.2rem; padding-bottom:1rem;}

	#candidates h1, #subpage h1 {hyphens: manual; font-size:2.4rem; line-height:2rem;}
	.candidatex h3 {font-size:1.4rem; line-height: 1.25rem;}
	.candidatex p {font-size:1.1rem; line-height: 1.25rem; margin-top:.2rem;}
	.candidatex p.cand-annee, .candidatex p.cand-parti {margin:0; padding:0;}
	#candidates-container {grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));  grid-gap: 4vw; margin-top:2rem;}

	#subpage {padding:1rem;}
	.info-container h1, .info-container h2, .info-container h3, #subpage h2, #subpage h3 
	{width:100%; transform: none; margin:4rem 0 2rem 0;}
	#subpage .numerote {width:100%; display:grid; grid-template-columns:10vw 1fr;}
	.info-container p, #subpage p, .info-container h4, #subpage h4 {width:100%; margin-left:0;}
	.info-container h4, #subpage h4, .info-container h5, #subpage h5 {margin:4rem 0 2rem 0;}
	.info-container p + p, #subpage p + p {text-indent: 2rem;}

	footer .wp-block-columns.is-layout-flex {flex-wrap:wrap !important;}
	#colophon {padding:4rem 2rem;}
	#colophon a {padding:0 .4rem 0 0;}
}