:root {
  --fh-ink: #171717;
  --fh-charcoal: #202020;
  --fh-paper: #f4f2ee;
  --fh-warm: #ebe7df;
  --fh-muted: #77736d;
  --fh-line: #cfcac1;
  --fh-gold: #c6a566;
  --fh-red: #b9352d;
  --fh-max: 1440px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--fh-paper); overflow-x: clip; }
body { margin: 0; color: var(--fh-ink); background: var(--fh-paper); font-family: var(--fh-body); font-size: 16px; line-height: 1.55; overflow-x: hidden; }
body.nav-open { overflow: hidden; }
img { display: block; width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .7rem 1rem; color: var(--fh-paper); background: var(--fh-ink); }
.skip-link:focus { top: 1rem; }
.wrap { width: min(calc(100% - 3rem), var(--fh-max)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.eyebrow, .kicker, .micro { margin: 0; font-size: .67rem; font-weight: 800; letter-spacing: .17em; line-height: 1.25; text-transform: uppercase; }
.kicker { color: var(--fh-gold); }
.lead { max-width: 48rem; font-size: clamp(1.05rem, 1.5vw, 1.25rem); }
.center { text-align: center; }
.section { padding: clamp(4.8rem, 9vw, 9rem) 0; }
.section--dark { color: var(--fh-paper); background: var(--fh-ink); }

/* One-shot loading curtain: it is removed once, never loops. */
.loader { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; color: var(--fh-paper); background: var(--fh-ink); transition: opacity .5s ease, visibility .5s ease; }
.loader__inner { display: grid; gap: .8rem; justify-items: center; text-align: center; }
.loader__mark { width: 5rem; height: 5rem; }
.loader__word { font-family: var(--fh-display); font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; }
.loader__line { width: 10rem; height: 1px; overflow: hidden; background: rgba(244,242,238,.22); }
.loader__line::after { display: block; width: 40%; height: 100%; content: ""; background: var(--fh-gold); transform: translateX(-100%); animation: fh-load 1.1s ease forwards; }
body.is-ready .loader, html.is-ready .loader { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes fh-load { to { transform: translateX(250%); } }

/* Raven-style compact header: the nav lives in an intentional full-width drawer. */
.site-header { position: sticky; top: 0; z-index: 50; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 4.5rem; padding: 0 1.5rem; color: var(--fh-ink); background: rgba(244,242,238,.97); border-bottom: 1px solid var(--fh-line); transition: color .25s ease, background .25s ease, border-color .25s ease; }
.site-header.scrolled { color: var(--fh-paper); background: rgba(23,23,23,.97); border-color: rgba(244,242,238,.2); }
.header-side { display: flex; align-items: center; gap: 1rem; }
.header-side--right { justify-content: flex-end; }
.header-socials { display: flex; gap: .8rem; }
.header-socials a { display: grid; place-items: center; width: 1.35rem; height: 1.35rem; font-size: .7rem; font-weight: 800; }
.social-glyph { display: block; width: .9rem; height: .9rem; }
.brand { display: inline-flex; align-items: center; gap: .5rem; font-family: var(--fh-display); font-size: .82rem; letter-spacing: .06em; line-height: .85; text-transform: uppercase; }
.brand span { display: grid; gap: .12rem; }
.brand small { font-family: var(--fh-body); font-size: .43rem; font-weight: 700; letter-spacing: .2em; }
.mark { flex: none; width: 2.55rem; height: 2.55rem; }
.logo-image { display: block; object-fit: contain; }
.header-book, .button { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-height: 2.75rem; padding: .75rem 1.2rem; border: 1px solid var(--fh-ink); color: var(--fh-paper); background: var(--fh-ink); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; transition: background .2s ease, color .2s ease, transform .2s ease, border-color .2s ease; }
.scrolled .header-book { color: var(--fh-ink); background: var(--fh-paper); border-color: var(--fh-paper); }
.header-book:hover, .button:hover { color: var(--fh-ink); background: var(--fh-gold); border-color: var(--fh-gold); transform: translateY(-2px); }
.nav-toggle { display: grid; place-items: center; width: 2.7rem; height: 2.7rem; padding: 0; color: currentColor; background: transparent; border: 1px solid currentColor; }
.nav-toggle span, .nav-toggle::before, .nav-toggle::after { display: block; width: 1rem; height: 1px; content: ""; background: currentColor; transition: transform .25s ease, opacity .25s ease; }
.nav-toggle span { margin: .27rem 0; }
.nav-toggle.open span { opacity: 0; }
.nav-toggle.open::before { transform: translateY(5px) rotate(45deg); }
.nav-toggle.open::after { transform: translateY(-5px) rotate(-45deg); }
.nav-panel { position: absolute; top: 100%; left: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); width: 100%; padding: 0 2rem; color: var(--fh-paper); background: var(--fh-ink); border-top: 1px solid rgba(244,242,238,.18); opacity: 0; visibility: hidden; transform: translateY(-.6rem); transition: opacity .25s ease, visibility .25s ease, transform .25s ease; }
.nav-panel.open { padding-top: 1.35rem; padding-bottom: 1.35rem; opacity: 1; visibility: visible; transform: translateY(0); }
.nav-panel a { padding: .8rem .5rem; font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-align: center; text-transform: uppercase; border-bottom: 1px solid rgba(244,242,238,.22); }
.nav-panel a:hover, .nav-panel a[aria-current="page"] { color: var(--fh-gold); }

/* Primary reference geometry: a paper copy block beside a tall image. */
.raven-hero { display: grid; grid-template-columns: minmax(19rem, 40%) 1fr; min-height: min(700px, calc(100vh - 4.5rem)); overflow-x: hidden; background: var(--fh-paper); }
.hero-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 6vw, 7rem) clamp(1.5rem, 5vw, 6rem); overflow: hidden; }
.hero-copy::before { position: absolute; right: 4%; top: 7%; width: 7rem; height: 7rem; content: ""; border: 1px solid var(--fh-line); border-radius: 50%; opacity: .7; }
.hero-copy::after { position: absolute; right: 9%; top: 12%; width: 4.5rem; height: 4.5rem; content: ""; border: 1px solid var(--fh-gold); border-radius: 50%; opacity: .8; }
.hero-copy > * { position: relative; z-index: 1; }
.hero-copy h1 { max-width: 8ch; margin: 1.2rem 0 1.5rem; font-family: var(--fh-display); font-size: clamp(4rem, 8vw, 8.6rem); font-weight: 900; letter-spacing: -.1em; line-height: .77; text-transform: uppercase; }
.hero-copy h1 span { display: block; }
.hero-copy h1 em { color: var(--fh-gold); font-style: normal; }
.hero-copy p:not(.eyebrow) { max-width: 25rem; margin: 0; color: var(--fh-muted); }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2.1rem; }
.button--outline { color: var(--fh-ink); background: transparent; }
.button--outline:hover { color: var(--fh-ink); background: var(--fh-gold); }
.hero-media { position: relative; min-height: 30rem; overflow: hidden; background: #2c2a27; }
.hero-media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(23,23,23,.18), transparent 34%), linear-gradient(0deg, rgba(23,23,23,.22), transparent 45%); pointer-events: none; }
.hero-media img { height: 100%; object-fit: cover; transform: scale(1.08) translateY(var(--fh-parallax, 0px)); transition: transform .2s linear; }
.hero-label { position: absolute; right: 1.5rem; bottom: 1.5rem; z-index: 1; display: grid; gap: .3rem; color: var(--fh-paper); font-size: .62rem; font-weight: 800; letter-spacing: .16em; text-align: right; text-transform: uppercase; }
.hero-label::before { display: block; width: 3.5rem; height: 1px; margin-left: auto; content: ""; background: var(--fh-gold); }
.hero-film-toggle { position:absolute; left:1.5rem; bottom:1.5rem; z-index:2; display:inline-flex; align-items:center; gap:.55rem; min-height:2.7rem; padding:.6rem .8rem; border:1px solid rgba(244,242,238,.72); background:rgba(23,23,23,.62); color:var(--fh-paper); font-size:.61rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; backdrop-filter:blur(8px); cursor:pointer; }
.hero-film-toggle:hover, .hero-media.is-film-playing .hero-film-toggle { background:var(--fh-gold); border-color:var(--fh-gold); color:var(--fh-ink); }
.hero-film-toggle > span:first-child { display:grid; place-items:center; width:1.2rem; height:1.2rem; border:1px solid currentColor; border-radius:50%; font-size:.48rem; }
.hero-media::before { position:absolute; inset:0; z-index:1; content:""; pointer-events:none; background:linear-gradient(112deg,transparent 22%,rgba(255,255,255,.18) 42%,transparent 60%); opacity:0; transform:translateX(-120%); }
.hero-media.is-film-playing::before { opacity:1; animation:fh-film-sheen 2.8s ease-in-out infinite; }
.hero-media.is-film-playing img { animation:fh-film-drift 7s ease-in-out infinite alternate; filter:saturate(1.08) contrast(1.06); }
@keyframes fh-film-sheen { 0%,18% { transform:translateX(-120%); } 58%,100% { transform:translateX(120%); } }
@keyframes fh-film-drift { from { transform:scale(1.08) translate3d(-1.4%,1%,0); } to { transform:scale(1.15) translate3d(1.5%,-1%,0); } }

