/* Shared section vocabulary over ordinary core blocks (Cover, Group, Columns,
   Column, Image, Button). Names come from wordpress/plugins/shootcal-blocks/vocabulary.json:
   block styles are .is-style-sc-*, helpers are plain .sc-* Additional CSS classes.
   This file is STRUCTURE only (layout, spacing, stacking). Colors, glass, type and
   motion styling come from the selected look in assets/looks/. */
:root {
  --sc-card-bg: var(--sc-paper);
  --sc-card-radius: 20px;
  --sc-photo-band-bg: var(--sc-band);
  --sc-photo-band-highlight: rgb(255 255 255 / .7);
}

/* Boxed sections: a centered, wide content area with generous vertical padding. */
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full) {
  width: min(var(--sc-wide), calc(100% - 2 * var(--sc-gutter)));
  max-width: var(--sc-wide);
  margin-inline: auto;
  padding-block: clamp(32px, 5vw, 72px);
}
/* Full-width boxed: the band (and a look's --sc-boxed-full-bg) runs edge to
   edge; its content keeps the wide measure. Rows, columns and photo bands inside
   a boxed section use the wide measure too, not the reading measure. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-boxed-full {
  width: 100%;
  max-width: none;
  padding-inline: max(var(--sc-gutter), (100% - var(--sc-wide)) / 2);
  background: var(--sc-boxed-full-bg, transparent);
}
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full) > :is(.wp-block-columns, .wp-block-gallery, .is-style-sc-photo-band) { max-width: var(--sc-wide); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns { max-width: var(--sc-wide); }
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full) .is-style-sc-photo-band { padding-inline: 0; background: transparent; }
.entry-content > .is-style-sc-category-links { max-width: var(--sc-wide); }
/* A boxed section inside a full-width one does not box or pad twice. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-boxed-full .is-style-sc-boxed { width: 100%; padding-block: 0; }
.entry-content > .is-style-sc-boxed-full { margin-block: 0; }
/* The editor's own top-level rule (content width, same weight, printed later) would hold these to the
   reading width while their padding above is worked out from the whole canvas: on a wide canvas the
   padding ate the band and its heading ran one letter wide. They measure the same here as on the page. */
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container > :is(.is-style-sc-boxed-full, .is-style-sc-photo-band) { max-width: none; }
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container > .is-style-sc-boxed { max-width: var(--sc-wide); }
/* A flat look's glass card band bleeds with -100vw; away from a hero nothing else stops that scrolling the page sideways. */
.sc-structure-flat .sc-main:has(.is-style-sc-glass-card), .editor-styles-wrapper .is-root-container:has(.is-style-sc-glass-card) { overflow-x: clip; }
/* That card is built to sit on a hero. As a section of its own it keeps the page's side space and one straight left edge. */
.sc-structure-flat .entry-content > .is-style-sc-glass-card { width: min(var(--sc-wide), calc(100% - 2 * var(--sc-gutter))); margin-inline: auto; }
:is(.sc-structure-flat .entry-content, .editor-styles-wrapper .is-root-container) > .is-style-sc-glass-card > :is(.sc-lead, p) { max-width: var(--wp--style--global--content-size, 800px); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-tinted {
  padding: clamp(24px, 3vw, 48px);
  border-radius: var(--sc-card-radius);
  background: var(--sc-band);
}
/* A moved Puck section on a tint (sc-tint-band) is a band edge to edge on the flat looks, with the section at full width
   and its text in the reading column, as Puck drew it (Dana 90322, 2026-11-09). The shadow paints the band without widening the page. */
.sc-structure-flat .entry-content > .is-style-sc-tinted.sc-tint-band { max-width: var(--sc-wide); padding: clamp(48px, 6vw, 96px) 0; border-radius: 0; box-shadow: 0 0 0 100vmax var(--sc-band); clip-path: inset(0 -100vmax); }
.sc-structure-flat .entry-content > .sc-tint-band > :is(p, h1, h2, h3, h4, ul, ol, .wp-block-buttons) { max-width: var(--wp--style--global--content-size, 800px); margin-inline: auto; }
/* A centred row of buttons moved from Puck uses the wide column, so a row that fit on one line in Puck still does. */
.entry-content > .wp-block-buttons.sc-buttons-row.is-content-justification-center { max-width: var(--sc-wide); }
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-location-cards, .is-style-sc-location-cards-boxed) img { border-radius: var(--sc-radius); }
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-location-cards, .is-style-sc-location-cards-boxed) h4 { text-align: center; }
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-location-cards, .is-style-sc-location-cards-boxed) h4 a { display: inline-block; padding: 10px 15px; border: 1px solid var(--sc-accent); color: inherit; text-decoration: none; }
:is(.entry-content, .editor-styles-wrapper) .sc-narrow { max-width: var(--sc-reading); margin-inline: auto; }

