@layer components {

	.part { padding-block: clamp(2rem, 1vw, 3rem);}
	.part {
		padding-inline: 10%;
	}
	.part > h2, .part > h3, .part > h4 { text-align:center; margin-bottom: var(--space-4) }
	.part:not(.media-object) .details { max-width: 68ch; margin-inline:auto; padding-inline: 10% }

	/* Past-events list: clean, bullet-free links (Sydney "Past events"). */
	.past-events-list { list-style: none; margin: 0; padding: 0; }
	.past-events-list li { margin-block: .4rem; }
	.past-events-list .past-event-note { color: var(--color-ink-muted); }

	/* Past-sponsor logos shown in the empty Partners section: a centred,
	   greyscale strip (normalised to a common height) so it reads as "past". */
	.past-sponsors { text-align: center; margin-block-start: 0.75rem; }
	/* Match the muted look of the "Sponsors to be announced" empty-state text. */
	.past-sponsors-heading { color: color-mix(in srgb, currentColor 65%, transparent); margin-block-end: 1.25rem; }
	.past-sponsors-logos {
		display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
		gap: clamp(1.5rem, 3vw, 3rem);
		margin-block-start: 2.25rem;   /* clear gap from the heading down to the logos */
	}
	/* #partners-prefixed to beat `#partners img { width:100% }` (id specificity). */
	#partners .past-sponsors-logos img { height: 34px; width: auto; filter: grayscale(1); opacity: .55; }

	/* CFP deadline line under the Speak intro. */
	.speak-deadline { font-weight: var(--weight-medium); }

	/* CFP page: left-align the sub-headings (direct h3/h4) that sit above a
	   block of text or a list, so they line up with that left-aligned content;
	   the h2 section titles (Benefits of Speaking, About You, …) stay centred. */
	#speakforus > h3,
	#speakforus > h4 { text-align: left; }
	/* (Track-heading size lives in typography.css @layer theme — it has to beat
	   the base h3 size, and layer order wins over specificity.) */
	

	
	#at-a-glance ul {
		display: flex;
		flex-wrap: nowrap;
		column-gap: 1%;
		text-align: center;
		padding: 0;
	}
	
	#at-a-glance ul li {
		flex: 0 0 32%;
		list-style-type: none;
	}
	
	#code-of-conduct a:link, #code-of-conduct a:visited {
		--link-color: #fff;
		color: var(--link-color);
		text-decoration: underline;
	}
	
	@media all and (max-width: 720px) {
		#at-a-glance {
			padding-inline: 0;
		}
	}
	
}

/* --- promoted from conference theme to shared components --- */
/* Sub-site bindings of roles to specific components */
@layer components {

	:root {
		--v-block-margin-normal: 2rem;
	}
	


	.part.media-object {
		padding-block: clamp(5rem, 6vw, 4rem);
	}

	#events > p{
		width: 60%;
		margin-inline: auto;
		text-align: center;
	}

	#signup > p{
		width: 60%;
		margin-inline: auto;
		text-align: center;
	}
	
	#signup form.form-container {
		width: 100%;
		max-width: 760px;
		margin-inline: auto;
	}
	
	#register {
		padding-inline: 5% 
	}
	
	#register > p {
		width: 60%;
		margin-inline: auto;
		text-align: center;
	}
	
	.pricing ul {
		font-size: var(--font-size-small);
	}
	
	.pricing .tiers-line {
		font-size: var(--font-size-x-small);
	}
	
	.inclusions {
		margin-block-start: var(--v-block-margin-normal);
		font-size: var(--font-size-small);
		width: 50%;
		line-height: 1.1;
	}
	
	.inclusions > * {
		margin-block: .4em;
	}
	
	#about-aiweek > img {
		width: 32%;
		margin-inline: auto;
		padding-block-end: 1rem
	}
	
	#about-aiweek .details h3 {
		text-align: center;
	}
	
	#about-aiweek .details {
		padding-inline: 0;
	}

	/* Consistent intro-text measure across the pre-program sections, so Speak,
	   AI Week, 2026 events + Past events all line up: same width, centred.
	   id-specific so DR/UXA .details blocks are unaffected. */
	#speak .details,
	#past-events .details,
	#about-aiweek .details,
	#events > p {
		max-width: 62ch;
		width: auto;
		margin-inline: auto;
		padding-inline: 0;
		text-align: center;
	}

	#about-aiweek .details p:last-child {
		text-align: right;
	}
	
	#tracks > p {
		width: 60%;
		margin-inline: auto;
	}
	
	#tracks .content-group > section {
		font-size: smaller;
	}
	
	#partners {
		text-align: center;
	}
  
	  #partners > section {
	  	width: 60%;
	  	margin-inline: auto;
	  }
	  
     #about {
     	padding: 0;
     }
	  
	 #about > .media-object {padding-block: 4rem;
	     padding-inline: 2rem;}
	  
	  
	#about > .media-object img {
		width: 30%;
	}
	
	#johnallsopp.media-object img {
		width: 20%;
	}
	
	#about > #johnallsopp.media-object .details {
		width: 75%;
	}
	
		#about > .media-object .details {
		width: 65%;
		padding-inline: 0;
	}
	
		#speakers h3 {
		margin-block: 1em;
		text-align: center;
	}
	
	#code-of-conduct {
		background-color: var(--color-accent-3);
		color: var(--color-on-accent);
		text-align: center;
	}
	
	
/* narrow */

	@media all and (max-width: 720px) {
	
		nav.page li {
			display: none;
		}
		
		nav.page li:is(:first-child, :nth-child(3), :last-child) {
			display: inline-block
		}
		
	
	
		#page-header p:last-child {
			width: 100%
		}
		
		.media-object img {
			display: none
		}
		
		.media-object .details {
			width: 90%;
			margin-inline: auto;
		}
		
		#tracks > p {
			width: 90%;
		}
		
		#events > p {
			width: 90%;
			margin-inline: auto;
		}
		
		#signup > p {
			width: 90%;
			margin-inline: auto;
		}
		
		#signup form.form-container {
			width: 100%
		}
		
		#register > p {
			width: 90%;
			margin-inline: auto;
		}
		
		#partners > section {
			width: 90%;
		}
		
	
	}	

}

/* Empty-state placeholders for not-yet-announced editions (speakers grid,
   schedule, partners, jobs). Harmless to editions that never hit them. */
.speakers-empty,
.schedule-empty {
	padding-block: clamp(2.5rem, 6vw, 5rem);
	padding-inline: 10%;
}
.speakers-empty,
.schedule-empty,
.partners-empty,
.jobs-empty {
	text-align: center;
	text-wrap: balance;
}
.speakers-empty :is(h2, h3),
.schedule-empty :is(h2, h3),
.partners-empty :is(h2, h3),
.jobs-empty :is(h2, h3) {
	margin-block-end: 0.4rem;
}
/* Mute only the placeholder message, not the heading, so empty-state section
   titles match the other section headings. */
.speakers-empty p,
.schedule-empty p,
.partners-empty p,
.jobs-empty p {
	color: color-mix(in srgb, currentColor 65%, transparent);
}
