[hidden] { display: none !important; }
html { scroll-behavior: auto; scroll-padding-top: var(--pas-space-150); }
body { color-scheme: light; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
button, summary { cursor: pointer; }
a { text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, p, li { overflow-wrap: anywhere; }
h2 { font-size: var(--pas-font-display-size); line-height: var(--pas-font-display-leading); }
h3 { font-size: var(--pas-font-heading-2-size); line-height: var(--pas-font-heading-2-leading); }
.wrap { width: min(calc(100% - 96px), var(--pas-measure-wide)); margin-inline: auto; }
.section-space { padding-block: var(--pas-space-600); }
.eyebrow { font-size: var(--pas-font-small-size); font-weight: 600; color: var(--pas-color-secondary); margin-bottom: var(--pas-space-150); }
.section-heading { margin-bottom: var(--pas-space-300); }
.section-heading h2 { margin-bottom: 0; max-width: 27ch; }
.section-heading--row { display: flex; justify-content: space-between; align-items: end; gap: var(--pas-space-200); }
.section-note, .quiet { color: var(--pas-color-on-surface-muted); font-size: var(--pas-font-small-size); }
.section-note { max-width: 32ch; margin-bottom: 0; }
.brand-header { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: var(--pas-space-200); }
.brand { color: var(--pas-color-on-surface); display: grid; gap: 0; text-decoration: none; flex-shrink: 0; }
.brand:hover { text-decoration: none; }
.brand strong { font-size: var(--pas-font-heading-2-size); font-weight: 600; line-height: 1.3; }
.brand > span { font-size: 11px; color: var(--pas-color-on-surface-muted); }
.brand-dot { color: var(--pas-color-secondary); }
.brand-header nav, .footer nav { display: flex; align-items: center; gap: var(--pas-space-200); flex-wrap: wrap; }
.brand-header nav a, .footer nav a { min-height: var(--pas-size-control); display: inline-flex; align-items: center; font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface); }
.text-link { display: inline-flex; align-items: center; gap: var(--pas-space-50); min-height: var(--pas-size-control); font-size: var(--pas-font-small-size); font-weight: 500; }
.icon, .icon-button img { width: var(--pas-size-icon); height: var(--pas-size-icon); flex-shrink: 0; }
.pas-button { font-size: var(--pas-font-small-size); min-height: 48px; padding-inline: var(--pas-space-150); }
.pas-button--primary .icon { filter: brightness(0) invert(1); }
.hero { position: relative; isolation: isolate; min-height: min(640px, calc(100svh - 160px)); display: flex; align-items: center; background: var(--pas-color-on-surface); }
.hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.hero::before { content: ''; position: absolute; inset: 0; background: var(--pas-color-image-scrim); z-index: -1; }
.hero__inner { padding-block: var(--pas-space-400); color: var(--pas-color-on-image); text-shadow: 0 1px 3px var(--pas-color-image-scrim); }
.hero h1, .hero .eyebrow { color: inherit; }
.hero .eyebrow { margin-bottom: var(--pas-space-150); }
.hero h1 { font-size: var(--pas-font-hero-size); line-height: var(--pas-font-hero-leading); margin-bottom: var(--pas-space-150); }
.hero__tagline { font-size: var(--pas-font-heading-1-size); line-height: var(--pas-font-heading-1-leading); font-weight: 500; margin-bottom: var(--pas-space-150); }
.hero__copy { max-width: 46ch; font-size: var(--pas-font-body-size); margin-bottom: var(--pas-space-200); }
.hero__status { font-size: var(--pas-font-label-size); margin-top: var(--pas-space-150); margin-bottom: 0; }
.hero :focus-visible { outline-color: var(--pas-color-on-image); outline-offset: 4px; }
.intro__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pas-space-400); max-width: 100%; }
.intro__row p { color: var(--pas-color-on-surface-muted); margin: 0; }
.intro__row .lead { font-size: var(--pas-font-heading-3-size); color: var(--pas-color-on-surface); line-height: 1.5; }
.faceless-note { margin-top: var(--pas-space-200); margin-bottom: 0; max-width: 84ch; color: var(--pas-color-on-surface-muted); }
.faceless-note strong { color: var(--pas-color-on-surface); }
.story-sequence { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--pas-space-300); margin-top: var(--pas-space-400); }
.story-sequence > div { border-top: 1px solid var(--pas-color-outline); padding-top: var(--pas-space-150); min-width: 0; }
.step-number { display: block; font-size: var(--pas-font-label-size); color: var(--pas-color-primary); font-weight: 500; margin-bottom: var(--pas-space-150); }
.story-sequence h3 { font-size: var(--pas-font-heading-3-size); }
.story-sequence p, .workflow p { color: var(--pas-color-on-surface-muted); font-size: var(--pas-font-small-size); margin-bottom: 0; }
.sample-band, .workflow-band, .faq-band { background: var(--pas-color-surface-container); }
.sample { max-width: 960px; margin-inline: auto; }
.sample video { display: block; width: 100%; aspect-ratio: 16/9; background: var(--pas-color-on-surface); }
.sample figcaption { margin-top: var(--pas-space-150); max-width: 85ch; }
.sample figcaption a, .voice-note a, .workflow-note a, .privacy a, details a { text-decoration: underline; }
.use-cases { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pas-space-300) var(--pas-space-400); }
.use-cases article { border-top: 1px solid var(--pas-color-outline); padding-top: var(--pas-space-150); min-width: 0; }
.case-number { color: var(--pas-color-secondary); display: block; font-size: var(--pas-font-label-size); margin-bottom: var(--pas-space-150); }
.use-cases h3 { max-width: 28ch; }
.use-cases p { max-width: 48ch; color: var(--pas-color-on-surface-muted); }
.use-cases .case-output { color: var(--pas-color-on-surface); font-weight: 500; font-size: var(--pas-font-small-size); margin-bottom: 0; }
.workflow { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--pas-space-400) var(--pas-space-300); list-style: none; max-width: 100%; padding: 0; margin: 0; }
.workflow li + li { margin-top: 0; }
.workflow h3 { font-size: var(--pas-font-heading-2-size); }
.workflow-note { font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); margin-top: var(--pas-space-200); margin-bottom: 0; max-width: 100%; }
.workflow-intro { max-width: 62ch; margin-top: var(--pas-space-150); font-size: var(--pas-font-heading-3-size); }
.concept-label { font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); margin-bottom: 0; }
.journey-step { min-width: 0; }
.workflow-visual { height: 348px; padding: var(--pas-space-150); border: 1px solid var(--pas-color-outline); border-radius: var(--pas-radius-surface); background: var(--pas-color-surface); overflow: hidden; }
.visual-topline { display: flex; justify-content: space-between; align-items: baseline; gap: var(--pas-space-100); font-size: var(--pas-font-label-size); margin-bottom: var(--pas-space-150); color: var(--pas-color-on-surface-muted); }
.visual-topline span:first-child { color: var(--pas-color-on-surface); font-weight: 600; }
.source-photos { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--pas-space-50); }
.photo-slice { position: relative; overflow: hidden; min-width: 0; background: var(--pas-color-surface-container); }
.photo-slice img { display: block; width: 300%; max-width: none; height: 100%; object-fit: cover; }
.photo-slice--bay img { transform: translateX(-33.333333%); }
.photo-slice--breakfast img { transform: translateX(-66.666667%); }
.source-photos .photo-slice { height: 154px; }
.source-photos .photo-slice span { position: absolute; inset: auto 0 0; background: var(--pas-color-image-scrim); color: var(--pas-color-on-image); padding: var(--pas-space-25) var(--pas-space-50); font-size: var(--pas-font-label-size); }
.voice-input { display: flex; align-items: center; gap: var(--pas-space-100); margin-top: var(--pas-space-150); }
.voice-input strong { font-size: var(--pas-font-small-size); }
.voice-input p { margin-top: var(--pas-space-25); }
.audio-mark { font-size: 28px; color: var(--pas-color-primary); font-weight: 600; line-height: 1; }
.storyboard-row { display: grid; grid-template-columns: 96px 1fr; gap: var(--pas-space-100); align-items: center; margin-top: var(--pas-space-100); }
.storyboard-row .photo-slice { height: 68px; }
.storyboard-row span { display: block; color: var(--pas-color-primary); font-size: var(--pas-font-label-size); margin-bottom: var(--pas-space-25); }
.storyboard-row p { color: var(--pas-color-on-surface); }
.narration-visual { background: var(--pas-color-primary-container); border-color: var(--pas-color-primary-container); color: var(--pas-color-on-primary-container); }
.narration-visual .visual-topline, .narration-visual .visual-topline span:first-child { color: inherit; }
.workflow .narration-quote { font-size: var(--pas-font-heading-1-size); line-height: 1.2; font-weight: 500; color: inherit; margin-block: var(--pas-space-100); }
.voice-wave { height: 34px; display: flex; align-items: center; gap: 5px; margin-block: var(--pas-space-150); }
.voice-wave i { display: block; width: 4px; height: 10px; background: currentColor; }
.voice-wave i:nth-child(3n) { height: 30px; }
.voice-wave i:nth-child(4n) { height: 20px; }
.voice-wave i:nth-child(5n) { height: 34px; }
.language-version { display: grid; grid-template-columns: 80px 1fr 140px; align-items: center; gap: var(--pas-space-100); min-height: 64px; border-top: 1px solid currentColor; }
.language-version strong, .language-version > span { font-size: var(--pas-font-small-size); }
.language-version > span { text-align: right; }
.language-version .voice-wave { margin: 0; gap: 4px; }
.voice-settings { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--pas-space-100); margin: 0; }
.voice-settings dt { font-size: var(--pas-font-label-size); }
.voice-settings dd { font-size: var(--pas-font-small-size); margin: var(--pas-space-25) 0 0; font-weight: 500; }
.workflow .visual-disclaimer { color: inherit; font-size: var(--pas-font-label-size); margin-top: var(--pas-space-150); }
.export-visual { display: grid; grid-template-columns: 164px 1fr; align-items: center; gap: var(--pas-space-200); }
.reel-frame { width: 164px; aspect-ratio: 9/16; position: relative; overflow: hidden; background: var(--pas-color-surface-container); }
.reel-frame .photo-slice { height: 100%; }
.reel-caption { position: absolute; inset: auto 8px 46px; padding: var(--pas-space-50); background: var(--pas-color-image-scrim); color: var(--pas-color-on-image); text-align: center; font-size: var(--pas-font-heading-3-size); font-weight: 600; line-height: 1.3; }
.reel-marker { position: absolute; inset: auto 0 0; background: var(--pas-color-image-scrim); color: var(--pas-color-on-image); text-align: center; padding: var(--pas-space-25); font-size: 11px; }
.export-description { min-width: 0; }
.export-description .step-number { margin-bottom: var(--pas-space-100); }
.export-description strong { display: block; font-size: var(--pas-font-heading-3-size); margin-bottom: var(--pas-space-100); }
.export-format { display: block; color: var(--pas-color-primary); font-size: var(--pas-font-label-size); margin-top: var(--pas-space-150); }
.workflow .export-control { color: var(--pas-color-on-surface); margin-top: var(--pas-space-150); }
.step-copy { padding-top: var(--pas-space-150); }
.step-copy .step-number { margin-bottom: var(--pas-space-100); }
.workflow .step-copy > p { font-size: var(--pas-font-body-size); max-width: 58ch; }
.workflow .step-copy .step-result { margin-top: var(--pas-space-100); font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface); }
.opportunity-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--pas-space-300); }
.opportunity-grid p { color: var(--pas-color-on-surface-muted); }
.opportunity a { text-decoration: underline; }
.opportunity-grid > div > a { font-size: var(--pas-font-small-size); }
.market-summary { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--pas-space-300); border-top: 1px solid var(--pas-color-outline); padding-top: var(--pas-space-200); margin-top: var(--pas-space-300); }
.market-summary > div > strong { display: block; font-size: var(--pas-font-heading-1-size); line-height: 1.25; }
.market-summary p { font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); margin-block: var(--pas-space-100) 0; }
.market-summary > p { margin-top: 0; }
.proof { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pas-space-400); margin-bottom: var(--pas-space-300); }
.proof h3 { font-size: var(--pas-font-heading-3-size); }
.proof p, .voice-note p { color: var(--pas-color-on-surface-muted); }
.voice-note { border-top: 1px solid var(--pas-color-outline); padding-top: var(--pas-space-300); }
.voice-note h3 { font-size: var(--pas-font-heading-3-size); }
.voice-note p { max-width: 85ch; }
.voice-note p:last-child { font-size: var(--pas-font-small-size); margin-bottom: 0; }
.faq { display: grid; grid-template-columns: 1fr 1.3fr; gap: var(--pas-space-400); }
.faq h2 { max-width: 15ch; }
details { border-top: 1px solid var(--pas-color-outline); padding-block: var(--pas-space-100); }
details:last-child { border-bottom: 1px solid var(--pas-color-outline); }
summary { padding-block: var(--pas-space-50); font-weight: 500; min-height: var(--pas-size-control); }
details p { margin-block: var(--pas-space-100) var(--pas-space-50); font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); }
.interest { display: grid; grid-template-columns: 1fr 1fr; gap: var(--pas-space-400); }
.interest > div > p:not(.eyebrow) { max-width: 43ch; }
#interest-form { display: grid; gap: var(--pas-space-150); align-content: start; }
#enquiry-fields { display: grid; gap: var(--pas-space-150); min-width: 0; margin: 0; padding: 0; border: 0; }
.pas-field { display: grid; gap: var(--pas-space-50); font-size: var(--pas-font-small-size); margin: 0; min-width: 0; }
.form-notice { font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); margin: 0; }
#enquiry-fields > button { justify-self: start; }
#form-result { display: grid; gap: var(--pas-space-100); }
#form-result > p { margin: 0; }
.privacy { padding-block: var(--pas-space-200) var(--pas-space-300); border-top: 1px solid var(--pas-color-outline); }
.privacy h2 { font-size: var(--pas-font-heading-3-size); }
.privacy p { font-size: var(--pas-font-label-size); color: var(--pas-color-on-surface-muted); max-width: 95ch; margin: 0; }
.footer { background: var(--pas-color-surface-container); padding-block: var(--pas-space-300) var(--pas-space-150); }
.footer__top { display: flex; justify-content: space-between; align-items: start; gap: var(--pas-space-300); padding-bottom: var(--pas-space-300); }
.footer__top p { font-size: var(--pas-font-small-size); color: var(--pas-color-on-surface-muted); margin-top: var(--pas-space-100); margin-bottom: 0; }
.footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--pas-space-100); border-top: 1px solid var(--pas-color-outline); padding-top: var(--pas-space-150); color: var(--pas-color-on-surface-muted); font-size: var(--pas-font-label-size); }
.review-strip { background: var(--pas-color-surface-container); border-bottom: 1px solid var(--pas-color-outline); font-size: var(--pas-font-label-size); }
.review-strip__inner { display: flex; align-items: center; flex-wrap: wrap; gap: var(--pas-space-150); min-height: 60px; padding-block: var(--pas-space-50); }
.directions { margin-left: auto; display: flex; gap: var(--pas-space-150); }
.directions a { min-height: var(--pas-size-control); display: inline-flex; align-items: center; color: inherit; }
.directions [aria-current] { text-decoration: underline; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: var(--pas-size-control); height: var(--pas-size-control); flex-shrink: 0; background: transparent; color: inherit; border: 1px solid var(--pas-color-outline); border-radius: var(--pas-radius-control); }
dialog { width: min(480px,calc(100% - 32px)); max-height: calc(100svh - 32px); overflow: auto; background: var(--pas-color-surface); color: var(--pas-color-on-surface); border: 1px solid var(--pas-color-outline); border-radius: var(--pas-radius-surface); padding: var(--pas-space-150); }
dialog::backdrop { background: var(--pas-color-image-scrim); }
.palette-editor h2 { font-size: var(--pas-font-heading-2-size); }
.palette-editor p { font-size: var(--pas-font-small-size); }
.palette-editor .section-heading { margin-bottom: var(--pas-space-150); align-items: center; }
.close-button { font-size: var(--pas-font-heading-2-size); }
#colour-controls { display: grid; gap: var(--pas-space-100); margin-block: var(--pas-space-150); }
#colour-controls label { display: flex; justify-content: space-between; align-items: center; gap: var(--pas-space-100); }
#colour-controls input { width: 64px; height: var(--pas-size-control); padding: 2px; border: 1px solid var(--pas-color-outline); background: var(--pas-color-surface); border-radius: var(--pas-radius-control); }
.palette-actions { display: flex; justify-content: space-between; align-items: center; gap: var(--pas-space-100); }
.palette-output { margin-top: var(--pas-space-150); }
.brief { max-width: 820px; }
.brief h1 { font-size: var(--pas-font-hero-size); }
.brief h2 { font-size: var(--pas-font-heading-1-size); margin-top: var(--pas-space-300); }
.brief .lead { font-size: var(--pas-font-heading-3-size); }
.brief a { text-decoration: underline; }
.brief ul { max-width: 100%; }
.brief dd { margin-left: 0; margin-bottom: var(--pas-space-150); color: var(--pas-color-on-surface-muted); }
.brief dt { font-weight: 600; }
[data-preview-theme="after-hours"] .icon-button img, [data-preview-theme="after-hours"] .text-link img { filter: invert(1); }
[data-preview-theme="after-hours"] .pas-button--primary .icon { filter: none; }
[data-preview-theme="after-hours"] { color-scheme: dark; }
@media (max-width: 1000px) { .wrap { width: calc(100% - 64px); } .brand-header nav { gap: var(--pas-space-150); } .story-sequence { gap: var(--pas-space-150); } .workflow { grid-template-columns: 1fr; max-width: 640px; margin-inline: auto; } }
@media (max-width: 700px) {
  .wrap { width: calc(100% - 40px); }
  .section-space { padding-block: var(--pas-space-300); }
  h2 { font-size: var(--pas-font-heading-1-size); }
  h3 { font-size: var(--pas-font-heading-3-size); }
  .brand-header { min-height: 80px; gap: var(--pas-space-100); }
  .brand-header nav > a:not(.text-link) { display: none; }
  .brand strong { font-size: var(--pas-font-heading-3-size); }
  .brand-header .text-link { font-size: var(--pas-font-label-size); gap: var(--pas-space-25); }
  .hero { min-height: min(610px,calc(100svh - 144px)); }
  .hero__image { object-position: 43% center; }
  .hero__inner { padding-block: var(--pas-space-300); }
  .hero h1, .brief h1 { font-size: var(--pas-font-display-size); }
  .hero__tagline { font-size: var(--pas-font-heading-2-size); }
  .hero__copy { max-width: 34ch; }
  .hero .eyebrow { font-size: 12px; }
  .section-heading { margin-bottom: var(--pas-space-200); }
  .section-heading--row { flex-direction: column; align-items: start; gap: var(--pas-space-150); }
  .intro__row, .story-sequence, .workflow, .use-cases, .proof, .faq, .interest, .opportunity-grid, .market-summary { grid-template-columns: 1fr; gap: var(--pas-space-200); }
  .story-sequence { margin-top: var(--pas-space-200); }
  .proof { margin-bottom: var(--pas-space-200); }
  .footer__top { flex-direction: column; gap: var(--pas-space-200); }
  .footer nav { gap: var(--pas-space-150); }
  .review-strip__inner { gap: var(--pas-space-50); }
  .review-strip__inner > span { flex-basis: 100%; }
  .directions { margin-left: 0; margin-right: auto; gap: var(--pas-space-100); }
  #enquiry-fields > button { width: 100%; }
}
@media (max-width: 420px) {
  .workflow-visual { height: 320px; padding: var(--pas-space-100); }
  .visual-topline { gap: var(--pas-space-50); font-size: 12px; margin-bottom: var(--pas-space-100); }
  .source-photos .photo-slice { height: 132px; }
  .source-photos .photo-slice span { padding-inline: var(--pas-space-25); font-size: 11px; }
  .voice-input { gap: var(--pas-space-50); }
  .voice-input p { font-size: 12px; }
  .voice-input strong { font-size: 13px; }
  .storyboard-row { grid-template-columns: 72px 1fr; gap: var(--pas-space-50); }
  .storyboard-row .photo-slice { height: 60px; }
  .workflow .narration-quote { font-size: var(--pas-font-heading-2-size); }
  .voice-settings { gap: var(--pas-space-50); }
  .voice-settings dd { font-size: 12px; }
  .voice-settings dt { font-size: 11px; }
  .export-visual { grid-template-columns: 116px 1fr; gap: var(--pas-space-100); height: 380px; }
  .reel-frame { width: 116px; }
  .reel-caption { font-size: 15px; inset-inline: 4px; bottom: 34px; }
  .reel-marker { font-size: 10px; }
  .export-description strong { font-size: 16px; }
  .export-description .step-number, .export-format { font-size: 11px; }
  .workflow .export-description p { font-size: 12px; }
  .language-version { grid-template-columns: 62px 1fr 96px; gap: var(--pas-space-50); }
  .language-version strong, .language-version > span { font-size: 12px; }
  .language-version .voice-wave { gap: 2px; }
  .language-version .voice-wave i { width: 2px; }
}
@media (max-height: 650px) and (max-width: 700px) {
  .hero__inner { padding-block: var(--pas-space-200); }
  .hero .eyebrow { margin-bottom: var(--pas-space-100); }
  .hero h1 { font-size: var(--pas-font-heading-1-size); margin-bottom: var(--pas-space-100); }
  .hero__tagline { font-size: var(--pas-font-heading-3-size); margin-bottom: var(--pas-space-100); }
  .hero__copy { font-size: var(--pas-font-small-size); margin-bottom: var(--pas-space-150); }
  .hero__status { margin-top: var(--pas-space-100); font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.story-carousel { margin-block-start: var(--pas-space-300); }
.story-nav, .story-audio { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pas-space-75); }
.story-nav span { min-inline-size: 4ch; text-align: center; font-variant-numeric: tabular-nums; }
.story-nav button:disabled { opacity: .45; cursor: default; }
.story-slide { margin: 0 0 var(--pas-space-150); }
.story-image { aspect-ratio: 2 / 1; overflow: hidden; }
.story-image img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; object-position: center top; }
.story-image--middle img { object-position: center; }
.story-image--last img { object-position: center bottom; }
.story-slide figcaption { padding-block: var(--pas-space-100); }
.story-slide blockquote { margin-inline: 0; font-weight: 600; }