/* Page hero: a core Cover that holds the opening heading. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-page-hero {
  min-height: max(600px, 80svh);
  padding: 150px var(--sc-gutter) 56px;
  isolation: isolate;
}
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-page-hero.sc-hero-short { min-height: max(500px, 70svh); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-page-hero .wp-block-cover__inner-container {
  width: min(var(--sc-wide), 100%);
  max-width: var(--sc-wide);
  margin-inline: auto;
}

/* Glass card: the text panel that sits on a hero photograph. Its type and padding follow the screen's
   height as well as its width (the vh terms below and in each look), so a short laptop screen gets a
   smaller card instead of one that covers the photo; tall desktops, tablets and phones are unchanged. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card {
  width: min(var(--sc-hero-card, var(--sc-ribbon-card, 620px)), 100%);
  margin-left: auto;
  padding: clamp(24px, 4vh, 36px) clamp(28px, 4.4vh, 40px);
  border-radius: 26px;
  color: var(--sc-text);
  text-align: left;
}
/* Automatic secondary titles keep the H1 look; :where preserves existing selector specificity. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card :is(h1, h2):where(:not(h2), .sc-auto-page-heading) { color: var(--sc-heading); font-size: clamp(36px, min(4vw, 6.2vh), 60px); line-height: 1.08; text-align: left; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card p { float: none; max-width: none; color: inherit; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card .sc-lead { margin-block: 24px; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card .wp-block-buttons { justify-content: flex-start; }

/* Hero slideshow: the ShootCal Slider's hero layout opening a page, with its
   overlay content (normally a glass card) on the photos. Phones and tablets
   show one photo at a time across the width, cropped around each photo's
   focal point, with the card overlapping the photo's lower edge. Desktops
   show the photo ribbon: each photo at its own shape (up to 84% of the
   width), its neighbours dimmed, the card over the current photo. */