.band { color: var(--fh-paper); background: var(--fh-ink); }
.band-intro { max-width: 38rem; margin: 0 auto; text-align: center; }
.band-intro h2, .section-heading h2 { margin: .9rem 0 1rem; font-family: var(--fh-display); font-size: clamp(2.5rem, 5vw, 5.3rem); letter-spacing: -.08em; line-height: .88; text-transform: uppercase; }
.band-intro h2 em, .section-heading h2 em { color: var(--fh-gold); font-style: normal; }
.band-intro p { max-width: 34rem; margin: 0 auto; color: rgba(244,242,238,.7); }
.crew-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .85rem; max-width: 74rem; margin: 3.2rem auto 0; }
.crew-card { min-width: 0; color: var(--fh-paper); }
.crew-card__media { position: relative; aspect-ratio: .83; overflow: hidden; background: #303030; }
.crew-card__media::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(23,23,23,.65), transparent 48%); }
.crew-card img { height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: transform .45s cubic-bezier(.2,.8,.2,1), filter .45s ease; }
.crew-card:hover img { filter: grayscale(.2) contrast(1.05); transform: scale(1.06); }
.crew-card__body { padding-top: .8rem; }
.crew-card__body small { display: block; color: var(--fh-gold); font-size: .58rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.crew-card__body h3 { margin: .25rem 0 0; font-size: .85rem; line-height: 1; }
.crew-card__body a { display: inline-flex; gap: .4rem; margin-top: .55rem; padding-bottom: .25rem; color: var(--fh-paper); border-bottom: 1px solid var(--fh-gold); font-size: .65rem; font-weight: 800; }
.crew-card__body a:hover { color: var(--fh-gold); }

.filter-shell { margin-top: 4.8rem; padding-top: 1.8rem; border-top: 1px solid rgba(244,242,238,.24); }
.filter-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.1rem; }
.filter-head h3 { margin: 0; font-family: var(--fh-display); font-size: clamp(1.7rem, 3vw, 3rem); letter-spacing: -.06em; line-height: .9; text-transform: uppercase; }
.filter-count { color: var(--fh-gold); font-size: .68rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.filter-controls { display: flex; gap: .55rem; max-width: 100%; overflow-x: auto; padding-bottom: .8rem; }
.filter-pill { flex: none; padding: .7rem 1rem; color: var(--fh-paper); background: transparent; border: 1px solid rgba(244,242,238,.3); font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; transition: color .2s ease, background .2s ease, border-color .2s ease; }
.filter-pill[aria-pressed="true"], .filter-pill:hover { color: var(--fh-ink); background: var(--fh-gold); border-color: var(--fh-gold); }
.service-list { border-top: 1px solid rgba(244,242,238,.24); }
.service-row { display: grid; grid-template-columns: 1.1fr .7fr 1.4fr auto; gap: 1rem; align-items: center; padding: 1.2rem 0; border-bottom: 1px solid rgba(244,242,238,.17); transition: background .2s ease, padding .2s ease; }
.service-row:hover { padding-inline: .65rem; background: rgba(244,242,238,.05); }
.service-row[hidden] { display: none !important; }
.service-row strong { font-size: .95rem; }
.service-row__tag { color: var(--fh-gold); font-size: .62rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.service-row p { margin: 0; color: rgba(244,242,238,.66); font-size: .8rem; }
.service-row__price { white-space: nowrap; font-family: var(--fh-display); font-size: 1.2rem; }
.service-empty { padding: 1rem 0; color: rgba(244,242,238,.7); }

.split-section { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(20rem, .92fr); min-height: 34rem; overflow-x: hidden; background: var(--fh-paper); }
.split-section > *, .work-section > *, .gift-section > *, .booking-layout > *, .inner-grid > *, .footer-grid > * { min-width: 0; }
.split-section__media { min-height: 30rem; overflow: hidden; background: #d9d0c4; }
.split-section__media img { height: 100%; object-fit: cover; transform: scale(1.08) translateY(var(--fh-parallax, 0px)); transition: transform .2s linear; }
.split-section__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 7vw, 8rem); }
.split-section .section-heading h2 { font-size: clamp(2.7rem, 3.8vw, 4.2rem); }
.section-heading h2 { color: var(--fh-ink); }
.split-section__copy p { max-width: 36rem; color: #5f5a54; }
.split-section__copy strong { color: var(--fh-ink); }
.text-link { display: inline-flex; align-items: center; gap: .65rem; width: max-content; margin-top: 1rem; padding-bottom: .35rem; border-bottom: 1px solid var(--fh-ink); font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.text-link:hover { color: var(--fh-red); border-color: var(--fh-red); }

.gift-section { display: grid; grid-template-columns: 1fr minmax(20rem, 2fr) 1fr; min-height: 20rem; overflow-x: hidden; background: var(--fh-paper); }
.gift-section__side { background: var(--fh-ink); }
.gift-section__card { display: grid; place-content: center; justify-items: center; padding: 3rem; text-align: center; }
.gift-section__card h2 { margin: 0; font-family: var(--fh-display); font-size: clamp(2.8rem, 5.5vw, 5.7rem); letter-spacing: -.09em; line-height: .8; text-transform: uppercase; }
.gift-section__card p { max-width: 22rem; margin: 1rem 0 1.4rem; color: var(--fh-muted); font-size: .9rem; }

.work-section { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(20rem, .95fr); overflow-x: hidden; color: var(--fh-paper); background: var(--fh-ink); }
.work-section__media { min-height: 30rem; overflow: hidden; border-right: 1px solid var(--fh-gold); }
.work-section__media img { height: 100%; object-fit: cover; filter: saturate(.8) contrast(1.08); transform: scale(1.06) translateY(var(--fh-parallax, 0px)); transition: transform .2s linear, filter .45s ease; }
.work-section:hover .work-section__media img { filter: saturate(1.05) contrast(1.08); }
.work-section__copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(3rem, 7vw, 8rem); }
.work-section__copy h2 { max-width: 7ch; margin: .9rem 0 1rem; font-family: var(--fh-display); font-size: clamp(3.6rem, 7vw, 7.7rem); letter-spacing: -.1em; line-height: .75; text-transform: uppercase; }
.work-section__copy h2 em { color: var(--fh-gold); font-style: normal; }
.work-section__copy p { max-width: 26rem; color: rgba(244,242,238,.7); }
.button--paper { color: var(--fh-ink); background: var(--fh-paper); border-color: var(--fh-paper); }
.button--paper:hover { color: var(--fh-paper); background: transparent; border-color: var(--fh-paper); }

.visit-section { padding: clamp(4rem, 7vw, 7rem) 0; background: var(--fh-warm); }
.visit-grid { display: grid; grid-template-columns: 1.1fr .9fr .9fr; gap: 2rem; }
.visit-grid h2 { max-width: 8ch; margin: .8rem 0 0; font-family: var(--fh-display); font-size: clamp(2.8rem, 5.2vw, 5.8rem); letter-spacing: -.09em; line-height: .8; text-transform: uppercase; }
.visit-grid h2 em { color: var(--fh-red); font-style: normal; }
.visit-col { padding-top: 1rem; border-top: 1px solid var(--fh-ink); }
.visit-col h3 { margin: 0 0 .8rem; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }
.visit-col p, .visit-col a { display: block; margin: .25rem 0; color: #635e57; font-size: .88rem; }
.visit-col a:hover { color: var(--fh-red); }

/* Inner pages */
.page-hero { padding: clamp(4rem, 8vw, 8rem) 0; color: var(--fh-paper); background: var(--fh-ink); }
.page-hero__grid { display: grid; grid-template-columns: 1fr .8fr; gap: 2rem; align-items: end; }
.page-hero h1 { max-width: 8ch; margin: .9rem 0 0; font-family: var(--fh-display); font-size: clamp(4rem, 8vw, 8rem); letter-spacing: -.1em; line-height: .78; text-transform: uppercase; }
.page-hero h1 em { color: var(--fh-gold); font-style: normal; }
.page-hero p { max-width: 33rem; margin: 0; color: rgba(244,242,238,.7); }
.inner-content { padding: clamp(4rem, 8vw, 8rem) 0; }
.inner-content--dark { color: var(--fh-paper); background: var(--fh-ink); }
.inner-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 6vw, 7rem); align-items: start; }
.inner-grid h2 { margin: .8rem 0 1.2rem; font-family: var(--fh-display); font-size: clamp(2.5rem, 5vw, 5rem); letter-spacing: -.08em; line-height: .86; text-transform: uppercase; }
.inner-grid h2 em { color: var(--fh-gold); font-style: normal; }
.inner-grid p { max-width: 40rem; color: #635e57; }
.inner-content--dark .inner-grid p { color: rgba(244,242,238,.7); }
.portrait-grid, .work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.portrait-card { min-width: 0; color: var(--fh-paper); background: var(--fh-charcoal); }
.portrait-card__body { min-width: 0; overflow-wrap: anywhere; }
.portrait-card__media { aspect-ratio: .88; overflow: hidden; }
.portrait-card img { height: 100%; object-fit: cover; filter: grayscale(1); transition: transform .45s ease, filter .45s ease; }
.portrait-card:hover img { filter: grayscale(.15); transform: scale(1.05); }
.portrait-card__body { padding: 1rem; }
.portrait-card__body h3 { margin: .35rem 0; font-size: 1.2rem; }
.portrait-card__body p { margin: 0; color: rgba(244,242,238,.6); font-size: .78rem; }
.work-grid { grid-template-columns: repeat(12, 1fr); grid-auto-rows: 13rem; }
.work-grid figure { position: relative; min-width: 0; margin: 0; overflow: hidden; background: #2b2927; }
.work-grid figure:nth-child(1), .work-grid figure:nth-child(4) { grid-column: span 5; grid-row: span 2; }
.work-grid figure:nth-child(2), .work-grid figure:nth-child(3), .work-grid figure:nth-child(5), .work-grid figure:nth-child(6) { grid-column: span 3; }
.work-grid img { height: 100%; object-fit: cover; transition: transform .55s ease, filter .55s ease; }
.work-grid figure:hover img { filter: saturate(1.1); transform: scale(1.06); }
.booking-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(20rem, .9fr); gap: clamp(2rem, 6vw, 7rem); align-items: start; }
.booking-form { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; padding: clamp(1.5rem, 3vw, 3rem); background: var(--fh-warm); border-top: 4px solid var(--fh-red); }
.field { display: grid; gap: .4rem; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: .68rem; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.field input, .field select, .field textarea { width: 100%; padding: .85rem .8rem; color: var(--fh-ink); background: var(--fh-paper); border: 1px solid var(--fh-line); border-radius: 0; outline: none; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--fh-red); box-shadow: 0 0 0 2px rgba(185,53,45,.14); }
.booking-preview { display: grid; gap: .45rem; margin-top: 1rem; padding: 1.2rem; color: var(--fh-paper); background: var(--fh-ink); border-left: 4px solid var(--fh-gold); }
.booking-preview[hidden] { display: none; }
.booking-preview strong { font-size: 1.1rem; }
.booking-preview span:not(.preview-kicker) { color: rgba(244,242,238,.75); font-size: .82rem; }
.booking-preview small { color: var(--fh-gold); font-size: .72rem; }
.preview-kicker { color: var(--fh-gold); font-size: .63rem; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.notice { margin-top: 1rem; padding: 1rem; color: var(--fh-ink); background: #e8d6bf; border-left: 4px solid var(--fh-gold); font-size: .85rem; }
.faq-list { border-top: 1px solid var(--fh-line); }
.faq-list details { padding: 1.2rem 0; border-bottom: 1px solid var(--fh-line); }
.faq-list summary { cursor: pointer; list-style: none; font-family: var(--fh-display); font-size: 1.25rem; letter-spacing: -.03em; text-transform: uppercase; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { float: right; content: "+"; font-family: var(--fh-body); font-size: 1.2rem; }
.faq-list details[open] summary::after { content: "–"; }
.faq-list details p { max-width: 50rem; margin: .8rem 0 0; color: #635e57; }

/* Deep fictional footer with no fabricated proof marks. */
.site-footer { padding: clamp(3rem, 6vw, 6rem) 0 1.3rem; color: var(--fh-paper); background: var(--fh-ink); }
.footer-grid { display: grid; grid-template-columns: 1.45fr repeat(3, .7fr); gap: 2rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(244,242,238,.22); }
.footer-brand p { max-width: 22rem; margin: 1.2rem 0; color: rgba(244,242,238,.63); font-size: .85rem; }
.footer-col { display: grid; align-content: start; gap: .55rem; }
.footer-col h3 { margin: 0 0 .35rem; color: var(--fh-gold); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; }
.footer-col a, .footer-col p { margin: 0; color: rgba(244,242,238,.7); font-size: .78rem; }
.footer-col a:hover { color: var(--fh-paper); }
.footer-hours { display: grid; gap: .25rem; margin-top: .9rem; }
.footer-hours span { display: flex; justify-content: space-between; gap: 1rem; color: rgba(244,242,238,.65); font-size: .7rem; }
.footer-hours b { color: var(--fh-paper); font-weight: 700; }
.footer-socials { display: flex; gap: .5rem; margin-top: 1.5rem; }
.footer-socials a { display: grid; place-items: center; width: 2rem; height: 2rem; border: 1px solid rgba(244,242,238,.35); font-size: .72rem; }
.footer-socials .social-glyph { width: 1rem; height: 1rem; }
.footer-socials a:hover { color: var(--fh-ink); background: var(--fh-gold); border-color: var(--fh-gold); }
.footer-truth { margin: 1.25rem 0; color: rgba(244,242,238,.62); font-size: .72rem; }
.footer-truth strong { color: var(--fh-paper); }
.payment-row { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1rem; }
.payment-row span { padding: .28rem .42rem; color: var(--fh-paper); border: 1px solid rgba(244,242,238,.3); font-size: .55rem; font-weight: 800; letter-spacing: .08em; }
.footer-bottom { display: flex; justify-content: space-between; gap: 1rem; padding-top: 1rem; color: rgba(244,242,238,.52); font-size: .65rem; }
.footer-bottom__links { display: flex; flex-wrap: wrap; gap: 1rem; }
.footer-bottom a:hover { color: var(--fh-gold); }

@keyframes fh-blade-reveal { from { opacity: 0; clip-path: inset(0 0 16% 0); transform: translateY(18px) rotate(-.6deg); } to { opacity: 1; clip-path: inset(0); transform: none; } }
html.js [data-reveal] { opacity: 0; clip-path: inset(0 0 16% 0); transform: translateY(18px) rotate(-.6deg); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.8,.2,1), clip-path .75s ease; }
html.js [data-reveal].in { opacity: 1; clip-path: inset(0); transform: translateY(0); animation: fh-blade-reveal .75s cubic-bezier(.2,.8,.2,1) both; }
html.js [data-reveal][data-delay="1"] { transition-delay: .08s; }
html.js [data-reveal][data-delay="2"] { transition-delay: .16s; }
html.js [data-reveal][data-delay="3"] { transition-delay: .24s; }

@media (max-width: 980px) {
  .crew-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .service-row { grid-template-columns: 1fr .55fr auto; }
  .service-row p { grid-column: 1 / -1; grid-row: 2; }
  .footer-grid { grid-template-columns: 1.3fr repeat(2, .8fr); }
  .footer-brand { grid-row: span 2; }
}

/* The editorial split needs a single readable column before the phone breakpoint.
   Its desktop copy has a 20rem minimum plus generous padding, which overflows at tablet
   widths even though the phone layout is already safe. */
@media (max-width: 860px) {
  .split-section { grid-template-columns: 1fr; }
  .split-section__media { min-height: 24rem; }
  .split-section__media img { transform: none; }
  .split-section__copy { padding: 3.4rem 2rem; }
}

@media (max-width: 720px) {
  .wrap { width: min(calc(100% - 2rem), var(--fh-max)); }
  .site-header { grid-template-columns: 1fr auto; min-height: 4rem; padding: 0 .8rem; }
  .header-socials, .header-book { display: none; }
  .header-side--right { grid-column: 2; }
  .nav-panel { grid-template-columns: 1fr 1fr; padding-inline: 1rem; }
  .nav-panel a { text-align: left; }
  .raven-hero { display: flex; flex-direction: column-reverse; min-height: auto; }
  .hero-media { min-height: 53vw; max-height: 24rem; }
  .hero-copy { min-height: 27rem; padding: 3.4rem 1.25rem 3rem; }
  .hero-copy h1 { max-width: 7ch; margin-top: 1rem; font-size: clamp(4rem, 17vw, 6.5rem); }
  .hero-copy::before { right: 1rem; top: 2rem; width: 5rem; height: 5rem; }
  .hero-copy::after { right: 1.8rem; top: 2.8rem; width: 3.4rem; height: 3.4rem; }
  .hero-label { right: .8rem; bottom: .8rem; }
  .hero-film-toggle { left:.8rem; bottom:.8rem; max-width:calc(100% - 8rem); font-size:.55rem; }
  .crew-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem .65rem; }
  .band-intro h2, .section-heading h2 { font-size: clamp(2.45rem, 12vw, 4.5rem); }
  .filter-head { align-items: start; flex-direction: column; }
  .service-row { grid-template-columns: 1fr auto; gap: .45rem .75rem; padding: 1rem 0; }
  .service-row__tag { grid-column: 1; grid-row: 2; }
  .service-row p { grid-column: 1 / -1; grid-row: 3; }
  .service-row__price { grid-column: 2; grid-row: 1 / span 2; }
  .split-section, .work-section, .booking-layout, .inner-grid { grid-template-columns: 1fr; }
  .split-section__media, .work-section__media { min-height: 22rem; }
  .split-section__media img, .work-section__media img { transform: none; }
  .split-section__copy, .work-section__copy { padding: 3.4rem 1.25rem; }
  .gift-section { grid-template-columns: 1fr; }
  .gift-section__side { display: none; }
  .gift-section__card { min-height: 18rem; padding: 2rem 1rem; }
  .visit-grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
  .visit-grid > :first-child { grid-column: 1 / -1; }
  .visit-grid h2 { max-width: none; font-size: clamp(3.2rem, 15vw, 5.5rem); }
  .page-hero__grid { grid-template-columns: 1fr; }
  .page-hero h1 { font-size: clamp(4rem, 17vw, 6.8rem); }
  .portrait-grid { grid-template-columns: repeat(2, 1fr); }
  .work-grid { grid-auto-rows: 8rem; }
  .work-grid figure:nth-child(n) { grid-column: span 6; grid-row: span 1; }
  .work-grid figure:nth-child(1), .work-grid figure:nth-child(4) { grid-row: span 2; }
  .booking-form { grid-template-columns: 1fr; }
  .field--full { grid-column: auto; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); gap: 2.2rem 1rem; }
  .footer-brand { grid-column: 1 / -1; grid-row: auto; }
  .footer-bottom { align-items: start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  html.js [data-reveal] { opacity: 1; clip-path: none; transform: none; animation: none; }
  .hero-media img, .split-section__media img, .work-section__media img { transform: scale(1.04); }
}

/* S301 Humble-style showreel opening: keep Fade House's authored identity, but let the
   photographic signature occupy the first viewport with a central playback affordance and
   a quiet bottom route rail, as in the reference capture. */
@media (min-width: 761px) {
  .raven-hero { position:relative; display:block; min-height:calc(100vh - 4.5rem); overflow:hidden; background:var(--fh-ink); }
  .raven-hero .hero-media { position:absolute; inset:0; min-height:0; }
  .raven-hero .hero-media img { height:100%; }
  .raven-hero .hero-media::after { background:linear-gradient(90deg,rgba(23,23,23,.62),rgba(23,23,23,.1) 56%,rgba(23,23,23,.3)),linear-gradient(0deg,rgba(23,23,23,.68),transparent 55%); }
  .raven-hero .hero-copy { position:absolute; left:0; bottom:4.6rem; z-index:3; width:min(47rem,58vw); padding:2rem 3.8rem 2.2rem; color:var(--fh-paper); }
  .raven-hero .hero-copy::before, .raven-hero .hero-copy::after { display:none; }
  .raven-hero .hero-copy h1 { max-width:9ch; margin:.85rem 0 1.2rem; font-size:clamp(4.2rem,7vw,7.6rem); }
  .raven-hero .hero-copy p:not(.eyebrow) { max-width:31rem; color:rgba(244,242,238,.82); }
  .raven-hero .hero-copy .hero-actions { margin-top:1.35rem; }
  .raven-hero .hero-media .hero-label { right:3.8rem; bottom:5.1rem; }
  .raven-hero .hero-film-toggle { left:50%; top:50%; bottom:auto; transform:translate(-50%,-50%); width:4rem; height:4rem; min-height:0; padding:0; justify-content:center; border-radius:50%; background:rgba(23,23,23,.52); font-size:0; }
  .raven-hero .hero-film-toggle > span:first-child { width:1.4rem; height:1.4rem; border:0; font-size:.9rem; }
}
.fade-showreel-nav { position:absolute; left:0; right:0; bottom:0; z-index:4; display:flex; align-items:center; justify-content:center; gap:clamp(1rem,4vw,3.6rem); min-height:4.2rem; padding:.65rem 1.5rem; color:#fff; background:rgba(23,23,23,.94); border-top:1px solid rgba(244,242,238,.14); font-size:.72rem; font-weight:800; }
.fade-showreel-nav a { white-space:nowrap; }
.fade-showreel-nav a:hover, .fade-showreel-nav a[aria-current="page"] { color:var(--fh-gold); }
.fade-showreel-nav span { margin-left:auto; color:var(--fh-gold); font-size:1.35rem; }
@media (max-width:760px) {
  .fade-showreel-nav { position:relative; flex-wrap:wrap; align-content:center; gap:.35rem .7rem; justify-content:center; overflow:visible; min-height:4.25rem; padding:.65rem .75rem; font-size:.52rem; }
  .fade-showreel-nav span { display:none; }
  .raven-hero .hero-media { position:relative; }
  .raven-hero .hero-film-toggle { bottom:.8rem; }
}

/* S301 cinematic closeout — give the Humble-style opening a real local motion layer while
   retaining the authored storefront still, poster fallback and CSS sheen as progressive paths. */
.raven-hero .hero-media { isolation:isolate; }
.raven-hero .hero-media .hero-video { position:absolute; inset:0; z-index:1; display:block; width:100%; height:100%; object-fit:cover; opacity:.94; pointer-events:none; }
.raven-hero .hero-media img { position:relative; z-index:0; }
.raven-hero .hero-media .hero-label, .raven-hero .hero-media .hero-film-toggle { z-index:3; }
.raven-hero .hero-media.is-film-playing img { opacity:0; }
@media (prefers-reduced-motion: reduce) {
  .raven-hero .hero-media .hero-video { display:none; }
  .raven-hero .hero-media.is-film-playing img { opacity:1; animation:none; transform:scale(1.04); }
}

/* S301 player-parity closeout — expose the small film timeline/player chrome
   that makes the reference's hero read as an active showreel, not a static image. */
.raven-hero .hero-film-chrome { position:absolute; top:1.4rem; right:1.5rem; left:1.5rem; z-index:3; display:flex; align-items:center; gap:.8rem; color:rgba(244,242,238,.82); font:800 .53rem/1 var(--fh-sans); letter-spacing:.15em; text-transform:uppercase; opacity:.88; }
.raven-hero .hero-film-chrome i { flex:1; height:1px; background:linear-gradient(90deg,var(--fh-gold),rgba(244,242,238,.3)); transform-origin:left; animation:fh-film-progress 16s linear infinite; }
@keyframes fh-film-progress { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media (min-width:761px) {
  .raven-hero .hero-film-chrome { right:3.8rem; left:3.8rem; }
  .raven-hero .hero-actions .button--outline { color:var(--fh-paper); background:rgba(23,23,23,.54); border-color:rgba(244,242,238,.72); }
  .raven-hero .hero-actions .button--outline:hover { color:var(--fh-ink); background:var(--fh-gold); border-color:var(--fh-gold); }
}
@media (prefers-reduced-motion: reduce) { .raven-hero .hero-film-chrome i { animation:none; transform:none; } }

/* Accessibility palette hooks — explicit token mappings for the Fade House palette. */
html[data-a11y-contrast="high"] {
  --fh-ink: #000; --fh-charcoal: #000; --fh-paper: #fff; --fh-warm: #fff;
  --fh-muted: #333; --fh-line: #000; --fh-gold: #000; --fh-red: #000;
}
html[data-a11y-colour="safe"] {
  --fh-ink: #23282a; --fh-charcoal: #3a4245; --fh-paper: #fff;
  --fh-warm: #e8f1f7; --fh-muted: #4b4b4b; --fh-line: #23282a;
  --fh-gold: #e69f00; --fh-red: #0072b2;
}

/* Transferred from the retired platform journey as a local, truthful assistant preview. */
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.local-assistant { position: fixed; right: clamp(.8rem, 2vw, 1.5rem); bottom: clamp(.8rem, 2vw, 1.5rem); z-index: 45; color: var(--fh-paper); font-family: var(--fh-sans, inherit); }
.local-assistant__toggle { display: inline-flex; align-items: center; gap: .48rem; min-height: 2.8rem; padding: .72rem 1rem; border: 1px solid var(--fh-gold); background: var(--fh-ink); color: var(--fh-paper); box-shadow: 0 12px 28px rgba(0,0,0,.22); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.local-assistant__toggle span { color: var(--fh-gold); font-size: 1rem; }
.local-assistant__toggle:hover { background: var(--fh-gold); color: var(--fh-ink); }
.local-assistant__toggle:hover span { color: var(--fh-ink); }
.local-assistant__panel { width: min(24rem, calc(100vw - 1.6rem)); margin-bottom: .7rem; padding: 1.05rem; border: 1px solid rgba(244,242,238,.24); background: rgba(23,23,23,.98); box-shadow: 0 22px 60px rgba(0,0,0,.35); }
.local-assistant__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.local-assistant__head h2 { margin: .25rem 0 0; color: var(--fh-paper); font-family: var(--fh-display); font-size: 1.55rem; letter-spacing: -.04em; }
.local-assistant__eyebrow, .local-assistant__note { color: var(--fh-gold); font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.local-assistant__close { width: 2rem; height: 2rem; border: 1px solid rgba(244,242,238,.28); background: transparent; color: var(--fh-paper); font-size: 1.25rem; line-height: 1; }
.local-assistant__intro { margin: .85rem 0; color: rgba(244,242,238,.7); font-size: .74rem; line-height: 1.5; }
.local-assistant__log { display: grid; gap: .5rem; max-height: 9rem; overflow: auto; padding: .7rem; background: rgba(244,242,238,.07); }
.local-assistant__message { width: fit-content; max-width: 92%; margin: 0; padding: .48rem .62rem; background: rgba(244,242,238,.1); color: var(--fh-paper); font-size: .72rem; line-height: 1.45; }
.local-assistant__message:not(.local-assistant__message--answer) { margin-left: auto; background: var(--fh-gold); color: var(--fh-ink); }
.local-assistant__prompts { display: flex; flex-wrap: wrap; gap: .4rem; margin: .7rem 0; }
.local-assistant__prompts button { padding: .4rem .55rem; border: 1px solid rgba(244,242,238,.28); background: transparent; color: var(--fh-paper); font-size: .62rem; }
.local-assistant__prompts button:hover { border-color: var(--fh-gold); color: var(--fh-gold); }
.local-assistant__form { display: grid; grid-template-columns: 1fr auto; gap: .4rem; }
.local-assistant__form input { min-width: 0; padding: .58rem .65rem; border: 1px solid rgba(244,242,238,.28); background: rgba(0,0,0,.2); color: var(--fh-paper); font-size: .72rem; }
.local-assistant__form button { padding: .58rem .7rem; border: 1px solid var(--fh-gold); background: var(--fh-gold); color: var(--fh-ink); font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.local-assistant__note { margin: .7rem 0 0; color: rgba(244,242,238,.52); font-size: .52rem; }
.local-assistant__toggle { width: 3.7rem; height: 3.7rem; min-height: 0; padding: .22rem; border-radius: 50%; }
.local-assistant__toggle-avatar, .local-assistant__avatar { display: block; flex: none; width: 2.7rem; height: 2.7rem; border-radius: 50%; background-image: url("assistant-robot-atlas.webp"); background-repeat: no-repeat; background-size: 500% 500%; }
.local-assistant__toggle-avatar { width: 100%; height: 100%; }
.local-assistant__toggle-avatar--rook, .local-assistant__avatar--rook { background-position: 100% 0%; }
.local-assistant__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 720px) {
  .local-assistant { right: auto; left: .7rem; bottom: .7rem; }
  .local-assistant__panel { width: min(22rem, calc(100vw - 1.4rem)); }
}
