/*
Theme Name: ShootCal
Template: generatepress
Version: 1.4
Description: ShootCal child theme. Colours remain in GeneratePress Global Colors.
Containment and typography are intentionally owned here so they stay readable,
portable, and easy to audit without serialized block-level settings.
*/

/* ============================================================
   Site-wide layout and typography source of truth
   ============================================================ */
@font-face{
	font-family:"Nunito Sans";
	font-style:normal;
	font-weight:200 1000;
	font-display:swap;
	src:url("/wp-content/uploads/generatepress/fonts/nunito-sans/pe0TMImSLYBIv1o4X1M8ce2xCx3yop4tQpF_MeTm0lfGWVpNn64CL7U8upHZIbMV51Q42ptCp7t1R-tQLL50tE8.woff2") format("woff2");
}
@font-face{
	font-family:"Barlow Semi Condensed";
	font-style:normal;
	font-weight:700;
	font-display:swap;
	src:url("/wp-content/uploads/generatepress/fonts/barlow-semi-condensed/wlpigxjLBV1hqnzfr-F8sEYMB0Yybp0mudRfw6-PBWEki52WfA.woff2") format("woff2");
}
:root{
	--sc-content-width:1200px;
	--sc-font-body:"Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
	--sc-font-heading:"Barlow Semi Condensed","Arial Narrow",var(--sc-font-body);
	--sc-font-elegant:"Avenir Next","Nunito Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body,
button,
input,
select,
textarea{
	font-family:var(--sc-font-body);
}
body{ font-size:1.125rem; line-height:1.5; }
h1,h2,h3,h4,h5,h6{
	font-family:var(--sc-font-heading);
	font-weight:700;
}
h1{ font-size:clamp(3rem,3.704vw + 1.222rem,4rem); line-height:calc(1px + 2ex); }
h2{ font-size:clamp(2rem,1.389vw + 1.333rem,2.375rem); line-height:calc(5px + 2ex); }
h3{ font-size:clamp(1.313rem,.926vw + .868rem,1.563rem); line-height:calc(5px + 2ex); }
h4{ font-size:clamp(1.313rem,.231vw + 1.201rem,1.375rem); line-height:calc(6px + 2ex); }
h5{ font-size:1.25rem; line-height:calc(6px + 2ex); }
h6{ font-size:1.125rem; line-height:calc(6px + 2ex); }
.main-navigation{ font-weight:700; }

/* Review form: the email field's default bottom margin made the submit button
   appear lower than its input. Align both controls to the same baseline. */
.gb-form-d616e134 .gb-element-006b966d > .gb-form-field{ margin-bottom:0; }
.gb-form-d616e134 .gb-element-006b966d > button[type="submit"]{
	align-self:end;
	justify-self:start;
}
.sc-guide-docs-link{ margin-top:1.5rem; }

/* Every actual inner section container receives .sc-inner. GenerateBlocks owns
   only the outer full-width bands; this rule owns centering and width. The
   extra specificity deliberately overrides older generated/global GB rules. */
.entry-content .sc-inner{
	width:min(100%,var(--sc-content-width));
	max-width:none;
	margin-left:auto;
	margin-right:auto;
}
.entry-content > .sc-inner,
.entry-content .sc-wrap.sc-inner{
	width:min(calc(100% - 48px),var(--sc-content-width));
}
@media (max-width:767px){
	.entry-content > .sc-inner,
	.entry-content .sc-wrap.sc-inner{ width:calc(100% - 32px); }
}

/* Reusable lighter editorial typography, used by the Galleries marketing page. */
.sc-font-elegant,
.page-id-49267{
	font-family:var(--sc-font-elegant);
}
.sc-font-elegant h1,.sc-font-elegant h2,.sc-font-elegant h3,
.sc-font-elegant h4,.sc-font-elegant h5,.sc-font-elegant h6,
.page-id-49267 h1,.page-id-49267 h2,.page-id-49267 h3,
.page-id-49267 h4,.page-id-49267 h5,.page-id-49267 h6{
	font-family:var(--sc-font-elegant);
}

/* Site logo: the ShootCal mark is an SVG with no intrinsic width, so without
   an explicit size it expands to fill its container. */
.site-logo img,
.custom-logo,
.site-header .header-image{ height:38px; width:auto; max-width:none; }

/* BetterDocs search modal: the active-tab underline and its icon are hardcoded
   to the plugin's teal (#00B884) with no Customizer control, so they are the one
   place the help centre needs a CSS override to reach the ShootCal accent. */
.betterdocs-search-modal-layout-1 .betterdocs-tab-items.active{
	border-bottom-color: var(--accent);
}
.betterdocs-search-modal-layout-1 .betterdocs-tab-items.active svg{
	fill: var(--accent);
}

/* ============================================================
   ShootCal homepage — ported from the live marketing page.
   Layout only; every colour comes from the GeneratePress global
   palette so the Customizer stays the single source of truth.
   ============================================================ */

.sc-section{ padding:72px 0; }
.sc-section > .wp-block-group__inner-container,
.sc-hero > .wp-block-group__inner-container,
.sc-spotlight > .wp-block-group__inner-container,
.sc-final-cta > .wp-block-group__inner-container{
	max-width:1120px; margin-inline:auto; padding-inline:24px;
}

.sc-section h2, .sc-wrap > h2{ text-align:center; font-size:2rem; line-height:1.2; margin:0 0 .6rem; }
.sc-lede{
	text-align:center; max-width:720px; margin:0 auto 2.5rem;
	color:var(--contrast-3); font-size:1.05rem;
}

/* Small caps group label above a run of cards. */
.sc-feat-group{
	font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
	color:var(--contrast-3); margin:2.5rem 0 1rem; text-align:left;
}
.sc-eyebrow{
	font-size:.72rem; letter-spacing:.12em; text-transform:uppercase;
	color:var(--accent); margin:0 0 .5rem; font-weight:600;
}
.sc-section-note{
	max-width:760px; margin:1.75rem auto 0; text-align:center;
	color:var(--contrast-3); line-height:1.6;
}
.sc-section-note a{ color:var(--accent-2); font-weight:600; text-decoration:none; }
.sc-section-note a:hover{ text-decoration:underline; }
body.home .sc-final-cta .sc-fine{
	margin:1rem 0 0; color:rgba(255,255,255,.7); font-size:.85rem;
}

/* ---------------------------------------------------------------- hero
   Ryan's nested GenerateBlocks containers:
     .sc-hero-band  (outer, full-bleed) -> colour + position (dark band under menu)
     inner element  (max-width container) -> centred
     .sc-hero grid  -> the 2 columns (image | text)
   No negative margin: the band just sits directly under the light-glass header. */
/* Background, pull-up and padding live on the container's own block styles
   (set in the editor). Here we only centre the inner max-width container and
   set the text colours for the dark band. */
body.home .sc-hero-band{ color:#fff; }
body.home .sc-hero{ align-items:center; }            /* the 2-col grid */
body.home .sc-hero h1{ color:#fff; font-size:2.6rem; line-height:1.12; margin:.35rem 0 .5rem; }
body.home .sc-hero h1 b, body.home .sc-hero h1 strong{ color:var(--accent); font-weight:inherit; }
body.home .sc-hero .sc-eyebrow{ color:var(--accent); }
body.home .sc-hero .sc-hero-tag{ font-size:1.15rem; font-weight:600; margin:0 0 .9rem; color:#fff; }
body.home .sc-hero .sc-hero-sub{ color:rgba(255,255,255,.78); line-height:1.6; margin:0 0 1.6rem; }
body.home .sc-hero .sc-hero-sub b{ color:#fff; font-weight:600; }
body.home .sc-hero .sc-fine{ font-size:.85rem; color:rgba(255,255,255,.6); margin:.9rem 0 .2rem; }
body.home .sc-hero .sc-demo-cta{ font-size:.9rem; margin:.2rem 0; }
body.home .sc-hero .sc-demo-cta a{ color:var(--accent); text-decoration:none; }
.sc-hero__shot img{ border-radius:14px; box-shadow:0 24px 60px rgba(0,0,0,.35); }

/* ------------------------------------------------------------- buttons */
.wp-block-button.sc-btn-primary .wp-block-button__link{
	background:var(--accent); color:#fff; border-radius:10px;
	padding:.8rem 1.4rem; font-weight:600;
}
.wp-block-button.sc-btn-primary .wp-block-button__link:hover{ background:var(--accent-2); }
.wp-block-button.sc-btn-secondary .wp-block-button__link{
	background:transparent; color:inherit; border:1px solid currentColor;
	border-radius:10px; padding:.8rem 1.4rem; font-weight:600;
}
.sc-hero .wp-block-buttons{ gap:12px; }

/* --------------------------------------------------------- feature cards
   .sc-cards is the class on each GenerateBlocks grid Element. The GB grid
   layout (columns/gaps) is compiled from the block's own styles; this class
   only paints the CARD look onto the grid's direct children, reproducing the
   real shootcal.com feature cards. */
.sc-cards{ text-align:left; margin-bottom:8px; column-gap:24px; row-gap:24px; }
.sc-cards > div{
	background:#ffffff;
	border:1px solid rgba(230,226,221,.65);
	border-radius:16px;
	padding:24px 22px;
	box-shadow:0 1px 2px rgba(20,25,32,.04), 0 10px 28px rgba(43,52,64,.10);
}
.sc-cards .gb-shape{ margin-bottom:13px; line-height:0; }
.sc-cards .gb-shape svg{ width:30px; height:30px; fill:var(--accent-2); display:block; }
.sc-cards h3{
	margin:0 0 7px; font-size:1.05rem; letter-spacing:-.01em;
	line-height:1.3; color:var(--contrast);
}
.sc-cards p{ margin:0; color:var(--contrast-3); font-size:.92rem; line-height:1.5; }
.sc-cards a{ color:var(--accent-2); font-weight:600; }
.feat-new{
	display:inline-block; margin-left:.4rem; padding:.12rem .42rem;
	font-size:.62rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
	background:var(--accent); color:#fff; border-radius:5px; vertical-align:middle;
}

.sc-wide-shot{ margin:0 auto 2.5rem; }
.sc-wide-shot img{ border-radius:14px; width:100%; height:auto; }

/* ---------------------------------------------------- side-by-side (repeating)
   Grid STRUCTURE (display:grid + columns + responsive) lives in the Grid block.
   Everything tunable — gaps, alignment, colours, section background + padding —
   lives HERE in one place, shared by every side-by-side section. */
/* ---------------------------------------------- app look: warm wash + shadows
   Old site floats white cards on a soft warm gradient, with dark accent sections.
   The wash is full-bleed on <body> (every section wrapper is transparent above it);
   reusable gradient/shadow classes so the look is applied per-container, tuned here. */
/* White page shell with the sky-to-sunset wash applied only to selected
   full-width outer sections. White full-width sections provide separators. */
body.home, body.page, body.blog, body.single, body.archive, body.search, body.error404{
	background:#fff;
}
/* GeneratePress places the entire site inside #page; keep that shell white. */
#page.site{ background:#fff; }
.entry-content > .gbp-section{ background-color:transparent !important; }
/* Old site's "sky to sunset" wash: sky-blue radial (top-left) + sunset-peach
   radial (bottom-right) over a pale blue->peach base. Defined once, reused. */
:root{
	--sc-sky:
		radial-gradient(1200px 800px at 8% 4%, rgba(169,198,230,.55), rgba(0,0,0,0) 55%),
		radial-gradient(1100px 900px at 96% 100%, rgba(244,200,166,.6), rgba(0,0,0,0) 55%),
		linear-gradient(135deg, #eef4fb 0%, #fdf3ec 100%);
}
/* Elegant dark gradient (from the front-page header ink) for contrast sections. */
:root{ --sc-dark: linear-gradient(155deg, #313d4d 0%, #1e2530 100%); }
.sc-grad-sky,
.entry-content > .gbp-section.sc-grad-sky{ background:var(--sc-sky) !important; }
.sc-grad-dark{ background:var(--sc-dark); color:#fff; }
.sc-grad-warm{ background:linear-gradient(180deg,#f6ede2 0%,#fdf9f4 100%); }
.sc-grad-cool{ background:linear-gradient(180deg,#eef1f5 0%,#fbfcfd 100%); }
.sc-card{ border-radius:16px; box-shadow:0 1px 2px rgba(20,25,32,.04), 0 10px 28px rgba(43,52,64,.10); }

/* Photo band: a full-width section with a background IMAGE (set on the section
   itself) + a frosted-glass inner card (.sc-glass). Emulates the old site's
   .band / .band-in. Reusable so any photo band uses the same look. */
.sc-band-photo{ padding:118px 24px; background-position:center center; background-size:cover; }
.sc-glass{
	background:rgba(18,18,24,.26);
	-webkit-backdrop-filter:blur(18px) saturate(1.35);
	backdrop-filter:blur(18px) saturate(1.35);
	border:1px solid rgba(255,255,255,.20);
	border-radius:24px;
	box-shadow:0 16px 50px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.15);
	padding:40px 48px; text-align:center; color:#fff;
}
.sc-glass h2, .sc-glass .gb-text{ color:#fff; }
.sc-glass h2{ margin:0 0 .55rem; }
.sc-glass p{ color:rgba(255,255,255,.85); margin:0; line-height:1.6; }
.sc-glass .sc-eyebrow{ color:rgba(255,255,255,.85); margin:0 0 .5rem; display:block; }
@media (max-width:600px){ .sc-band-photo{ padding:72px 16px; } .sc-glass{ padding:28px 22px; } }

/* ------------------------------------------------ galleries section (own identity)
   Conditional Menus swaps to the "Galleries" menu on these pages; here we match
   the old galleries site: a "ShootCal | Galleries" brand lockup + the lighter,
   more elegant system type (vs the main site's Barlow Semi Condensed display).
   Scoped by page id — add more galleries page ids to the selector list to extend. */
.page-id-49267 .navigation-branding{ display:flex; align-items:center; }
.page-id-49267 .navigation-branding::after{
	content:"Galleries"; margin-left:13px; padding-left:13px;
	border-left:1px solid rgba(43,52,64,.22);
	font-family:var(--sc-font-elegant);
	font-weight:400; font-size:1.16rem; color:var(--contrast-3); line-height:1;
}
.page-id-49267 h1, .page-id-49267 h2{
	font-weight:300; letter-spacing:-.02em;
}
.page-id-49267 h3{
	font-weight:500; letter-spacing:-.01em;
}
/* galleries hero: centered buttons (dark primary + outline secondary, like old site) */
.page-id-49267 .wp-block-buttons{ justify-content:center; gap:14px; margin-top:2rem; }
.page-id-49267 .sc-btn-primary .wp-block-button__link{ background:var(--contrast); color:#fff; }
.page-id-49267 .sc-btn-primary .wp-block-button__link:hover{ background:#1f2730; }
/* dual overlapping image composition (custom CSS, container-scoped) */
.sc-dual{ position:relative; max-width:1000px; margin:48px auto 0; padding-bottom:72px; }
.sc-dual figure{ margin:0; }
.sc-dual img{ display:block; width:100%; height:auto; border-radius:18px; }
.sc-dual .sc-dual-a{ width:62%; position:relative; z-index:1; }
.sc-dual .sc-dual-a img{ box-shadow:0 30px 70px rgba(20,25,32,.20); }
.sc-dual .sc-dual-b{ width:48%; position:absolute; right:0; top:30%; z-index:2; }
.sc-dual .sc-dual-b img{ box-shadow:0 24px 60px rgba(20,25,32,.22); }
@media (max-width:768px){
	.sc-dual{ padding-bottom:0; max-width:520px; }
	.sc-dual .sc-dual-a{ width:100%; }
	.sc-dual .sc-dual-b{ position:relative; width:80%; right:auto; top:auto; margin:-12% auto 0; }
}

.sc-band-cream{ background:var(--sc-sky); padding:64px 24px; }

/* Constrained no-background section: a GB container set to max-width global +
   margin auto (built in the editor). Full-width content strips the old container
   padding, so re-add the section rhythm here. One class for every such wrapper
   across all pages, so padding/spacing is tunable from one place. */
.sc-wrap{ padding:64px 0; }
@media (max-width:767px){ .sc-wrap{ padding:44px 0; } }
.sc-split{ column-gap:48px; row-gap:1.5em; align-items:center; } /* gaps + alignment */
/* Column styling by position, so it works whether the columns are plain
   containers (Ryan's booking example) or have sc-split__* classes (mine). */
.sc-split > *:first-child h2{ text-align:left; margin-top:0; }
.sc-split > *:first-child p{ color:var(--contrast-3); line-height:1.6; }
.sc-split img{
	border-radius:14px; box-shadow:0 14px 40px rgba(20,25,32,.14);
	width:100%; height:auto;
}
.sc-split.is-reverse > *:first-child{ order:2; }     /* reversed: text (first) to the right */
@media (max-width:767px){
	.sc-split.is-reverse > *:first-child{ order:0; } /* grid stacks via the block's own @media */
}

/* -------------------------------------------------------------- story */
/* Story: a centered dark card (now a GB container, so the card styling lives on
   the element itself instead of the old group inner-container). */
.sc-story{
	background:var(--sc-dark); color:#fff; border-radius:18px; padding:44px 40px;
	max-width:900px; margin:56px auto;
	box-shadow:0 14px 40px rgba(43,52,64,.22);   /* app-look drop shadow on the dark card */
}
.sc-story h2{ color:#fff; }
.sc-story p{ color:rgba(255,255,255,.8); text-align:center; }
.sc-story a{ color:var(--accent); }

/* ---------------------------------------------------------------- faq
   GenerateBlocks Pro accordion, themed via one class (repeating items). */
.sc-faq-accordion{ max-width:820px; margin-inline:auto; }
.sc-faq-accordion .gb-accordion__item{
	border:none; border-bottom:1px solid rgba(43,52,64,.12);
	padding:0; margin:0;
}
.sc-faq-accordion .gb-accordion__toggle{
	color:var(--contrast); font-weight:600; font-size:1.02rem;
	padding:16px 0; cursor:pointer;
}
.sc-faq-accordion .gb-accordion__toggle:hover{ color:var(--accent-2); }
.sc-faq-accordion .gb-accordion__toggle-icon{ color:var(--accent); flex:0 0 auto; }
.sc-faq-accordion .gb-accordion__content .gb-element{ margin-top:0; }
.sc-faq-accordion .gb-accordion__content p{
	color:var(--contrast-3); line-height:1.6; margin:0; padding:0 0 16px;
}

/* ----------------------------------------------------------- final CTA */
.sc-final-cta{ background:var(--sc-dark); color:#fff; padding:72px 0; text-align:center; }
.sc-final-cta h2{ color:#fff; }
.sc-final-cta p{ color:rgba(255,255,255,.78); }
.sc-final-cta .wp-block-buttons{ justify-content:center; gap:12px; }

/* -------------------------------------------------------- breakpoints
   The GB grid compiles 3-col -> 1-col at 767px. Reinstate the old site's
   3/2/1 steps; `.sc-section .sc-cards` outranks `.gb-element-<id>` so it wins
   regardless of stylesheet order. */
@media (max-width:1024px){
	.sc-section .sc-cards, .sc-wrap .sc-cards{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:860px){
	.sc-hero > .wp-block-group__inner-container,
	.sc-spotlight > .wp-block-group__inner-container{ grid-template-columns:1fr; gap:32px; }
	.sc-spotlight.is-reverse > .wp-block-group__inner-container > .sc-spotlight__text{ order:0; }
	.sc-hero h1{ font-size:2.05rem; }
	.sc-section, .sc-spotlight{ padding:52px 0; }
}
@media (max-width:600px){
	.sc-section .sc-cards, .sc-wrap .sc-cards{ grid-template-columns:1fr; }
}

/* Text columns: same treatment, so hero and spotlight copy sit at sane rhythm. */
.sc-hero__text > .wp-block-group__inner-container,
.sc-spotlight__text > .wp-block-group__inner-container{ padding:0; }
.sc-section > .wp-block-group__inner-container{ padding-block:0; }

/* --------------------------------------------------------- contact form */
.sc-contact{ text-align:center; }
.sc-contact .gb-form, .sc-contact form{ max-width:560px; margin:0 auto; text-align:left; }
.sc-contact input, .sc-contact textarea{
	width:100%; border:1px solid rgba(43,52,64,.16); border-radius:10px;
	padding:.7rem .85rem; font-size:1rem; background:#fff; color:var(--contrast);
}
.sc-contact input:focus, .sc-contact textarea:focus{
	outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(236,138,92,.18);
}
.sc-contact textarea{ min-height:130px; resize:vertical; }
.sc-contact label{ font-weight:600; font-size:.9rem; color:var(--contrast); }
.sc-contact button[type=submit], .sc-contact .gb-button{
	background:var(--accent); color:#fff; border:none; border-radius:10px;
	padding:.75rem 1.5rem; font-weight:600; cursor:pointer;
}
.sc-contact button[type=submit]:hover{ background:var(--accent-2); }

/* -------------------------------------------------- v3 sub-page harmonisation
   The ported sub-pages use Resolution's .gbp-section (128px vertical padding —
   too much). Bring it to the homepage's rhythm. One rule, every sub-page. */
.entry-content .gbp-section{ padding-top:60px; padding-bottom:60px; }
/* Fixed-up page CTAs (were flattened run-together text) */
.sc-page-cta{ gap:12px; margin-top:8px; }
.sc-cta-more{ margin-top:14px; }
.sc-cta-more a{ color:var(--accent-2); font-weight:600; }

/* ============================================================
   Liquid-glass header (adapted from ryansmithphotography's frosted nav).
   Structure: GeneratePress "navigation as header" -> .main-navigation IS the
   header; on scroll GP shows a fixed #sticky-navigation clone (auto-hide).
   GP has no backdrop-filter setting, so the glass lives here; the nav's own
   background is transparent (set in the Customizer) so this shows through.
     - homepage top: transparent over the dark hero + light text
     - everywhere else / on scroll: light frosted glass + ink text
   ============================================================ */

/* In-flow header (light interior pages): light frosted glass. */
.main-navigation{
	-webkit-backdrop-filter:blur(20px) saturate(180%);
	backdrop-filter:blur(20px) saturate(180%);
	background:linear-gradient(to bottom, rgba(255,255,255,.80) 0%, rgba(255,255,255,.64) 100%);
	border-bottom:1px solid rgba(43,52,64,.10);
}
.main-navigation a, .navigation-branding .main-title{ color:var(--contrast); }
.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:hover,
.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus,
body:not(.page-id-49267) .main-navigation .main-nav > ul > li.current-menu-item:not(.sc-menu-cta) > a{
	color:var(--contrast);
}

/* Header is light frosted glass on every page, homepage included (the ShootCal
   logo reads better on light glass than on black). The homepage's dark hero band
   simply sits directly below it. */

/* The fixed sticky clone (shown on scroll) always floats over page content,
   so it is always light frosted glass with ink text. ID wins over the rules
   above without !important. */
#sticky-navigation{
	-webkit-backdrop-filter:blur(20px) saturate(180%);
	backdrop-filter:blur(20px) saturate(180%);
	background:linear-gradient(to bottom, rgba(255,255,255,.86) 0%, rgba(255,255,255,.72) 100%);
	border-bottom:1px solid rgba(43,52,64,.10);
	box-shadow:0 6px 28px rgba(20,25,32,.08);
}
#sticky-navigation a, #sticky-navigation .navigation-branding .main-title{ color:var(--contrast); }
#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:hover,
#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus,
body:not(.page-id-49267) #sticky-navigation .main-nav > ul > li.current-menu-item:not(.sc-menu-cta) > a{
	color:var(--contrast);
}

/* Desktop menu items stay typographic at rest. A quiet neutral wash appears
   only while hovering or keyboard-focusing; the coral app CTA remains the
   header's only button-shaped control. */
@media (min-width:993px){
	.main-navigation .main-nav > ul,
	#sticky-navigation .main-nav > ul{
		align-items:center;
		gap:2px;
	}
	.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a,
	#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a{
		padding:10px 12px;
		border:0;
		border-radius:7px;
		background:transparent;
		color:var(--contrast-3);
		line-height:1.2;
		box-shadow:none;
		-webkit-backdrop-filter:none;
		backdrop-filter:none;
		transition:background-color .16s ease,color .16s ease;
	}
	.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:hover,
	.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus-visible,
	#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:hover,
	#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus-visible{
		background-color:rgba(43,52,64,.055);
		color:var(--contrast);
	}
	body:not(.page-id-49267) .main-navigation .main-nav > ul > li.current-menu-item:not(.sc-menu-cta) > a,
	body:not(.page-id-49267) #sticky-navigation .main-nav > ul > li.current-menu-item:not(.sc-menu-cta) > a{
		color:var(--contrast);
		font-weight:700;
	}
	.main-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus-visible,
	#sticky-navigation .main-nav > ul > li:not(.sc-menu-cta) > a:focus-visible{
		outline:2px solid rgba(43,52,64,.42);
		outline-offset:2px;
	}
}

/* "Open web app" menu item rendered as a coral pill button. GP's nav rules
   (.main-navigation .main-nav ul li a, specificity 0,3,1) set the link colour,
   a 60px line-height, and a transparent hover background — so this MUST match
   that structure + the .sc-menu-cta class (0,4,1) to win, no !important. */
.main-navigation .main-nav ul li.sc-menu-cta,
#sticky-navigation .main-nav ul li.sc-menu-cta{
	display:flex; align-items:center; margin-left:.5em;
}
.main-navigation .main-nav ul li.sc-menu-cta > a,
#sticky-navigation .main-nav ul li.sc-menu-cta > a{
	background:var(--accent); color:#fff;
	border-radius:8px; padding:.5em 1.1em; line-height:1.3;
	transition:background .15s ease;
}
.main-navigation .main-nav ul li.sc-menu-cta > a:hover,
.main-navigation .main-nav ul li.sc-menu-cta > a:focus,
#sticky-navigation .main-nav ul li.sc-menu-cta > a:hover,
#sticky-navigation .main-nav ul li.sc-menu-cta > a:focus{
	background:var(--accent-2); color:#fff;
}

/* Mobile menu (<=992px): the open dropdown is an absolutely-positioned <ul>, so
   the frosted background goes on IT (not the 61px bar). Make it a full-width panel
   so items don't float over page content, and drop the "Menu" text label. */
@media (max-width:992px){
	.menu-toggle .mobile-menu{ display:none; }        /* remove "Menu" text, keep icon */
	.main-navigation.toggled .main-nav > ul,
	#sticky-navigation.toggled .main-nav > ul{
		left:0; right:0; width:100%;
		background:rgba(255,255,255,.98);
		-webkit-backdrop-filter:blur(22px) saturate(180%);
		backdrop-filter:blur(22px) saturate(180%);
		box-shadow:0 14px 34px rgba(20,25,32,.14);
		padding:6px 0 14px;
	}
	.main-navigation.toggled .main-nav ul li a,
	#sticky-navigation.toggled .main-nav ul li a{
		color:var(--contrast); padding:13px 22px;
		border-top:1px solid rgba(43,52,64,.06);
		line-height:1.3;
	}
	.main-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a,
	#sticky-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a{
		margin:0;
		padding:12px 22px;
		border:0;
		border-radius:0;
	}
	.main-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a:hover,
	.main-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a:focus-visible,
	#sticky-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a:hover,
	#sticky-navigation.toggled .main-nav ul li:not(.sc-menu-cta) > a:focus-visible{
		background:rgba(43,52,64,.055);
		box-shadow:none;
		color:var(--contrast);
	}
	body:not(.page-id-49267) .main-navigation.toggled .main-nav ul li.current-menu-item:not(.sc-menu-cta) > a,
	body:not(.page-id-49267) #sticky-navigation.toggled .main-nav ul li.current-menu-item:not(.sc-menu-cta) > a{
		color:var(--contrast);
		font-weight:700;
	}
	.main-navigation.toggled .main-nav ul li.sc-menu-cta,
	#sticky-navigation.toggled .main-nav ul li.sc-menu-cta{
		width:auto;
		box-sizing:border-box;
		margin:12px 22px 4px;
	}
	.main-navigation.toggled .sc-menu-cta a{ display:inline-block; }
}

/* ------------------------------------------------ comparison tables (compare page)
   One semantic table remains fully readable without JavaScript. On phones, a
   native select narrows the matrix to ShootCal + one competitor; desktop keeps
   every competitor visible with a sticky feature column and scroll affordance. */
.sc-band-white,
.entry-content > .gbp-section.sc-band-white{ background:var(--base-3) !important; }
.sc-band-soft,
.entry-content > .gbp-section.sc-band-soft{
	background:linear-gradient(180deg,#f7f8fa 0%,#f3f5f7 100%) !important;
	border-top:1px solid rgba(43,52,64,.055);
	border-bottom:1px solid rgba(43,52,64,.055);
}
.sc-grad-dark h2,
.sc-grad-dark h3{ color:#fff; }
.sc-grad-dark p{ color:rgba(255,255,255,.78); }

.sc-compare-tool{ margin:2rem 0 0; }
.sc-compare-tool + .sc-compare-tool{ margin-top:4rem; }
.sc-compare-intro{ max-width:780px; margin:0 0 1.2rem; color:var(--contrast-3); }
.sc-compare-picker{
	display:none; align-items:center; gap:10px; margin:1rem 0;
	padding:12px 14px; border:1px solid rgba(43,52,64,.13); border-radius:14px;
	background:rgba(255,255,255,.78); box-shadow:0 8px 24px rgba(43,52,64,.08);
}
.sc-compare-picker label{ font-size:.83rem; font-weight:700; color:var(--contrast); }
.sc-compare-picker select{
	min-width:0; flex:1; padding:10px 34px 10px 12px; border:1px solid rgba(43,52,64,.2);
	border-radius:10px; background:#fff; color:var(--contrast); font:inherit;
}
.sc-compare-table{
	position:relative; overflow-x:auto; margin:1.2rem 0 1.35rem;
	border:1px solid rgba(43,52,64,.12); border-radius:18px; background:#fff;
	box-shadow:0 2px 8px rgba(43,52,64,.04),0 18px 44px rgba(43,52,64,.09);
	-webkit-overflow-scrolling:touch;
}
.sc-compare-table:focus-visible{ outline:3px solid var(--accent); outline-offset:3px; }
.sc-compare-table table{ width:100%; border-collapse:separate; border-spacing:0; font-size:.88rem; min-width:640px; margin:0; }
.sc-compare-table caption{
	padding:0; width:1px; height:1px; overflow:hidden; position:absolute;
	clip:rect(0 0 0 0); white-space:nowrap;
}
.sc-compare-table th,
.sc-compare-table td{
	padding:.78rem .72rem; text-align:center; border:0; border-bottom:1px solid rgba(43,52,64,.10);
	vertical-align:middle; line-height:1.4; overflow-wrap:anywhere;
}
.sc-compare-table thead th{
	position:sticky; top:0; z-index:2; font-weight:750; color:var(--contrast);
	background:#f6f8fb; border-bottom:2px solid rgba(43,52,64,.18);
}
.sc-compare-table tbody tr:nth-child(even) > *{ background:rgba(238,244,251,.46); }
.sc-compare-table tbody tr:last-child > *{ border-bottom:0; }
.sc-compare-table tbody th,
.sc-compare-table tbody td:first-child,
.sc-compare-table thead th:first-child{
	text-align:left; font-weight:650; color:var(--contrast); min-width:220px;
}
.sc-compare-table--smart table{ min-width:1180px; }
.sc-compare-table--smart th:first-child{
	position:sticky; left:0; z-index:3; background:#fff;
	box-shadow:none;
}
.sc-compare-table--smart tbody tr:nth-child(even) th:first-child{ background:#f7f9fc; }
.sc-compare-table th[data-brand="shootcal"],
.sc-compare-table td[data-brand="shootcal"]{
	background:rgba(236,138,92,.09); border-left:1px solid rgba(236,138,92,.25);
	border-right:1px solid rgba(236,138,92,.25);
}
.sc-compare-table tbody tr:nth-child(even) td[data-brand="shootcal"]{ background:rgba(236,138,92,.13); }
.sc-compare-table thead th[data-brand="shootcal"]{ color:var(--accent-2); background:#fff4ee; }
.sc-compare-table .sc-y{ color:var(--accent-2); font-weight:750; }
.sc-compare-table .sc-n{ color:var(--base); }
.sc-compare-table .sc-soon{ display:inline-block; padding:2px 7px; border-radius:999px; background:rgba(236,138,92,.13); color:var(--accent-2); font-size:.76em; font-weight:700; }
.sc-compare-source{ margin:.75rem 0 0; color:var(--contrast-3); font-size:.8rem; line-height:1.55; }
.sc-compare-source a{ white-space:nowrap; }
.sc-compare-points{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:2rem 0 0; }
.sc-compare-point{
	padding:22px; border:1px solid rgba(255,255,255,.16); border-radius:16px;
	background:rgba(255,255,255,.07); box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}
.sc-compare-point h3{ margin:0 0 .4rem; font-size:1.08rem; }
.sc-compare-point p{ margin:0; }
.sc-compare-choices{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin:2.25rem 0 0; }
.sc-compare-choice{ padding:22px; border:1px solid rgba(43,52,64,.11); border-radius:16px; background:#fff; box-shadow:0 10px 28px rgba(43,52,64,.07); }
.sc-compare-choice h3{ margin:0 0 .45rem; font-size:1.08rem; }
.sc-compare-choice p{ margin:0; color:var(--contrast-3); }

@media(max-width:760px){
	.sc-compare-picker{ display:flex; }
	.sc-compare-table--smart table{ min-width:0; table-layout:fixed; font-size:.78rem; }
	.sc-compare-table--smart th,
	.sc-compare-table--smart td{ padding:.68rem .42rem; }
	.sc-compare-table--smart th:first-child{ position:static; min-width:0; width:44%; box-shadow:none; }
	.sc-compare-table--smart [data-brand]{ width:28%; }
	.sc-compare-table--smart .sc-compare-mobile-hidden{ display:none; }
	.sc-compare-points,
	.sc-compare-choices{ grid-template-columns:1fr; }
}
@media(max-width:430px){
	.sc-compare-picker{ align-items:stretch; flex-direction:column; }
	.sc-compare-table--smart table{ font-size:.74rem; }
}

/* The direct Galleries comparison has only two products, so it stays fully
   visible instead of needing a selector. Container queries make it respond to
   the space actually available to the chart, including narrow embeds. */
.sc-compare-table--galleries{
	container-name:sc-gallery-compare;
	container-type:inline-size;
}
@container sc-gallery-compare (max-width:620px){
	.sc-compare-table--galleries table{
		display:block;
		width:100%;
		min-width:0;
		table-layout:fixed;
		font-size:.8rem;
	}
	.sc-compare-table--galleries thead,
	.sc-compare-table--galleries tbody{ display:block; }
	.sc-compare-table--galleries thead tr,
	.sc-compare-table--galleries tbody tr{
		display:grid;
		grid-template-columns:minmax(118px,.85fr) repeat(2,minmax(0,1fr));
		width:100%;
	}
	.sc-compare-table--galleries th,
	.sc-compare-table--galleries td{
		position:static;
		width:auto;
		min-width:0;
		padding:.7rem .55rem;
	}
	.sc-compare-table--galleries thead th:first-child,
	.sc-compare-table--galleries tbody th{
		width:auto;
		min-width:0;
		box-shadow:none;
	}
}
@container sc-gallery-compare (max-width:460px){
	.sc-compare-table--galleries thead{
		position:absolute;
		width:1px;
		height:1px;
		overflow:hidden;
		clip-path:inset(50%);
		white-space:nowrap;
	}
	.sc-compare-table--galleries tbody tr{ display:block; }
	.sc-compare-table--galleries tbody tr:not(:last-child){
		border-bottom:8px solid #eef2f7;
	}
	.sc-compare-table--galleries tbody th{
		display:block;
		padding:.72rem .75rem;
		background:#f6f8fb;
		border-bottom:1px solid rgba(43,52,64,.12);
		font-size:.84rem;
		text-align:left;
	}
	.sc-compare-table--galleries tbody td{
		display:grid;
		grid-template-columns:minmax(78px,.7fr) minmax(0,1.3fr);
		gap:10px;
		align-items:start;
		padding:.72rem .75rem;
		border-right:0;
		border-left:0;
		text-align:left;
	}
	.sc-compare-table--galleries tbody td:nth-of-type(1){
		background:#fff7f2;
	}
	.sc-compare-table--galleries tbody td:nth-of-type(2){
		background:#fff;
	}
	.sc-compare-table--galleries tbody td:nth-of-type(1)::before,
	.sc-compare-table--galleries tbody td:nth-of-type(2)::before{
		font-weight:750;
		line-height:1.35;
	}
	.sc-compare-table--galleries tbody td:nth-of-type(1)::before{
		content:"ShootCal";
		color:var(--accent-2);
	}
	.sc-compare-table--galleries tbody td:nth-of-type(2)::before{
		content:"Pixieset";
		color:var(--contrast);
	}
}

/* ------------------------------------------------ galleries pricing cards
   3-column pricing grid (Free / Plus / Pro). Grid columns live in the block;
   card look + price typography here. */
.sc-pricing{ column-gap:20px; row-gap:20px; margin:1.6rem 0 .5rem; }
.sc-price{
	background:#fff; border:1px solid rgba(230,226,221,.7); border-radius:16px;
	padding:28px 26px; box-shadow:0 1px 2px rgba(20,25,32,.04), 0 10px 28px rgba(43,52,64,.10);
	text-align:left;
}
.sc-price .sc-price-name{ font-size:1.15rem; font-weight:600; margin:0; color:var(--contrast); }
.sc-price .sc-badge{ font-size:.58rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; background:var(--accent); color:#fff; padding:.18rem .45rem; border-radius:5px; vertical-align:middle; margin-left:.35rem; }
.sc-price .sc-amt{ font-size:2rem; font-weight:700; color:var(--contrast); margin:.45rem 0 0; line-height:1; }
.sc-price .sc-store{ color:var(--accent-2); font-weight:600; font-size:.95rem; margin:.35rem 0 .85rem; }
.sc-price .sc-desc{ color:var(--contrast-3); font-size:.9rem; line-height:1.55; margin:0; }

/* ------------------------------------------------ galleries examples + help
   The example layout itself is a GenerateBlocks grid. These shared classes only
   provide the repeated card treatment and Help Center callout. */
.sc-gallery-grid{ margin:1.6rem 0 .5rem; }
.sc-gallery-card{
	display:block; overflow:hidden; border-radius:18px; background:#fff;
	box-shadow:0 1px 2px rgba(20,25,32,.04), 0 14px 36px rgba(43,52,64,.14);
	transition:transform .18s ease, box-shadow .18s ease;
}
.sc-gallery-card:hover,
.sc-gallery-card:focus-visible{ transform:translateY(-2px); box-shadow:0 2px 4px rgba(20,25,32,.06), 0 18px 44px rgba(43,52,64,.18); }
.sc-gallery-card figure{ margin:0; }
.sc-gallery-card img{ display:block; width:100%; height:auto; }
.sc-help-card{
	display:block; margin-top:28px; padding:24px 26px; border:1px solid rgba(236,138,92,.32);
	border-radius:16px; background:rgba(255,255,255,.72); color:var(--contrast);
	text-decoration:none; box-shadow:0 8px 24px rgba(43,52,64,.08);
}
.sc-help-card:hover,
.sc-help-card:focus-visible{ border-color:var(--accent); background:#fff; }
.sc-help-card h3{ margin:0 0 5px; color:var(--accent-2); }
.sc-help-card p{ margin:0; color:var(--contrast-3); }

/* Two-column feature grids are defined in the GenerateBlocks parent. This is
   only spacing shared by the Payments grids. */
.sc-feature-grid{ margin-top:1.6rem; }

/* ------------------------------------------------ preview FAQ
   Core Details keeps the questions semantic and keyboard-native. */
.sc-faq-core{ display:grid; gap:12px; margin-top:1.5rem; }
.sc-faq-core .wp-block-details{
	margin:0; padding:18px 20px; border:1px solid rgba(230,226,221,.78);
	border-radius:14px; background:#fff; box-shadow:0 5px 20px rgba(43,52,64,.07);
}
.sc-faq-core summary{ cursor:pointer; color:var(--contrast); font-weight:650; line-height:1.35; }
.sc-faq-core summary:focus-visible{ outline:3px solid var(--accent); outline-offset:5px; border-radius:3px; }
.sc-faq-core .wp-block-details p{ margin:.8rem 0 0; color:var(--contrast-3); }

/* ------------------------------------------------ screenshot lightbox
   Restores the original site's click-to-enlarge behavior for product images. */
.sc-zoomable{ cursor:zoom-in; }
.sc-zoomable:focus-visible{ outline:3px solid var(--accent); outline-offset:4px; }
body.sc-lightbox-open{ overflow:hidden; }
.sc-lightbox{
	position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center;
	padding:56px 24px 24px; background:rgba(18,22,28,.88); backdrop-filter:blur(8px);
}
.sc-lightbox.is-open{ display:flex; }
.sc-lightbox img{ display:block; max-width:min(1400px,96vw); max-height:88vh; width:auto; height:auto; border-radius:12px; box-shadow:0 24px 80px rgba(0,0,0,.45); }
.sc-lightbox__close{
	position:absolute; top:14px; right:18px; display:grid; place-items:center; width:42px; height:42px;
	padding:0; border:1px solid rgba(255,255,255,.34); border-radius:50%; background:rgba(0,0,0,.32);
	color:#fff; font:300 32px/1 system-ui,sans-serif; cursor:pointer;
}
.sc-lightbox__close:hover,
.sc-lightbox__close:focus-visible{ background:#fff; color:var(--contrast); outline:0; }


/* ---------------------------------------------- homepage hero app-download buttons
   Branded App Store (dark ink + white Apple logo) and web-app (white + Google "G")
   buttons like the live site. Scoped to .sc-hero (the dark final-CTA keeps its own
   look) and matched by href, so no block edits are needed. */
.sc-hero .wp-block-button .wp-block-button__link{
	display:inline-flex; align-items:center; gap:10px;
	border-radius:13px; padding:11px 20px; font-weight:600; font-size:1rem;
	line-height:1.15; border:0;
}
.sc-hero .wp-block-button .wp-block-button__link[href*="apps.apple.com"]{
	background:#2b3440; color:#fff; padding-left:16px;
	border:1px solid rgba(255,255,255,.16);   /* crisp edge on the dark hero */
}
.sc-hero .wp-block-button .wp-block-button__link[href*="apps.apple.com"]:hover{ background:#1f2730; }
.sc-hero .wp-block-button .wp-block-button__link[href*="apps.apple.com"]::before{
	content:""; width:24px; height:24px; flex:0 0 auto; margin-top:-2px;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20aria-hidden%3D%22true%22%20class%3D%22apple%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M16.36%2012.93c.02%202.5%202.2%203.33%202.22%203.34-.02.06-.35%201.2-1.15%202.37-.69%201.02-1.4%202.03-2.53%202.05-1.1.02-1.46-.65-2.72-.65-1.26%200-1.66.63-2.7.67-1.09.04-1.92-1.1-2.61-2.11-1.42-2.06-2.5-5.81-1.05-8.35.72-1.26%202.01-2.06%203.41-2.08%201.07-.02%202.07.72%202.72.72.65%200%201.87-.89%203.15-.76.54.02%202.05.22%203.02%201.64-.08.05-1.8%201.05-1.78%203.16M14.3%205.39c.57-.69.96-1.65.85-2.61-.83.03-1.83.55-2.42%201.24-.53.61-1%201.59-.87%202.53.92.07%201.87-.47%202.44-1.16%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") center/contain no-repeat;
}
.sc-hero .wp-block-button .wp-block-button__link[href*="app.shootcal.com"]{
	background:#fff; color:#3c4043; border:1px solid #e6e2dd;
}
.sc-hero .wp-block-button .wp-block-button__link[href*="app.shootcal.com"]:hover{ background:#faf7f3; }
.sc-hero .wp-block-button .wp-block-button__link[href*="app.shootcal.com"]::before{
	content:""; width:20px; height:20px; flex:0 0 auto;
	background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2048%2048%22%20aria-hidden%3D%22true%22%3E%3Cpath%20fill%3D%22%23EA4335%22%20d%3D%22M24%209.5c3.54%200%206.71%201.22%209.21%203.6l6.85-6.85C35.9%202.38%2030.47%200%2024%200%2014.62%200%206.51%205.38%202.56%2013.22l7.98%206.19C12.43%2013.72%2017.74%209.5%2024%209.5z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22%234285F4%22%20d%3D%22M46.98%2024.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58%202.96-2.26%205.48-4.78%207.18l7.73%206c4.51-4.18%207.09-10.36%207.09-17.65z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22%23FBBC05%22%20d%3D%22M10.53%2028.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92%2016.46%200%2020.12%200%2024c0%203.88.92%207.54%202.56%2010.78l7.97-6.19z%22%3E%3C%2Fpath%3E%3Cpath%20fill%3D%22%2334A853%22%20d%3D%22M24%2048c6.48%200%2011.93-2.13%2015.89-5.81l-7.73-6c-2.15%201.45-4.92%202.3-8.16%202.3-6.26%200-11.57-4.22-13.47-9.91l-7.98%206.19C6.51%2042.62%2014.62%2048%2024%2048z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E") center/contain no-repeat;
}

/* ------------------------------------------------ availability calendar embed
   The live ShootCal availability calendar, on the sky->sunset gradient. */
.sc-embed-band{ background:transparent; padding:56px 24px; }
.sc-embed{ display:block; width:100%; border:0; border-radius:16px; background:#fff; box-shadow:0 10px 40px rgba(20,25,32,.12); }

/* Availability screenshots: a restrained Apple-style liquid-glass frame.
   Captions stay attached to the image semantically instead of becoming loose
   paragraphs, and the inner radius keeps the screenshot corners crisp. */
.sc-shot-card{
	position:relative; isolation:isolate; overflow:hidden; margin:2rem auto;
	padding:10px 10px 0; border:1px solid rgba(255,255,255,.82); border-radius:22px;
	background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,255,255,.58));
	box-shadow:inset 0 1px 0 rgba(255,255,255,.94), 0 4px 12px rgba(43,52,64,.07), 0 20px 48px rgba(43,52,64,.13);
	-webkit-backdrop-filter:blur(18px) saturate(145%); backdrop-filter:blur(18px) saturate(145%);
}
.sc-shot-card a{ display:block; border-radius:14px; overflow:hidden; }
.sc-shot-card img{ display:block; width:100%; height:auto; border-radius:14px; }
.sc-shot-card figcaption{
	margin:0; padding:13px 14px 15px; color:var(--contrast-3); font-size:.9rem;
	line-height:1.45; text-align:center;
}
@media(max-width:600px){
	.sc-shot-card{ padding:7px 7px 0; border-radius:17px; box-shadow:inset 0 1px 0 rgba(255,255,255,.92), 0 3px 9px rgba(43,52,64,.06), 0 14px 32px rgba(43,52,64,.12); }
	.sc-shot-card a,
	.sc-shot-card img{ border-radius:11px; }
	.sc-shot-card figcaption{ padding:11px 10px 13px; font-size:.84rem; }
}

/* ------------------------------------------------ availability feature cards
   Single-column grid; each feature (h3 + paragraphs) gets the app card look. */
.sc-featcards{ display:grid; grid-template-columns:1fr; gap:16px; margin:1.6rem auto; max-width:760px; }
.sc-featcard{ background:#fff; border:1px solid rgba(230,226,221,.7); border-radius:16px; padding:24px 26px; box-shadow:0 1px 2px rgba(20,25,32,.04), 0 10px 28px rgba(43,52,64,.10); text-align:left; }
.sc-featcard h3{ margin:0 0 6px; font-size:1.15rem; color:var(--contrast); line-height:1.3; }
.sc-featcard p{ margin:0 0 .5em; color:var(--contrast-3); line-height:1.55; }
.sc-featcard p:last-child{ margin-bottom:0; }

/* ------------------------------------------------ In-hero Rank Math breadcrumbs
   Rank Math's shortcode markup is inserted directly before each marketing
   page H1. The restrained glass capsule keeps the trail legible on both the
   sky gradient and plain light hero bands without becoming another headline. */
.entry-content .sc-hero-breadcrumb{
	display:flex;
	justify-content:center;
	max-width:none;
	margin:0 0 clamp(16px,2vw,24px);
	padding:0;
	text-align:center;
}
.entry-content .sc-hero-breadcrumb p{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	flex-wrap:wrap;
	margin:0;
	padding:7px 13px;
	border:1px solid rgba(255,255,255,.72);
	border-radius:999px;
	background:rgba(255,255,255,.44);
	box-shadow:0 1px 2px rgba(43,52,64,.06),0 8px 24px rgba(43,52,64,.07),inset 0 1px 0 rgba(255,255,255,.55);
	-webkit-backdrop-filter:blur(12px) saturate(120%);
	backdrop-filter:blur(12px) saturate(120%);
	color:rgba(43,52,64,.70);
	font-size:.78rem;
	font-weight:650;
	letter-spacing:.025em;
	line-height:1.25;
}
.entry-content .sc-hero-breadcrumb a{
	color:inherit;
	text-decoration:none;
	text-underline-offset:3px;
}
.entry-content .sc-hero-breadcrumb a:hover,
.entry-content .sc-hero-breadcrumb a:focus-visible{
	color:var(--accent-2);
	text-decoration:underline;
}
.entry-content .sc-hero-breadcrumb .last{ color:var(--contrast); }
.entry-content .sc-hero-breadcrumb .separator{
	display:inline-block;
	margin:0 7px;
	color:var(--contrast-3);
	font-size:.9rem;
	font-weight:400;
	opacity:.55;
}
@media (max-width:767px){
	.entry-content .sc-hero-breadcrumb{ margin-bottom:14px; }
	.entry-content .sc-hero-breadcrumb p{ padding:6px 11px; font-size:.74rem; }
}
