/* ==========================================================================================
   Desktop page layout (1025 px and up only). Phones and tablets keep their own layouts so they
   can be tuned separately.

   1. One page width. Boxed top-level sections (Press was 1180 px) use the same 1260 px column
      as every full-width section, so left and right edges line up from page to page.
   2. Long pages (Accessibility, History, Privacy and the other "On this page" pages) use the
      width: a slim sticky contents rail at left, the sections in two columns beside it, and the
      help card closing the page. The row is found by its shape (a column holding an eyebrow +
      icon list first), so pages already saved in Elementor pick this up without re-importing.
      --sloff-longpage-cols (default 2) can be set to 1 on the row for a single reading column.
   ========================================================================================== */
@media (min-width:1025px){
	/* Archive pages (2026 Festival and the other years): the page <main> already supplies the side gutters, and the archive
	   section added its own on top, leaving the content 1080 px wide and 90 px inside every other page. The film page's
	   wrapper capped content + gutters at 1260 for the same result. Both now give a 1260 px content column. */
	body .sloff-archive-page > .sloff-archive--page{padding-inline:0}
	body .sloff-archive-film-wrap{max-width:calc(var(--sloff-content-max) + 2 * var(--sloff-gutter))}

	body .elementor[data-elementor-type="wp-page"] > .e-con-boxed:not(:has(.sloff-hero)){
		--content-width:var(--sloff-content-max);
		--padding-left:max(var(--sloff-gutter), calc((100% - var(--sloff-content-max)) / 2));
		--padding-right:max(var(--sloff-gutter), calc((100% - var(--sloff-content-max)) / 2));
	}

	body .elementor :is(.e-con.sloff-longpage, .e-con:has(> .e-con:nth-child(1) > .elementor-widget-heading.eyebrow + .elementor-widget-icon-list)){
		--sloff-rail:232px;
		display:grid;
		grid-template-columns:var(--sloff-rail) minmax(0, 1fr);
		grid-template-areas:"toc body" "toc help";
		column-gap:clamp(40px, 5vw, 80px);
		row-gap:var(--sloff-space-6);
		align-items:start;

		& > .e-con{width:auto;max-width:none;min-width:0}
		& [id]{scroll-margin-top:calc(var(--wp-admin--admin-bar--height, 0px) + var(--sloff-space-6))}

		/* Contents rail: a hairline track with a marker beside the section being read. */
		& > .e-con:nth-child(1){
			grid-area:toc;position:sticky;top:calc(var(--wp-admin--admin-bar--height, 0px) + var(--sloff-space-6));align-self:start;
			--gap:0px;gap:0;padding:0;
			& .elementor-widget-heading{margin:0 0 var(--sloff-space-3);padding-left:var(--sloff-space-4)}
			& .elementor-icon-list-items{margin:0;padding:0;border-left:1px solid var(--sloff-line-strong)}
			& .elementor-icon-list-item{margin:0;padding:0}
			& .elementor-icon-list-item::after{display:none}
			& .elementor-icon-list-item > a{display:block;margin-left:-1px;padding:var(--sloff-space-2) var(--sloff-space-4);border-left:2px solid transparent;text-decoration:none;transition:border-color .15s ease}
			& .elementor-icon-list-text{padding:0;color:var(--sloff-text-muted);font-size:var(--sloff-fs-14);font-weight:var(--sloff-fw-semibold);line-height:1.35;transition:color .15s ease}
			& .elementor-icon-list-item > a:is(:hover,:focus-visible) .elementor-icon-list-text{color:var(--sloff-text)}
			& .elementor-icon-list-item > a[aria-current="true"]{border-left-color:var(--sloff-fest-accent)}
			& .elementor-icon-list-item > a[aria-current="true"] .elementor-icon-list-text{color:var(--sloff-text)}
		}

		/* Sections flow down two columns and never split mid-section (the long venue section may). */
		& > .e-con:nth-child(2){
			grid-area:body;display:block;
			columns:var(--sloff-longpage-cols, 2);column-gap:clamp(32px, 4vw, 64px);
			& > .e-con{width:100%;margin:0 0 40px;break-inside:avoid}
			& > .e-con:has(.sloff-venues__list){break-inside:auto}
			& .sloff-venue-card{break-inside:avoid}
			& > .elementor-widget{width:100%}
			& > .elementor-widget-heading{margin-bottom:var(--sloff-space-2);break-after:avoid}
			& > .elementor-widget-text-editor{margin-bottom:32px}
		}

		/* Help card: a wide closing band, message at left and the buttons at right. */
		& > .e-con:nth-child(3){
			grid-area:help;
			& > .e-con.card{
				display:grid;grid-template-columns:minmax(0, 1fr) auto;grid-auto-flow:row dense;
				column-gap:var(--sloff-space-6);align-items:center;
				& > .elementor-widget-heading, & > .elementor-widget-text-editor{grid-column:1}
				& > .elementor-widget-button{grid-column:2}
			}
		}
	}

	/* Narrow desktops: a single reading column beside the rail. */
	@media (max-width:1279px){
		body .elementor :is(.e-con.sloff-longpage, .e-con:has(> .e-con:nth-child(1) > .elementor-widget-heading.eyebrow + .elementor-widget-icon-list)){
			--sloff-rail:208px;--sloff-longpage-cols:1;
		}
	}
}
