body {
	font-family: 'Arial', sans-serif;
	margin: 0;
	padding: 0;
}

.header {
	background-color: #333;
	color: #fff;
	padding: 10px 20px;
	text-align: center;
}

.nav {
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-color: #f2f2f2;
}

.nav li {
	padding: 8px 12px;
}

.nav li:hover {
	background-color: #ddd;
}

.nav li a {
	text-decoration: none;
	color: #333;
	display: block;
}

.content {
	padding: 20px;
}

.footer {
	background-color: #333;
	color: #fff;
	text-align: center;
	padding: 10px 20px;
	position: absolute;
	bottom: 0;
	width: 100%;
}

/* Island Class: hide duplicate theme title on pages with their own hero (2026/10/23, Maths form pages added 2026/10/24, Home added 2026/10/25, IT SBA guide added 2026/10/28) */
body.page-id-8454 .entry-header,
body.page-id-9243 .entry-header,
body.page-id-10738 .entry-header,
body.page-id-10739 .entry-header,
body.page-id-10740 .entry-header,
body.page-id-10399 .entry-header,
body.page-id-9647 .entry-header,
body.page-id-10611 .entry-header,
body.page-id-10614 .entry-header,
body.page-id-10615 .entry-header,
body.page-id-10616 .entry-header,
body.page-id-10617 .entry-header,
body.page-id-10618 .entry-header,
body.page-id-10619 .entry-header,
body.page-id-10620 .entry-header,
body.page-id-10621 .entry-header,
body.page-id-10154 .entry-header,
body.page-id-7569 .entry-header,
body.page-id-9698 .entry-header,
body.page-id-7940 .entry-header,
body.page-id-11181 .entry-header,
body.page-id-11182 .entry-header,
body.page-id-11183 .entry-header,
body.page-id-9230 .entry-header,
body.page-id-11461 .entry-header,
body.page-id-11462 .entry-header,
body.page-id-11463 .entry-header,
body.page-id-11464 .entry-header,
body.page-id-11465 .entry-header,
body.page-id-11466 .entry-header,
body.page-id-11467 .entry-header,
body.page-id-11468 .entry-header,
body.page-id-11469 .entry-header,
body.page-id-11470 .entry-header,
body.page-id-11471 .entry-header,
body.page-id-11327 .entry-header {
	display: none;
}

/* Island Class: hide the Updates change log on pages (2026/10/24)
   Hides the "Updates" heading and the dated change lines under it,
   on PAGES only. Posts are not affected. The © copyright line and
   everything else on the page stay visible.

   ON/OFF SWITCH: the line marked TOGGLE near the bottom of this block.
   - To SHOW the Updates again: on the TOGGLE line, change the word
     none  to  revert   (so it reads  display: revert;)
     then press Save Changes.
   - To HIDE them again: change  revert  back to  none
     (so it reads  display: none;)  then press Save Changes.
   Change only that one word. Leave the rest of this block as it is.

   Which pages it works on: the Updates heading must have the HTML anchor
   "updates" (Heading block > Advanced > HTML anchor) with the © line as
   the last paragraph after the change lines, OR the heading and change
   lines must sit in a Group block with the Additional CSS class
   "ic-updates" (Group block > Advanced). */
body.page .entry-content > #updates,
body.page .entry-content > #updates ~ :is(p, ul, ol):has(~ p:not(:empty)),
body.page .entry-content .ic-updates {
  display: none; /* TOGGLE: none = hidden, revert = shown */
}

/* Island Class: move the right sidebar to the bottom on computers (2026/10/24)
   On computers and wide tablets (986px and wider) this moves the
   right-hand sidebar (Blog Stats, the search box and the donation
   box) from the right side to the bottom of the page, under the
   content and above the footer, on EVERY page, post and archive.
   The content then uses the full 1140px width of the site. This is
   the same thing the theme already does on phones and small tablets.
   On phones and narrow tablets nothing changes.

   ON/OFF SWITCH: the line marked TOGGLE (the first line below).
   - To put the sidebar back on the RIGHT: on the TOGGLE line, change
     986px  to  99999px   (so it reads  @media (min-width: 99999px) {)
     then press Save Changes.
   - To move it to the BOTTOM again: change  99999px  back to  986px
     then press Save Changes.
   Change only that one number. Leave the rest of this block as it is. */