.entry-content > .natural-photo-slider--hero {
  --nps-inactive-opacity: 0;
  --nps-stage-height: max(50svh, clamp(280px, 50vw, 360px));
  margin-block: 0 40px;
}
.entry-content > .natural-photo-slider--hero .natural-photo-slider__track { height: var(--nps-stage-height); }
/* The slider prints every slide in a column; a page's opening slideshow prints the photo showing, or the rest run into the text. */
@media print { .entry-content > .natural-photo-slider--hero .natural-photo-slider__slide:not(.natural-photo-slider__slide--current) { display: none !important; } }
.entry-content > .natural-photo-slider--hero .natural-photo-slider__slide { width: 100%; }
.entry-content > .natural-photo-slider--hero .natural-photo-slider__image { object-fit: cover; }
.entry-content > .natural-photo-slider--hero .natural-photo-slider__content { margin-top: -48px; padding-inline: var(--sc-gutter); }
.entry-content > .natural-photo-slider--hero .natural-photo-slider__content > .is-style-sc-glass-card { width: 100%; max-width: none; margin: 0; }
@media (min-width: 641px) and (max-width: 1024px) {
  .entry-content > .natural-photo-slider--hero { --nps-stage-height: max(60svh, 420px); margin-bottom: 56px; }
  .entry-content > .natural-photo-slider--hero .natural-photo-slider__content { margin-top: -64px; }
}
@media (min-width: 1025px) {
  .entry-content > .natural-photo-slider--hero { --nps-inactive-opacity: .5; --nps-stage-height: clamp(560px, 85svh, 1000px); margin-bottom: 56px; }
  .entry-content > .natural-photo-slider--hero .natural-photo-slider__slide { width: min(calc(var(--nps-stage-height) * var(--nps-ratio, 1.5)), 84vw); }
  .entry-content > .natural-photo-slider--hero .natural-photo-slider__content {
    position: absolute; inset: 0;
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    width: min(calc(var(--nps-stage-height) * 1.5), 84vw);
    margin: 0 auto; padding: 40px;
    pointer-events: none;
  }
  .entry-content > .natural-photo-slider--hero .natural-photo-slider__content > * { pointer-events: auto; }
  .entry-content > .natural-photo-slider--hero .natural-photo-slider__content > .is-style-sc-glass-card { width: min(var(--sc-hero-card, var(--sc-ribbon-card, 620px)), 100%, calc(min(var(--nps-stage-height) * 1.5, 84vw) * var(--sc-hero-card-share, var(--sc-ribbon-card-share, .46)))); margin: 0; }
  /* Card position: the Header's "Card position" setting (WordPress's 3x3 grid). The middle needs no class. */
  .entry-content > .natural-photo-slider--hero:is(.natural-photo-slider--card-top-left, .natural-photo-slider--card-top-center, .natural-photo-slider--card-top-right) .natural-photo-slider__content { justify-content: flex-start; }
  .entry-content > .natural-photo-slider--hero:is(.natural-photo-slider--card-bottom-left, .natural-photo-slider--card-bottom-center, .natural-photo-slider--card-bottom-right) .natural-photo-slider__content { justify-content: flex-end; }
  .entry-content > .natural-photo-slider--hero:is(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left) .natural-photo-slider__content { align-items: flex-start; }
  .entry-content > .natural-photo-slider--hero:is(.natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .natural-photo-slider__content { align-items: flex-end; }
}
/* The Header's "Full width photo" style: the old ShootCal header's layout, kept by the sites moved from it (Ryan,
   2026-11-09). At every width the photo runs across the page at 80% of the screen's height, a veil in the page's
   ground softens it towards the foot, and the card sits over its lower part, up to 1120px wide. Card position
   places the card as usual; with none chosen it sits at the bottom, centred, where the old header put it. */
.entry-content > .natural-photo-slider--hero.is-style-sc-fill { --nps-inactive-opacity: 0; --nps-stage-height: max(80svh, 560px); --sc-fill-pad-bottom: clamp(2rem, 7vw, 5.5rem); }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill .natural-photo-slider__slide { width: 100%; }
body:not(.sc-structure-flat) .entry-content > .natural-photo-slider--hero.is-style-sc-fill .natural-photo-slider__track::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, color-mix(in srgb, var(--sc-bg) 10%, transparent), color-mix(in srgb, var(--sc-bg) 66%, transparent));
}
.entry-content > .natural-photo-slider--hero.is-style-sc-fill .natural-photo-slider__content {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; justify-content: flex-end; align-items: center;
  width: auto; margin: 0; padding: clamp(5.5rem, 13vw, 10rem) clamp(1.25rem, 5vw, 5.5rem) var(--sc-fill-pad-bottom);
  pointer-events: none;
}
.entry-content > .natural-photo-slider--hero.is-style-sc-fill .natural-photo-slider__content > * { pointer-events: auto; }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill .natural-photo-slider__content > .is-style-sc-glass-card { width: min(var(--sc-hero-card, 1120px), 100%); max-width: none; margin: 0; }
/* The old header's heading grew with its card (8% of the card's width, up to about 97px): one line on a phone, large on a desktop. */
body:is(.sc-structure-flat, .sc-structure-glass) .entry-content > .natural-photo-slider--hero.is-style-sc-fill .is-style-sc-glass-card :is(h1, h2):where(:not(h2), .sc-auto-page-heading) { font-size: clamp(22px, 8cqi, 97px); }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill:is(.natural-photo-slider--card-top-left, .natural-photo-slider--card-top-center, .natural-photo-slider--card-top-right) .natural-photo-slider__content { justify-content: flex-start; }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill:is(.natural-photo-slider--card-center-left, .natural-photo-slider--card-center-right) .natural-photo-slider__content { justify-content: center; }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill:is(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left) .natural-photo-slider__content { align-items: flex-start; }
.entry-content > .natural-photo-slider--hero.is-style-sc-fill:is(.natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .natural-photo-slider__content { align-items: flex-end; }

/* The Header's "Photo position" Below the menu (functions.php shootcal_theme_opening_below_menu): the opening photo
   starts under the floating menu bar, with the same gap above it as the bar has from the top of the screen. It still
   runs edge to edge. */
body.sc-opening-below-menu .sc-page > .entry-content > .natural-photo-slider:first-of-type { margin-top: calc(var(--sc-menu-clearance, 88px) + 10px); }
body.admin-bar.sc-opening-below-menu .sc-page > .entry-content > .natural-photo-slider:first-of-type { margin-top: calc(var(--sc-menu-clearance, 120px) + 10px); }
body.sc-opening-below-menu .sc-page > .entry-content > .natural-photo-slider--hero.is-style-sc-fill:first-of-type .natural-photo-slider__content { padding-top: clamp(2rem, 5vw, 4rem); }
@media (max-width: 640px) {
  body.sc-opening-below-menu .sc-page > .entry-content > .natural-photo-slider:first-of-type { margin-top: calc(var(--sc-menu-clearance, 72px) + 10px); }
  body.admin-bar.sc-opening-below-menu .sc-page > .entry-content > .natural-photo-slider:first-of-type { margin-top: calc(var(--sc-menu-clearance, 118px) + 10px); }
}

/* The Header's photo strip (Text placement Above / Below a photo strip, slider 0.7.8): the old builder's photo ribbon.
   The Header's text is plain page text, centred unless the author aligned it, over or under a short strip of photos
   at their own shape; the card's glass, padding and look backgrounds stay off. A strip opening the page starts below
   the floating menu (functions.php). */
.entry-content > .natural-photo-slider--strip { margin-block: 0 clamp(32px, 5vw, 56px); }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card {
  width: auto; max-width: none; margin: 0; padding: 0;
  border: 0; border-radius: 0; background: none; box-shadow: none;
  -webkit-backdrop-filter: none; backdrop-filter: none;
  color: var(--sc-text); text-align: center;
}
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card::before,
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card::after { content: none; display: none; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card :is(h1, h2, p):not(.has-text-align-left, .has-text-align-right) { margin-inline: auto; text-align: center; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card .wp-block-buttons:not(.is-content-justification-left, .is-content-justification-right) { justify-content: center; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card :is(h1, h2):where(:not(h2), .sc-auto-page-heading) { margin-block: 0 16px; font-size: clamp(32px, 4vw, 58px); line-height: 1.08; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card .sc-lead { margin-block: 0 24px; color: var(--sc-muted); font-size: 1rem; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card .sc-lead { max-width: var(--wp--style--global--content-size, 800px); }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card .sc-lead:not(.has-text-align-left, .has-text-align-right) { max-width: 70ch; }
.entry-content > .natural-photo-slider--strip .natural-photo-slider__intro .is-style-sc-glass-card > :last-child { margin-bottom: 0; }

/* The short rule under a Header eyebrow, as on the old Puck pages (Ryan, 2026-11-09). The flat looks already draw it under
   every eyebrow (structure-flat.css); every other look gets it in the Header only, in the eyebrow's own colour. */
body:not(.sc-structure-flat) .natural-photo-slider .sc-eyebrow::after, .nps-editor .sc-eyebrow::after { content: ""; display: block; width: clamp(72px, 7vw, 104px); max-width: 100%; height: 1px; margin-top: 10px; background: color-mix(in srgb, currentColor 45%, transparent); }
body:not(.sc-structure-flat) .natural-photo-slider :is(.has-text-align-center .sc-eyebrow, .sc-eyebrow.has-text-align-center)::after, .nps-editor :is(.has-text-align-center .sc-eyebrow, .sc-eyebrow.has-text-align-center)::after { margin-inline: auto; }
body:not(.sc-structure-flat) .natural-photo-slider .sc-eyebrow.has-text-align-right::after, .nps-editor .sc-eyebrow.has-text-align-right::after { margin-left: auto; }
/* A Header card in the middle column (the default) centres its heading, text and buttons, in every look. An
   author's own alignment on a heading, paragraph or button row still wins. Cards set to the left or right column
   keep the glass card's usual left-aligned text. Phones and tablets show the card under the photo. */
.entry-content > .natural-photo-slider--hero:not(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left, .natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .is-style-sc-glass-card { text-align: center; }
.entry-content > .natural-photo-slider--hero:not(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left, .natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .is-style-sc-glass-card :is(h1, h2, p):not(.has-text-align-left, .has-text-align-right) { margin-inline: auto; text-align: center; }
.entry-content > .natural-photo-slider--hero:not(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left, .natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .is-style-sc-glass-card .wp-block-buttons:not(.is-content-justification-left, .is-content-justification-right, .is-content-justification-space-between) { justify-content: center; }

/* The Header's heading always fits its card. The flat and glass looks set large headings (each gives its size as
   --sc-card-h1, phone sizes included); in the Header that size stops where a long word such as "Photographers" still
   fits on one line of the card (cqi: a hundredth of the card's own width; Marquee's capitals set a smaller share).
   Editorial, Studio and Starter headings never reach it. */
body:is(.sc-structure-flat, .sc-structure-glass) .entry-content > .natural-photo-slider--hero .is-style-sc-glass-card { container-type: inline-size; }
body:is(.sc-structure-flat, .sc-structure-glass) .entry-content > .natural-photo-slider--hero .is-style-sc-glass-card :is(h1, h2):where(:not(h2), .sc-auto-page-heading) { font-size: min(var(--sc-card-h1, 60px), var(--sc-card-h1-fit, 14cqi)); }
.entry-content > .natural-photo-slider--hero:not(.natural-photo-slider--card-top-left, .natural-photo-slider--card-center-left, .natural-photo-slider--card-bottom-left, .natural-photo-slider--card-top-right, .natural-photo-slider--card-center-right, .natural-photo-slider--card-bottom-right) .is-style-sc-glass-card .wp-block-buttons { justify-content: center; }
/* The same in the editor's Header preview, which marks the chosen place on its own wrapper. */
.editor-styles-wrapper :is(.nps-editor__hero--top-center, .nps-editor__hero--center-center, .nps-editor__hero--bottom-center) .is-style-sc-glass-card { margin-inline: auto; text-align: center; }
.editor-styles-wrapper :is(.nps-editor__hero--top-center, .nps-editor__hero--center-center, .nps-editor__hero--bottom-center) .is-style-sc-glass-card :is(h1, h2, p):not(.has-text-align-left, .has-text-align-right) { margin-inline: auto; text-align: center; }
.editor-styles-wrapper :is(.nps-editor__hero--top-center, .nps-editor__hero--center-center, .nps-editor__hero--bottom-center) .is-style-sc-glass-card .wp-block-buttons { justify-content: center; }
/* The editor's Header preview stands as tall as the published Header on tablets, laptops and desktops
   (the stage heights above), so the card sits in the same proportion; phones keep the small preview. */
@media (min-width: 641px) and (max-width: 1024px) {
  .editor-styles-wrapper .nps-editor__hero:not(.nps-editor__hero--empty) { min-height: max(60svh, 420px); }
}
@media (min-width: 1025px) {
  .editor-styles-wrapper .nps-editor__hero:not(.nps-editor__hero--empty) { min-height: clamp(560px, 85svh, 1000px); }
}

/* On a motion site (assets/motion.css, body.sc-motion) the hero slideshow's title,
   text and buttons rise in like the cover hero's. */
@media screen and (prefers-reduced-motion: no-preference) {
  .sc-motion .entry-content > .natural-photo-slider--hero .natural-photo-slider__content :is(h1, h2:not(.sc-headline-sub)) { animation: sc-hero-rise .5s var(--sc-ease) both; }
  .sc-motion .entry-content > .natural-photo-slider--hero .natural-photo-slider__content .sc-headline-sub { animation: sc-hero-rise .5s var(--sc-ease) .05s both; }
  .sc-motion .entry-content > .natural-photo-slider--hero .natural-photo-slider__content p:not(.sc-headline-sub) { animation: sc-hero-rise .5s var(--sc-ease) .1s both; }
  .sc-motion .entry-content > .natural-photo-slider--hero .natural-photo-slider__content .wp-block-buttons { animation: sc-hero-rise .5s var(--sc-ease) .15s both; }
}

/* Two-part headline: either whole heading blocks or spans inside one heading. */
:is(.entry-content, .editor-styles-wrapper) .sc-headline-main { display: block; }
:is(.entry-content, .editor-styles-wrapper) .sc-headline-sub { display: block; margin-top: 8px; font-size: clamp(26px, 2.5vw, 38px); }
:is(.entry-content, .editor-styles-wrapper) h2.sc-headline-sub { font-size: clamp(22px, 1.1rem + .5vw, 32px); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card .sc-headline-sub { color: var(--sc-muted); }
:is(.entry-content, .editor-styles-wrapper) .sc-lead { font-size: 1.1rem; }

/* Photo band: a full-width band holding an image-and-text row. Its highlight
   always belongs to the PHOTO column, grows vertically and never covers the text.
   :has() keeps saved core Columns editable and preserves no-script rendering. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band {
  max-width: none;
  width: 100%;
  margin-block: 0;
  padding: clamp(64px, 7.5vw, 112px) var(--sc-gutter);
  background: var(--sc-photo-band-bg);
  /* The highlight behind a feature row reaches 40px past the row; never past the screen. */
  overflow-x: clip;
}
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band > .wp-block-group { max-width: var(--sc-wide); margin-inline: auto; }
/* Inside a boxed section the band is only as wide as the page measure, so its own
   clip would cut the highlight off at the row's edge. Let the full-width section
   clip instead, so the highlight reaches 40px past the row as on live. */
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full):has(> .is-style-sc-photo-band) { overflow-x: clip; }
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full) > .is-style-sc-photo-band { overflow-x: visible; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) {
  display: grid;
  position: relative;
  isolation: isolate;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 48px;
  margin: 0;
}
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) > .wp-block-column { grid-row: 1; min-width: 0; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-column:has(.is-style-sc-feature-photo) { margin-top: 50px; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-feature-photo img { display: block; width: 100%; height: auto; border-radius: var(--sc-radius); box-shadow: var(--sc-shadow); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo)::before {
  content: "";
  position: absolute;
  /* Exactly the photo's column: an absolute grid child's `auto` end line would be the
     row's far edge (live's RowBand uses var(--band-col) / span 1). */
  grid-row: 1;
  grid-column: 1 / span 1;
  z-index: -1;
  top: -56px;
  bottom: -56px;
  left: -40px;
  right: 28%;
  border-radius: 20px;
  background: var(--sc-photo-band-highlight);
  /* navigation.js grows the panel out from its outer edge with the scroll by
     setting --sc-band-hidden on the row; unset (no script, the editor, reduced
     motion, print) it is whole. */
  clip-path: inset(0 var(--sc-band-hidden, 0%) 0 0);
  pointer-events: none;
}
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column:nth-child(2) .is-style-sc-feature-photo)::before { grid-column: 2 / span 1; left: 28%; right: -40px; clip-path: inset(0 0 0 var(--sc-band-hidden, 0%)); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) > .wp-block-column:not(:has(.is-style-sc-feature-photo)) { padding: 40px; border-radius: var(--sc-card-radius); background: var(--sc-card-bg); border: 1px solid var(--sc-line); box-shadow: var(--sc-shadow); }

/* Photo band as one Media & Text block: the block is the band and the row at once, so List View reads
   Photo band > Title, Text, Button. The saved two-group-and-Columns band above keeps its own rules.
   The band's background and vertical padding come from .is-style-sc-photo-band above; here its side
   padding does the job of the old inner group's wide measure. Core's own width is an inline style while editing, hence the !important: this band's two halves
   are always equal, and its drag handle is hidden in assets/editor.css. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band {
  display: grid;
  position: relative;
  isolation: isolate;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 48px;
  padding-inline: max(var(--sc-gutter), (100% - var(--sc-wide)) / 2);
}
:is(.entry-content, .editor-styles-wrapper) :is(.is-style-sc-boxed, .is-style-sc-boxed-full) .wp-block-media-text.is-style-sc-photo-band { padding-inline: 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > :is(.wp-block-media-text__media, .wp-block-media-text__content) { grid-row: 1; min-width: 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__media { grid-column: 1; align-self: start; display: block; margin: 50px 0 0; }
/* The card is as tall as the row beside a tall photo: core's Columns rule (align-items: normal !important) has always done that to the saved band. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content { grid-column: 2; align-self: stretch; padding: 40px; word-break: normal; border-radius: var(--sc-card-radius); background: var(--sc-card-bg); border: 1px solid var(--sc-line); box-shadow: var(--sc-shadow); }
/* What a Column's flow layout gives its blocks and Media & Text does not. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content > :first-child { margin-top: 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content > :last-child { margin-bottom: 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content > .alignleft { float: left; margin-inline: 0 2em; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content > .alignright { float: right; margin-inline: 2em 0; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content > .aligncenter { margin-inline: auto; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band.has-media-on-the-right > .wp-block-media-text__media { grid-column: 2; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band.has-media-on-the-right > .wp-block-media-text__content { grid-column: 1; }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__media img { display: block; width: 100%; max-width: 100%; height: auto; border-radius: var(--sc-radius); box-shadow: var(--sc-shadow); }
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band::before {
  content: "";
  position: absolute;
  grid-row: 1;
  grid-column: 1 / span 1;
  z-index: -1;
  top: -56px;
  bottom: -56px;
  left: -40px;
  right: 28%;
  border-radius: 20px;
  background: var(--sc-photo-band-highlight);
  clip-path: inset(0 var(--sc-band-hidden, 0%) 0 0);
  pointer-events: none;
}
:is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band.has-media-on-the-right::before { grid-column: 2 / span 1; left: 28%; right: -40px; clip-path: inset(0 0 0 var(--sc-band-hidden, 0%)); }

/* Columns styles. */
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-category-links { gap: 24px; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-category-links img { border-radius: var(--sc-radius); box-shadow: var(--sc-shadow); }
/* Every look shares the same starting stagger for the shared scroll-convergence motion. */
@media (min-width: 641px) {
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-category-links > .wp-block-column:nth-child(even) { margin-top: 56px; }
}
.is-style-sc-category-links.sc-cards-text-over .wp-block-image { position: relative; }
.is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption { position: absolute; z-index: 1; right: 1rem; bottom: 1rem; left: 1rem; display: block; width: auto; margin: 0; padding: .85rem 1.1rem; border: 1px solid rgb(255 255 255 / .24); border-radius: var(--sc-card-radius, var(--sc-radius)); background: rgb(18 18 24 / .4); -webkit-backdrop-filter: blur(18px) saturate(150%); backdrop-filter: blur(18px) saturate(150%); color: #fff; text-align: center; text-shadow: 0 1px 10px rgb(0 0 0 / .35); }
/* sc-cards-text-over: a card with no photo keeps the old site's tall card with a soft placeholder, instead of collapsing under its text. */ .is-style-sc-category-links.sc-cards-text-over .wp-block-image:not(:has(img)) { aspect-ratio: 2 / 3; margin: 0; border-radius: var(--sc-card-radius, var(--sc-radius)); background: linear-gradient(160deg, rgb(255 255 255 / .55), rgb(0 0 0 / .08)), var(--sc-card-bg, #f3efe8); box-shadow: var(--sc-shadow); }
/* A missing photograph needs an opaque enough plate for its white label in either appearance. */
.is-style-sc-category-links.sc-cards-text-over .wp-block-image:not(:has(img)) > figcaption.wp-element-caption { background: rgb(18 18 24 / .78); }
/* sc-cards-text-over: the label reads white on its dark plate, as on the old site, and long words never break mid-word. */ .is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption :is(h3, a) { color: inherit; overflow-wrap: normal; word-break: normal; hyphens: manual; }
/* An over-photo title is inside its plate: the below-photo Features heading gap must not enlarge it. */
.is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption > h3 { margin: 0; }
/* sc-cards-text-over: the plate is the link, so its title is not underlined; hover and keyboard focus underline it. */
.is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption a { text-decoration: none; }
.is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption a:is(:hover, :focus-visible) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.is-style-sc-category-links.sc-cards-text-over figcaption::before, .is-style-sc-category-links.sc-cards-text-over figcaption::after { content: none; }
.sc-structure-flat .is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption { border-radius: 0; }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption { background: rgb(18 18 24 / .78); } }
@media (max-width: 640px) { .is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption { right: .6rem; bottom: .6rem; left: .6rem; padding: .6rem .7rem; } }
@media (max-width: 640px) { .is-style-sc-category-links.sc-cards-text-over .wp-block-image > figcaption.wp-element-caption h3 { font-size: clamp(.95rem, 4.4vw, 1.25rem); } }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-card { padding: 28px; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); background: var(--sc-card-bg); box-shadow: var(--sc-shadow); }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-price-table { align-items: stretch; gap: 24px; }
:is(.entry-content, .editor-styles-wrapper) .is-style-sc-price-table > .wp-block-column { padding: 28px; border: 1px solid var(--sc-line); border-radius: var(--sc-card-radius); }
:is(.entry-content, .editor-styles-wrapper) .sc-items-center { align-items: center !important; }

/* The Features block: the same columns and photos as above. Outside a band its heading and intro keep the
   reading width. A page link's title is a heading inside the photo's caption, spaced as if it followed the photo. */
:is(.entry-content, .editor-styles-wrapper) .wp-block-shootcal-features:not(.is-style-sc-boxed-full) > :is(h2, p) { max-width: var(--sc-reading); margin-inline: auto; }
.wp-block-shootcal-features figcaption.wp-element-caption { margin: 0; }
.wp-block-shootcal-features figcaption > h3 { margin-block: 36px 0; }
@media (max-width: 640px) { .wp-block-shootcal-features figcaption > h3 { margin-top: 30px; } }

/* Image helpers. */
:is(.entry-content, .editor-styles-wrapper) .sc-rounded img { border-radius: var(--sc-radius); }
:is(.entry-content, .editor-styles-wrapper) .sc-no-shadow img { box-shadow: none !important; }

/* Spacing helpers: one small/medium/large scale for every look. */
:is(.entry-content, .editor-styles-wrapper) .sc-mt-0 { margin-top: 0 !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mt-s { margin-top: var(--sc-space-s) !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mt-m { margin-top: var(--sc-space-m) !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mt-l { margin-top: var(--sc-space-l) !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mb-0 { margin-bottom: 0 !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mb-s { margin-bottom: var(--sc-space-s) !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mb-m { margin-bottom: var(--sc-space-m) !important; }
:is(.entry-content, .editor-styles-wrapper) .sc-mb-l { margin-bottom: var(--sc-space-l) !important; }

/* Motion hooks (navigation.js adds these once IntersectionObserver is ready). */
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
  .sc-legacy-motion-ready .sc-legacy-row > :is(.wp-block-column, .wp-block-media-text__media, .wp-block-media-text__content) { transition: opacity .8s var(--sc-ease), transform 1s var(--sc-ease); }
  .sc-legacy-motion-ready .sc-legacy-row:not(.is-visible) > :is(.wp-block-column, .wp-block-media-text__media, .wp-block-media-text__content) { opacity: .85; transform: translateY(24px); }
}
@media (max-width: 1024px) {
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo)::before { display: none; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) > .wp-block-column { grid-row: auto; margin: 0; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band { grid-template-columns: minmax(0, 1fr) !important; gap: 32px; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band::before { display: none; }
  /* Stacked in reading order, as a saved band's columns stack: a photo on the right comes after its text. */
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__media { grid-column: 1; grid-row: 1; margin: 0; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content { grid-column: 1; grid-row: 2; margin: 0; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band.has-media-on-the-right > .wp-block-media-text__media { grid-column: 1; grid-row: 2; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band.has-media-on-the-right > .wp-block-media-text__content { grid-column: 1; grid-row: 1; }
  :is(.entry-content, .editor-styles-wrapper) .sc-stack-tablet { flex-wrap: wrap !important; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-columns.sc-stack-tablet > .wp-block-column { flex-basis: 100% !important; }
  :is(.entry-content, .editor-styles-wrapper) .sc-two-up-tablet { flex-wrap: wrap !important; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-columns.sc-two-up-tablet > .wp-block-column { flex-basis: calc(50% - 12px) !important; flex-grow: 0; }
  :is(.entry-content, .editor-styles-wrapper) .sc-order-1 { order: 1; }
  :is(.entry-content, .editor-styles-wrapper) .sc-order-2 { order: 2; }
}
@media (max-width: 640px) {
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-page-hero { min-height: 600px; padding: 120px 20px 28px; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-page-hero.sc-hero-short { min-height: 500px; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-glass-card { padding: 26px 24px; border-radius: 20px; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns:has(> .wp-block-column .is-style-sc-feature-photo) > .wp-block-column:not(:has(.is-style-sc-feature-photo)) { padding: 26px; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band > .wp-block-media-text__content { padding: 26px; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-category-links { flex-wrap: wrap !important; }
  :is(.entry-content, .editor-styles-wrapper) .wp-block-columns.is-style-sc-category-links > .wp-block-column { flex-basis: calc(50% - 12px) !important; flex-grow: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .sc-legacy-row, .sc-legacy-row > :is(.wp-block-column, .wp-block-media-text__media, .wp-block-media-text__content) { transition: none !important; transform: none !important; opacity: 1 !important; }
  :is(.entry-content, .editor-styles-wrapper) .is-style-sc-photo-band .wp-block-columns::before, :is(.entry-content, .editor-styles-wrapper) .wp-block-media-text.is-style-sc-photo-band::before { clip-path: none !important; }
}

/* Optional header parts (inc/look-features.php): any look can turn these on in the Customizer. */
/* The envelope to the contact page beside Menu. */
.sc-nav-contact { display: none; }
@media (max-width: 1024px) {
  :is(.sc-js, .sc-nav-ready) .sc-nav-contact { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; margin-left: auto; margin-right: -4px; border-radius: 999px; background: rgb(0 0 0 / .06); color: var(--sc-text); transition: background-color .15s; }
  .sc-nav-contact:hover { background: rgb(0 0 0 / .1); }
  .sc-nav-contact__icon { width: 18px; height: 18px; }
}
/* The logo gives way so the Contact icon and Menu button stay on the one row (44 + 93 + two 8px gaps). */
@media (max-width: 640px) { :is(.sc-js, .sc-nav-ready) .sc-nav-shell:has(.sc-nav-contact) .sc-brand { max-width: calc(100% - 153px); } }
/* Header: on screen everywhere, hidden while reading down (Headroom.js, assets/header-autohide.js). It was already out of the page flow, so fixing it moves nothing. It stays up for keyboard focus, an open phone menu and an open dropdown. */
body.sc-header-autohide.sc-managed-site .sc-site-header { position: fixed; pointer-events: none; transition: transform .5s cubic-bezier(.45, 0, .25, 1); will-change: transform; }
body.sc-header-autohide.sc-managed-site .sc-nav-shell { pointer-events: auto; }
body.sc-header-autohide.sc-managed-site .sc-site-header.headroom--unpinned:not(:has(:focus-visible, [data-open], .sc-menu li:hover > ul)) { transform: translateY(calc(-100% - 72px)); }
@media (prefers-reduced-motion: reduce) { body.sc-header-autohide.sc-managed-site .sc-site-header { transition: none; } }
@media print { body.sc-header-autohide.sc-managed-site .sc-site-header { position: absolute; } }

/* A new site's starter pages (lib/starter-template, 2026-11-08): until the owner adds photographs, the
   Header and the marked image placeholders show a soft gradient in the look's own ground, text and accent
   colours, so every look (light or dark) keeps its shape. Only the starter's own classes get it, and in the
   editor (assets/editor-canvas.js makes the page's block list its .entry-content) an empty Header's and photo band's placeholder. */
.entry-content :is(.sc-photo-placeholder, .wp-block-image.sc-image-placeholder:not(:has(img)), .nps-editor__hero-placeholder) {
  background:
    radial-gradient(120% 90% at 15% 10%, color-mix(in srgb, var(--sc-accent) 24%, transparent), transparent 62%),
    radial-gradient(100% 80% at 88% 96%, color-mix(in srgb, var(--sc-accent) 14%, transparent), transparent 66%),
    linear-gradient(160deg, color-mix(in srgb, var(--sc-text) 5%, var(--sc-bg)), color-mix(in srgb, var(--sc-text) 12%, var(--sc-bg)));
}
.entry-content .wp-block-image.sc-image-placeholder:not(:has(img)) { aspect-ratio: 4 / 5; width: 100%; margin-inline: 0; border-radius: var(--sc-radius); }
.entry-content .wp-block-image.is-style-sc-feature-photo.sc-image-placeholder:not(:has(img)) { box-shadow: var(--sc-shadow); }
.entry-content > .natural-photo-slider--hero.sc-header-placeholder .natural-photo-slider__track { width: 100%; }
/* A Full width photo Header with no photo yet shows the old header's own empty ground: the accent deepened, fading to the page. */
.entry-content > .natural-photo-slider--hero.is-style-sc-fill.sc-header-placeholder .natural-photo-slider__track { background: linear-gradient(135deg, color-mix(in srgb, var(--sc-accent) 55%, #27242d), var(--sc-bg)); }

/* A page from the old builder that opens without a title or Header (page.php): its first section starts under the
   floating menu bar, the same gap as a photo set Below the menu (theme 0.7.15). */
.sc-page > .entry-content.sc-page-clear-menu { padding-top: 88px; }
body.admin-bar .sc-page > .entry-content.sc-page-clear-menu { padding-top: 120px; }
@media (max-width: 640px) {
  .sc-page > .entry-content.sc-page-clear-menu { padding-top: 72px; }
  body.admin-bar .sc-page > .entry-content.sc-page-clear-menu { padding-top: 118px; }
}

/* Studio: a Header (shootcal/hero) with no photographs shows the old builder's empty header ground, the accent
   deepened and fading to the page, as the Glass and Flat looks already do, with no dark shade (theme 0.7.14). */
body.sc-preset-studio .entry-content .sc-hero:has(> .sc-hero__slides:empty) { background: linear-gradient(135deg, color-mix(in srgb, var(--sc-accent) 55%, #27242d), var(--sc-bg)); }
body.sc-preset-studio .entry-content .sc-hero:has(> .sc-hero__slides:empty) > .sc-hero__shade { display: none; }

/* Motion effects off (Customizer > Design style, inc/look-features.php): the blocks' scroll reveals show at rest. */
body.sc-motion-off .sc-reveal[data-animate="true"],
body.sc-motion-off .sc-reveal[data-animate="true"] :is(.sc-split__image, .sc-split__content) { opacity: 1 !important; transform: none !important; transition: none !important; }
/* Only the movement: a split without its image highlight (sc-split--plain) still hides this. */
body.sc-motion-off .sc-reveal[data-animate="true"] .sc-split__image::before { transform: none !important; transition: none !important; }
/* A form that comes back with errors lands with its box under the floating header, low enough that the section heading just above it shows whole instead of a sliver peeking out above the header. */
body.sc-header-autohide.sc-managed-site .sct-form__errors { scroll-margin-top: 88px; }
@media (max-width: 640px) { body.sc-header-autohide.sc-managed-site .sct-form__errors { scroll-margin-top: 64px; } }
/* The review form's error list: its pale box keeps its own dark red links on every look, light or dark. */
.sc-page .entry-content .sct-form__errors li a:not([class]):is(:link, :visited, :hover, :focus-visible) { padding-bottom: 0; background: none; color: var(--sct-danger-ink, #912018); text-decoration: underline; text-underline-offset: 2px; }

/* Compact overlay playback chip. Fixed square buttons center the icons without font-baseline drift.
   Touch layouts keep 44px targets; slider state, accessible names and focus rules remain the plugin's. */
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls { gap: 2px; padding: 1px; }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls button { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 36px; height: 36px; min-width: 36px; min-height: 36px; padding: 0; line-height: 1; }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls :is([data-nps-prev], [data-nps-next]) { font-size: 0; }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls :is([data-nps-prev], [data-nps-next])::before { content: ""; display: block; width: 6px; height: 6px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls [data-nps-prev]::before { transform: rotate(-135deg); }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .splide__toggle > span { font-size: 0; line-height: 0; }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .splide__toggle__pause::before { content: ""; display: block; box-sizing: border-box; width: 8px; height: 10px; border-inline: 3px solid currentColor; }
.sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .splide__toggle__play::before { content: ""; display: block; width: 0; height: 0; border-block: 5px solid transparent; border-left: 8px solid currentColor; }
@media (max-width: 640px), (pointer: coarse) {
  .sc-managed-site .natural-photo-slider[data-nps-controls-position="overlay"] .natural-photo-slider__controls button { width: 44px; height: 44px; min-width: 44px; min-height: 44px; }
}

/* Header playback controls remain visible without covering its caption card. */
.entry-content > .natural-photo-slider--hero[data-nps-controls-position="overlay"] .natural-photo-slider__controls { z-index: 4; }
@media (max-width: 1024px) {
  .entry-content > .natural-photo-slider--hero[data-nps-controls-position="overlay"]:not(.is-style-sc-fill) .natural-photo-slider__controls { top: calc(var(--nps-stage-height) - 124px); bottom: auto; }
}
@media (min-width: 1025px) {
  .entry-content > .natural-photo-slider--hero[data-nps-controls-position="overlay"]:has(.natural-photo-slider__controls) .natural-photo-slider__content { padding-bottom: 88px; }
}
.entry-content > .natural-photo-slider--hero.is-style-sc-fill[data-nps-controls-position="overlay"]:has(.natural-photo-slider__controls) .natural-photo-slider__content { padding-bottom: max(var(--sc-fill-pad-bottom), 88px); }

/* Opening photos below the menu use its measured edge once, followed immediately by breadcrumbs/photos. */
/* Keep a first photo’s menu-clearance margin inside its content wrapper, not collapsed into main’s origin. */
body.sc-opening-below-menu .sc-page > .entry-content:first-of-type { display: flow-root; }
body.sc-opening-photo-below .sc-page > .sc-breadcrumbs { padding-top: calc(var(--sc-menu-clearance, 88px) + 10px); margin-bottom: 8px; }
body.sc-opening-photo-below .sc-page > .sc-breadcrumbs + .entry-content { margin-top: 0; }
body.sc-opening-photo-below .sc-page > .sc-breadcrumbs + .entry-content > .natural-photo-slider:first-of-type { margin-top: 0; }
/* Behind-menu Headers align their card within the visible photograph below the menu.
   The bottom edge and its normal padding stay fixed for bottom-positioned cards. */
body.sc-opening-photo-behind .sc-page > .entry-content:first-of-type > .natural-photo-slider--hero.is-style-sc-fill:first-of-type .natural-photo-slider__content { top: var(--sc-menu-clearance, 88px); }
@media (min-width: 1025px) {
  body.sc-opening-photo-behind .sc-page > .entry-content:first-of-type > .natural-photo-slider--hero:first-of-type .natural-photo-slider__content { top: var(--sc-menu-clearance, 88px); }
}

/* Both public logo slots are native projections; html.dark is owned by the
   existing fixed/visitor/system appearance controller. Explicit logo choices
   and ordinary WordPress Site Identity logos keep their existing markup. */
html:not(.dark) .sc-brand-logo-dark, html.dark .sc-brand-logo-light { display: none; }