@media (min-width: 986px) { /* TOGGLE: 986px = sidebar at bottom, 99999px = sidebar on right */
  .site-content > .content-area {
    float: none;
    width: 100%;
  }
  .site-content > .widget-area {
    float: none;
    clear: both;
    width: 100%;
    max-width: 820px;
    margin: 1.6em 0 0;
  }
}

/* Island Class: comfortable text width on computers (2026/10/24)
   On computers and wide tablets (986px and wider), plain text in posts,
   pages and archives (paragraphs, lists, quotes and h2 to h4 headings)
   is kept between 760px and 960px wide, depending on the screen size,
   so lines are not too long to read. Everything else still uses the
   full content width: pictures, figures, cards, tables, Try it boxes,
   code, videos, and anything inside groups or columns.
   On phones and narrow tablets nothing changes.

   ON/OFF SWITCH: the line marked TOGGLE (the first line below).
   - For FULL-WIDTH text: on the TOGGLE line, change  986px  to  99999px
     (so it reads  @media (min-width: 99999px) {)  then press Save Changes.
   - To narrow the text again: change  99999px  back to  986px
     then press Save Changes.
   Change only that one number. Leave the rest of this block as it is. */
@media (min-width: 986px) { /* TOGGLE: 986px = comfortable text width, 99999px = full width */
  .entry-content > :is(p, ul, ol, blockquote, h2, h3, h4) {
    max-width: clamp(760px, 70vw, 960px);
  }
}

/* Island Class: hide the theme's duplicate entry title when the content
   already has its own heading or hero title (2026/11/13)

   Why this happens: the Nucleare theme prints an H1.entry-title inside
   .entry-header on every page and post. Many Island Class pages also
   start their content with a styled hero banner that repeats the same
   title as an H2. Sighted visitors then see the title twice.

   What this block does: when that pattern is present, the theme
   .entry-header is visually hidden with a screen-reader-only clip
   (not display:none), so the theme H1 stays available to assistive
   technology. The hero title in the content stays visible on screen.

   Some screen readers may still announce both titles when the wording
   is the same. That is a trade-off so the page keeps an H1 in the
   accessibility tree.

   Scope — preferred :has() selector:
   The theme header is hidden only when the FIRST child of
   .entry-content is a banner/hero (an element with an inline style
   that includes linear-gradient or border-radius) and that banner
   already contains an h1 or h2. Mid-page section headings, such as
   "Contents" on a lesson-list page, do not match, because they are
   not inside that first-child hero.

   This covers, among others:
   - Infants 2 Revision Exercises (page 12153)
   - the Infants 2 hub (10154; also listed in the 2026/10/23
     display:none block above, which is left unchanged)
   - Infants 1 hub (11923) and Infants 1 subject pages (11950–11958)
   - other existing and future pages that use the same hero markup

   This does NOT hide the title on:
   - the Spanish and Spelling revision posts (12141 and 12144), which
     have no content hero and rely on the theme title
   - lesson-list and Subjects pages (10157, 11959, 9708), which have
     no duplicate hero title

   Pages already listed in the 2026/10/23 block above are unchanged.
   That older block still uses display:none for those IDs.

   Fallback: a body-class list for the pages checked on 2026/11/13
   that need the hide and may not match :has() in every layout, so
   the title is still hidden if :has() is unsupported or the first
   child wrapping differs.

   This CSS is for pasting into Appearance > Customize > Additional
   CSS. It was not saved to the site by the authoring bot. */

/* 1. :has() — first content block is a hero/banner with its own heading */
body.page article:has(.entry-content > [style*="linear-gradient"] :is(h1, h2)) .entry-header,
body.page article:has(.entry-content > [style*="border-radius"] :is(h1, h2)) .entry-header,
body.single article:has(.entry-content > [style*="linear-gradient"] :is(h1, h2)) .entry-header,
body.single article:has(.entry-content > [style*="border-radius"] :is(h1, h2)) .entry-header,
/* 2. Fallback list of pages checked on 2026/11/13 that have a duplicate theme title */
body.page-id-12153 .entry-header,
body.page-id-11923 .entry-header,
body.page-id-11950 .entry-header,
body.page-id-11951 .entry-header,
body.page-id-11952 .entry-header,
body.page-id-11953 .entry-header,
body.page-id-11954 .entry-header,
body.page-id-11955 .entry-header,
body.page-id-11956 .entry-header,
body.page-id-11957 .entry-header,
body.page-id-11958 .entry-header {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}