/* Firefly Photography — one stylesheet.
   Luxury editorial with a little magic: warm ivory, champagne and charcoal, soft gold accents, Cormorant Garamond
   headlines with Manrope text, and the moving fireflies (site.js) glowing over the dark sections. */
:root {
  --ivory: #faf7f1;
  --ivory-2: #f4efe6;
  --champagne: #ece2d0;
  --champagne-2: #dccbad;
  --charcoal: #1b1917;
  --charcoal-2: #24211e;
  --charcoal-3: #322d29;
  --ink: #26221e;
  --muted: #72685e;
  --line: #e4dbcc;
  --gold: #c39a52;
  --gold-text: #8a6829;
  --glow: #f2bd5c;
  --glow-2: #ffd98f;
  --on-dark: #f2ece3;
  --on-dark-2: #bfb4a7;
  --serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --radius: 3px;
  /* kept for the Report / Request window */
  --night: var(--charcoal); --night-2: var(--charcoal-2); --cream: var(--ivory); --sand: var(--ivory-2); --sand-2: var(--champagne-2); --text: var(--ink);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; font-family: var(--sans); font-size: 16.5px; line-height: 1.75; color: var(--ink); background: var(--ivory); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
svg { fill: currentColor; flex: none; }
button { font: inherit; color: inherit; }
h1, h2, h3 { font-family: var(--serif); font-weight: 400; line-height: 1.04; letter-spacing: -.012em; }
em { font-style: italic; }
h1 em, h2 em { color: var(--gold-text); font-weight: 400; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.wrap { position: relative; z-index: 1; width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 32px; }
.skip { position: absolute; left: -999px; }
.skip:focus { left: 12px; top: 12px; z-index: 400; background: #fff; padding: 10px 14px; }
.center { text-align: center; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* ── Logo */
.logo { position: relative; display: inline-flex; align-items: center; gap: 12px; line-height: 1; }
.logo__icon { height: 42px; width: auto; filter: drop-shadow(0 0 10px rgba(242, 189, 92, .35)); transition: transform .5s var(--ease); }
a:hover > .logo .logo__icon { transform: rotate(-6deg) scale(1.06); }
.logo__text { display: inline-flex; flex-direction: column; align-items: flex-start; }
.logo__word { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: 30px; letter-spacing: .005em; }
.logo__sub { font-size: 9px; font-weight: 600; letter-spacing: .46em; text-transform: uppercase; margin-top: 7px; opacity: .78; }
@keyframes blink { 0%, 100% { opacity: 1; } 45% { opacity: .35; } 55% { opacity: .95; } }

/* ── Buttons: refined, tracked capitals; the gold one keeps a soft glow and a sweep of light */
.btn { position: relative; overflow: hidden; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 16px 30px; border: 0; border-radius: var(--radius); cursor: pointer;
  font: 600 12px/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; white-space: nowrap; transition: transform .3s var(--ease), box-shadow .3s, background .3s, color .3s; }
.btn svg { width: 16px; height: 16px; transition: transform .3s var(--ease); }
.btn:hover { transform: translateY(-2px); }
.btn:hover svg { transform: translateX(4px); }
.btn::after { content: ''; position: absolute; inset: -20% auto -20% -60%; width: 40%; z-index: -1; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-22deg); transition: left .8s var(--ease); }
.btn:hover::after { left: 130%; }
.btn--gold, .btn--glow { background: linear-gradient(135deg, #f1d79f, #d8ae62 55%, #c3954a); color: var(--charcoal); box-shadow: 0 10px 30px rgba(216, 174, 98, .28), inset 0 0 0 1px rgba(255, 238, 200, .45); }
.btn--gold:hover, .btn--glow:hover { box-shadow: 0 16px 44px rgba(242, 189, 92, .45), inset 0 0 0 1px rgba(255, 238, 200, .6); }
.btn--ghost { background: rgba(255, 255, 255, .04); color: var(--on-dark); box-shadow: inset 0 0 0 1px rgba(242, 236, 227, .42); backdrop-filter: blur(6px); }
.btn--ghost:hover { box-shadow: inset 0 0 0 1px var(--glow-2); color: #fff; }
.btn--line { background: none; color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.btn--line:hover { background: var(--ink); color: var(--ivory); }
.btn--lg { padding: 19px 36px; font-size: 12.5px; }
.btn--sm { padding: 12px 20px; font-size: 11px; }
.link-arrow { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; border-bottom: 1px solid currentColor; padding-bottom: 5px; transition: gap .3s var(--ease), color .2s; }
.link-arrow svg { width: 15px; height: 15px; }
.link-arrow:hover { gap: 15px; color: var(--gold-text); }

/* ── Header: see-through over the dark top of a page, solid once scrolled */
.header { position: fixed; top: 0; left: 0; right: 0; z-index: 50; color: var(--on-dark); transition: color .35s; }
.header__row { display: flex; align-items: center; gap: 26px; height: 92px; transition: height .35s; }
.header::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .35s; background: rgba(27, 25, 23, .9); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); box-shadow: 0 1px 0 rgba(242, 189, 92, .14); }
.header.scrolled::before { opacity: 1; }
.header.scrolled .header__row { height: 70px; }
body:not(.top-dark) .header:not(.scrolled) { color: var(--ink); }
.nav { display: flex; align-items: center; gap: 30px; margin-left: auto; font-size: 11.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.nav > a, .drop summary { position: relative; padding: 8px 0; opacity: .85; transition: opacity .2s; cursor: pointer; }
.nav > a::after, .drop summary::before { content: ''; position: absolute; left: 0; right: 0; bottom: 2px; height: 1px; background: var(--glow); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.nav > a:hover, .nav > a.on, .drop summary:hover, .drop summary.on, .drop[open] summary { opacity: 1; }
.nav > a:hover::after, .nav > a.on::after, .drop summary.on::before { transform: scaleX(1); }
.nav__cta { display: none; }
.drop { position: relative; }
.drop summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; }
.drop summary::-webkit-details-marker { display: none; }
.drop summary::after { content: ''; width: 5px; height: 5px; margin-top: -3px; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg); transition: transform .2s; }
.drop[open] summary::after { transform: rotate(-135deg); margin-top: 3px; }
.drop__panel { position: absolute; top: calc(100% + 22px); left: 50%; transform: translateX(-50%); width: 640px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 12px; background: rgba(27, 25, 23, .97); border: 1px solid rgba(242, 189, 92, .18); box-shadow: 0 30px 70px rgba(0, 0, 0, .45); animation: pop .3s var(--ease); color: var(--on-dark); text-transform: none; letter-spacing: 0; }
.drop__panel a { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 5; }
.drop__panel img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.drop__panel a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(10, 9, 8, .85)); }
.drop__panel span { position: absolute; left: 10px; right: 10px; bottom: 9px; z-index: 1; font-family: var(--serif); font-size: 18px; font-style: italic; line-height: 1.1; }
.drop__panel a:hover img { transform: scale(1.07); }
.drop__panel .drop__all { display: grid; place-items: center; background: rgba(242, 189, 92, .08); box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .25); }
.drop__panel .drop__all::after { display: none; }
.drop__panel .drop__all span { position: static; display: inline-flex; align-items: center; gap: 6px; font-size: 17px; }
.drop__panel .drop__all svg { width: 14px; height: 14px; }
@keyframes pop { from { opacity: 0; transform: translate(-50%, 8px); } }
.header__book { flex: none; }
.menu { display: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .08); cursor: pointer; position: relative; }
.menu span { position: absolute; left: 13px; right: 13px; height: 1.5px; background: currentColor; transition: transform .3s var(--ease), top .3s; }
.menu span:first-child { top: 18px; } .menu span:last-child { top: 25px; }
.menu[aria-expanded="true"] span:first-child { top: 21.5px; transform: rotate(45deg); }
.menu[aria-expanded="true"] span:last-child { top: 21.5px; transform: rotate(-45deg); }

/* ── The logo's firefly, big and faint behind the fireflies: a light sweeps across the gold, the antenna lights glow,
      the whole thing breathes and leans with the mouse */
.mark { position: absolute; z-index: 0; pointer-events: none; aspect-ratio: 1084 / 737; --o: .2; --sheen: .7; --lights: 1;
  translate: calc(var(--px, 0) * -22px) calc(var(--ty, 0%) + var(--py, 0) * -16px); transition: translate 1.2s var(--ease); animation: breathe 12s ease-in-out infinite; }
.mark img { width: 100%; height: 100%; opacity: var(--o); filter: drop-shadow(0 0 50px rgba(242, 189, 92, .3)); }
.mark__sheen { position: absolute; inset: 0; opacity: var(--sheen);
  -webkit-mask: url(/img/logo/emblem-1600.webp) center / 100% 100% no-repeat; mask: url(/img/logo/emblem-1600.webp) center / 100% 100% no-repeat;
  background: linear-gradient(105deg, transparent 40%, rgba(255, 236, 190, .55) 49%, rgba(255, 250, 235, .8) 50%, rgba(255, 236, 190, .55) 51%, transparent 60%); background-size: 300% 100%; background-position: 140% 0;
  animation: sheen 11s ease-in-out 1.5s infinite; }
.mark__light { position: absolute; top: 7%; width: 2.2%; aspect-ratio: 1; border-radius: 50%; opacity: var(--lights); background: #fff6dc;
  box-shadow: 0 0 10px 4px rgba(255, 221, 150, .95), 0 0 40px 16px rgba(242, 189, 92, .5), 0 0 110px 40px rgba(242, 189, 92, .18); animation: antenna 3.4s ease-in-out infinite; }
.mark__light--l { left: 38.4%; }
.mark__light--r { left: 61.4%; animation-delay: -1.3s; }
@keyframes sheen { 0%, 15% { background-position: 140% 0; } 65%, 100% { background-position: -40% 0; } }
@keyframes antenna { 0%, 100% { opacity: calc(var(--lights) * .35); scale: .75; } 50% { opacity: var(--lights); scale: 1.2; } }
@keyframes breathe { 50% { scale: 1.035; } }
.mark--book { width: 1000px; right: -200px; top: 50%; --ty: -50%; rotate: 8deg; --o: .08; --sheen: .4; --lights: .6; }
.mark--page { width: 820px; right: -150px; top: 50%; --ty: -50%; rotate: -7deg; --o: .09; --sheen: .45; --lights: .7; }
.mark--left { right: auto; left: -190px; rotate: 7deg; }

/* ── Fireflies (canvas drawn by site.js) */
.fireflies { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }

/* ── Small type */
.eyebrow { display: inline-flex; align-items: center; gap: 12px; font-size: 11.5px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--on-dark-2); }
.eyebrow a:hover { color: var(--glow-2); }
.eyebrow span { opacity: .5; }
.spark { width: 7px; height: 7px; border-radius: 50%; background: var(--glow-2); box-shadow: 0 0 10px 3px var(--glow); animation: blink 3s infinite; }
.kicker { display: inline-flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 600; letter-spacing: .32em; text-transform: uppercase; color: var(--gold-text); margin-bottom: 20px; }
.kicker::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--glow); box-shadow: 0 0 10px 2px var(--glow); animation: blink 4s infinite; }
.lead { font-size: 19px; line-height: 1.75; color: var(--on-dark-2); max-width: 620px; }
.lead--ink { color: var(--ink); font-family: var(--serif); font-size: 25px; line-height: 1.5; max-width: none; }
.stars { display: inline-flex; gap: 2px; color: var(--glow); }
.stars svg { width: 14px; height: 14px; }

/* ── Sections */
.section { position: relative; padding: 130px 0; overflow: hidden; }
.section__head { max-width: 720px; margin-bottom: 60px; }
.section__head--center { margin-left: auto; margin-right: auto; text-align: center; }
.section__head--center .kicker { justify-content: center; }
.section__head--split { max-width: none; display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.section__head h2 { font-size: clamp(44px, 5.4vw, 74px); }
.section__sub { margin-top: 18px; color: var(--muted); font-size: 17.5px; }
.section__sub a { border-bottom: 1px solid currentColor; }
.js .reveal { opacity: 0; translate: 0 34px; transition: opacity 1s var(--ease) calc(var(--d, 0) * 120ms), translate 1s var(--ease) calc(var(--d, 0) * 120ms); }
.js .reveal.in { opacity: 1; translate: none; }

/* ── Home: full-screen opening — three photographs side by side (one after another on a phone), fireflies over them */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: center; justify-content: center; overflow: hidden; isolation: isolate; color: var(--on-dark); background: var(--charcoal); text-align: center; }
.hero__photos { position: absolute; inset: 0; z-index: -2; display: grid; grid-template-columns: 1fr 1.18fr 1fr; gap: 6px; background: var(--charcoal); }
.hero__photo { position: relative; overflow: hidden; }
.hero__photo img { width: 100%; height: 100%; object-fit: cover; animation: develop 2s var(--ease) both, kenburns 26s ease-in-out infinite alternate; }
.hero__photo--1 img { object-position: 50% 60%; animation-delay: .5s, -4s; }
.hero__photo--2 img { object-position: 50% 45%; animation-delay: .15s, -12s; }
.hero__photo--3 img { object-position: 50% 40%; animation-delay: .8s, -20s; }
@keyframes develop { from { opacity: 0; filter: brightness(2) saturate(0) blur(8px); } }
@keyframes kenburns { from { transform: scale(1.02); } to { transform: scale(1.12) translate(-1%, -1.5%); } }
.hero__shade { position: absolute; inset: 0; z-index: -1; background: radial-gradient(70% 60% at 50% 52%, rgba(20, 18, 16, .62), rgba(20, 18, 16, .25) 70%), linear-gradient(180deg, rgba(20, 18, 16, .55) 0%, rgba(20, 18, 16, .1) 30%, rgba(20, 18, 16, .2) 65%, rgba(20, 18, 16, .85) 100%); }
.hero .fireflies { z-index: 0; }
.hero__copy { position: relative; z-index: 1; display: grid; justify-items: center; padding-top: 80px; padding-bottom: 60px; }
.hero__copy > * { animation: rise 1.2s var(--ease) both; }
.hero__copy > :nth-child(2) { animation-delay: .15s; } .hero__copy > :nth-child(3) { animation-delay: .3s; } .hero__copy > :nth-child(4) { animation-delay: .45s; }
@keyframes rise { from { opacity: 0; transform: translateY(26px); } }
.hero h1 { font-size: clamp(56px, 8.6vw, 128px); font-weight: 300; margin: 26px 0 22px; color: #fdf7ec; text-shadow: 0 4px 40px rgba(0, 0, 0, .35); }
.hero h1 em { display: block; font-weight: 300; background: linear-gradient(100deg, #f2bd5c 0%, #ffe3a8 35%, #fff4d8 48%, #ffe3a8 60%, #e3a548 100%); background-size: 240% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: shimmer 7s ease-in-out 1s infinite; text-shadow: none; }
@keyframes shimmer { 0% { background-position: 100% 0; } 45%, 100% { background-position: -40% 0; } }
.hero__lead { max-width: 560px; font-size: 18px; color: #e9e0d3; text-shadow: 0 2px 20px rgba(0, 0, 0, .5); }
.hero__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 40px; }
.hero__scroll { position: absolute; left: 50%; bottom: 28px; z-index: 2; width: 24px; height: 40px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(242, 236, 227, .45); transform: translateX(-50%); }
.hero__scroll span { position: absolute; left: 50%; top: 9px; width: 3px; height: 8px; margin-left: -1.5px; border-radius: 2px; background: var(--glow); animation: scrolly 2s ease-in-out infinite; }
@keyframes scrolly { 60% { transform: translateY(12px); opacity: 0; } 61% { transform: none; opacity: 0; } }

/* ── Marquee */
.marquee { overflow: hidden; background: var(--charcoal-2); color: var(--on-dark); border-top: 1px solid rgba(242, 189, 92, .12); border-bottom: 1px solid rgba(242, 189, 92, .12); }
.marquee__track { display: flex; width: max-content; animation: marquee 50s linear infinite; }
.marquee__track > span { display: flex; align-items: center; gap: 34px; padding: 18px 17px; white-space: nowrap; }
.marquee i { font-family: var(--serif); font-size: 30px; font-weight: 300; }
.marquee b { color: var(--glow); font-size: 13px; text-shadow: 0 0 12px var(--glow); }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ── Home: statement */
.statement { padding: 150px 0; background: var(--ivory); }
.statement__inner { max-width: 940px; text-align: center; }
.statement .kicker { justify-content: center; }
.statement__text { font-family: var(--serif); font-size: clamp(27px, 3.1vw, 40px); font-weight: 300; line-height: 1.45; color: var(--ink); }
.statement__sign { margin-top: 30px; font-family: var(--serif); font-style: italic; font-size: 30px; color: var(--gold-text); }

/* ── Home: specialties (editorial, asymmetric) */
.specialties { background: var(--ivory-2); }
.spec { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 270px; gap: 14px; margin-bottom: 50px; }
.spec__tile { position: relative; display: block; overflow: hidden; isolation: isolate; background: var(--champagne); }
.spec__tile--1 { grid-column: 1 / 3; grid-row: 1 / 3; }
.spec__tile--2 { grid-column: 3 / 4; grid-row: 1 / 2; }
.spec__tile--3 { grid-column: 4 / 5; grid-row: 1 / 3; }
.spec__tile--4 { grid-column: 3 / 4; grid-row: 2 / 3; }
.spec__tile--5 { grid-column: 1 / 2; grid-row: 3 / 4; }
.spec__tile--6 { grid-column: 2 / 3; grid-row: 3 / 4; }
.spec__tile--7 { grid-column: 3 / 5; grid-row: 3 / 4; }
.spec__tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease), filter .8s; }
.spec__shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(18, 16, 14, .78)); transition: opacity .5s; }
.spec__text { position: absolute; left: 26px; right: 26px; bottom: 22px; color: #fff9ef; display: grid; gap: 2px; }
.spec__text small { font-size: 11px; letter-spacing: .3em; color: var(--glow-2); }
.spec__text strong { font-family: var(--serif); font-weight: 400; font-size: clamp(26px, 2.4vw, 36px); line-height: 1.05; }
.spec__tile--1 .spec__text strong { font-size: clamp(36px, 4vw, 58px); }
.spec__text > span { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; opacity: 0; transform: translateY(8px); transition: opacity .4s, transform .4s var(--ease); }
.spec__text svg { width: 14px; height: 14px; }
.spec__tile::after { content: ''; position: absolute; inset: 12px; border: 1px solid rgba(255, 230, 180, 0); transition: border-color .5s, inset .5s var(--ease); pointer-events: none; }
.spec__tile:hover img { transform: scale(1.07); }
.spec__tile:hover .spec__text > span, .spec__tile:focus-visible .spec__text > span { opacity: 1; transform: none; }
.spec__tile:hover::after { border-color: rgba(255, 230, 180, .55); inset: 16px; }

/* ── Dark experience section (home) */
.xp { background: radial-gradient(60% 70% at 85% 20%, #3a2d22, transparent 70%), var(--charcoal); color: var(--on-dark); }
.xp__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.xp h2 { font-size: clamp(38px, 4.2vw, 58px); color: #fbf4e8; margin-bottom: 26px; }
.xp h2 em { color: var(--glow-2); }
.xp .kicker { color: var(--glow); }
.xp__copy p:not(.kicker):not(.lead) { color: var(--on-dark-2); margin: 18px 0 34px; }
.xp .lead { color: #efe5d6; font-family: var(--serif); font-size: 25px; line-height: 1.45; }
.pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(242, 189, 92, .16); border: 1px solid rgba(242, 189, 92, .16); }
.pillars li { padding: 34px 30px; background: var(--charcoal); }
.pillars span { display: block; font-family: var(--serif); font-size: 44px; font-weight: 300; line-height: 1; color: var(--glow); text-shadow: 0 0 24px rgba(242, 189, 92, .5); margin-bottom: 16px; }
.pillars h3 { font-size: 27px; margin-bottom: 10px; color: #fbf4e8; }
.pillars p { color: var(--on-dark-2); font-size: 15px; }
.pillars--light { grid-template-columns: repeat(4, 1fr); background: var(--line); border-color: var(--line); }
.pillars--light li { background: var(--ivory); }
.pillars--light h3 { color: var(--ink); }
.pillars--light p { color: var(--muted); }
.pillars--light span { color: var(--gold); text-shadow: none; }

/* ── Home: featured photographs, editorial arrangement (one in black & white until hovered) */
.editorial { background: var(--ivory); }
.ed { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 290px; gap: 14px; }
.ed__item { position: relative; padding: 0; border: 0; overflow: hidden; cursor: zoom-in; background: var(--champagne); }
.ed__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter 1s; }
.ed__item:hover img { transform: scale(1.05); }
.ed__item--1 { grid-column: 1 / 6; grid-row: 1 / 3; }
.ed__item--2 { grid-column: 6 / 9; grid-row: 1 / 2; }
.ed__item--3 { grid-column: 9 / 13; grid-row: 1 / 3; }
.ed__item--4 { grid-column: 1 / 5; grid-row: 3 / 4; }
.ed__item--5 { grid-column: 5 / 9; grid-row: 3 / 4; }
.ed__item--6 { grid-column: 9 / 13; grid-row: 3 / 4; }
.ed__item--4 img { filter: grayscale(1) contrast(1.05); }
.ed__item--4:hover img { filter: none; }
.ed__quote { grid-column: 6 / 9; grid-row: 2 / 3; display: grid; place-items: center; padding: 26px; background: var(--charcoal); color: var(--on-dark); text-align: center; }
.ed__quote p { font-family: var(--serif); font-size: clamp(20px, 1.9vw, 27px); line-height: 1.35; font-weight: 300; }
.ed__quote em { color: var(--glow-2); }

/* ── Film strip */
.filmstrip { background: var(--charcoal); padding: 22px 0; overflow: hidden; }
.filmstrip__track { display: flex; gap: 12px; width: max-content; animation: marquee 80s linear infinite; }
.filmstrip:hover .filmstrip__track { animation-play-state: paused; }
.filmstrip__item { flex: none; height: 280px; padding: 0; border: 0; overflow: hidden; cursor: zoom-in; background: var(--charcoal-2); }
.filmstrip__item img { height: 100%; width: auto; transition: transform .9s var(--ease), filter .5s; filter: saturate(.9); }
.filmstrip__item:hover img { transform: scale(1.06); filter: saturate(1.08); }

/* ── Reviews */
.kind { background: var(--ivory-2); }
.rating { display: flex; justify-content: center; margin-bottom: 44px; }
.rating > a, .rating > span { display: inline-flex; align-items: center; gap: 12px; padding: 12px 22px; background: #fff; border: 1px solid var(--line); font-size: 14px; color: var(--muted); }
.rating svg { width: 20px; height: 20px; }
.rating .stars svg { width: 15px; height: 15px; }
.rating__num { font-family: var(--serif); font-size: 30px; line-height: 1; color: var(--ink); }
.rating > a:hover { border-color: var(--gold); }
.review { position: relative; padding: 36px 32px 28px; background: #fff; border: 1px solid var(--line); transition: transform .4s var(--ease), box-shadow .4s; height: 100%; display: flex; flex-direction: column; }
.review:hover { transform: translateY(-4px); box-shadow: 0 26px 50px rgba(60, 45, 25, .09); }
.review__mark { position: absolute; right: 26px; top: 0; font-family: var(--serif); font-size: 100px; line-height: 1; color: var(--champagne); }
.review blockquote { margin: 16px 0 24px; font-family: var(--serif); font-size: 21px; line-height: 1.5; color: var(--ink); flex: 1; }
.review figcaption { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12.5px; color: var(--muted); flex-wrap: wrap; }
.review figcaption strong { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.review figcaption span { display: inline-flex; align-items: center; gap: 6px; }
.review figcaption svg { width: 15px; height: 15px; }
.review--big blockquote { font-size: 24px; }
.reviews__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: stretch; }
.reviews__grid > div { min-width: 0; }
.carousel { position: relative; }
.carousel__track { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: 6px 2px 18px; }
.carousel__track::-webkit-scrollbar { display: none; }
.carousel__slide { flex: 0 0 calc((100% - 40px) / 3); scroll-snap-align: start; min-width: 0; }
.carousel__ui { display: flex; align-items: center; justify-content: center; gap: 22px; margin-top: 18px; }
.carousel__btn { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid var(--ink); border-radius: 50%; background: none; cursor: pointer; transition: background .25s, color .25s; }
.carousel__btn:hover { background: var(--ink); color: var(--ivory); }
.carousel__btn svg { width: 20px; height: 20px; }
.carousel__dots { display: flex; gap: 10px; }
.carousel__dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: var(--champagne-2); cursor: pointer; transition: background .3s, box-shadow .3s, transform .3s; }
.carousel__dots button[aria-selected="true"] { background: var(--glow); box-shadow: 0 0 10px 2px rgba(242, 189, 92, .7); transform: scale(1.25); }
.kind__links { margin-top: 44px; display: flex; justify-content: center; gap: 34px; flex-wrap: wrap; }

/* ── Meet Shelly */
.meet { background: var(--ivory); }
.meet__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 90px; align-items: center; }
.meet__photo { position: relative; max-width: 460px; }
.meet__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; border-radius: 240px 240px 0 0; }
.meet__photo::before { content: ''; position: absolute; inset: -18px 18px 18px -18px; border-radius: 250px 250px 0 0; border: 1px solid var(--champagne-2); z-index: -1; }
.meet__badge { position: absolute; right: -16px; bottom: 36px; padding: 12px 22px; background: var(--charcoal); color: var(--on-dark); font-family: var(--serif); font-style: italic; font-size: 22px; box-shadow: 0 16px 40px rgba(0, 0, 0, .2); }
.meet h2 { font-size: clamp(42px, 4.8vw, 66px); margin-bottom: 26px; }
.meet__copy p:not(.kicker) { margin-bottom: 20px; color: var(--muted); }
.meet__copy .lead--ink { color: var(--ink); }
.meet .link-arrow { margin-top: 8px; }

/* ── Journal cards */
.journal-teaser { background: var(--ivory-2); }
.journal-teaser--tight { padding-top: 90px; }
.jgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 26px; }
.jcard { display: grid; align-content: start; gap: 20px; }
.jcard__img { display: block; overflow: hidden; aspect-ratio: 4 / 5; background: var(--champagne); }
.jcard__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.jcard:hover .jcard__img img { transform: scale(1.05); }
.jcard__meta { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.jcard__meta a { color: var(--gold-text); }
.jcard h3 { font-size: 30px; line-height: 1.15; margin: 8px 0 12px; }
.jcard h3 a { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .5s var(--ease); }
.jcard:hover h3 a { background-size: 100% 1px; }
.jcard__excerpt { color: var(--muted); margin-bottom: 18px; }
.jcard--big { grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: center; margin-bottom: 70px; }
.jcard--big .jcard__img { aspect-ratio: 5 / 4; }
.jcard--big h3 { font-size: clamp(38px, 4vw, 56px); }

/* ── Book (on most pages) */
.book { position: relative; overflow: hidden; isolation: isolate; padding: 140px 0; color: var(--on-dark); background: radial-gradient(60% 70% at 85% 20%, #3a2d22, transparent 70%), radial-gradient(50% 60% at 0% 100%, #2a231d, transparent 70%), var(--charcoal); }
.book--page { padding-top: 190px; }
.book__grid { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: start; }
.book .kicker { color: var(--glow); }
.book h1, .book h2 { font-size: clamp(50px, 6.4vw, 92px); font-weight: 300; color: #fbf4e8; margin-bottom: 24px; }
.book h1 em, .book h2 em { color: var(--glow-2); }
.book__contact { display: grid; gap: 14px; margin: 36px 0 30px; font-size: 15px; }
.book__contact a, .book__contact span { display: inline-flex; align-items: center; gap: 12px; color: var(--on-dark); transition: color .2s; overflow-wrap: anywhere; }
.book__contact a:hover { color: var(--glow-2); }
.book__contact svg { width: 17px; height: 17px; color: var(--glow); }
.social { display: flex; flex-wrap: wrap; gap: 10px; }
.social a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 13px; font-weight: 500; box-shadow: inset 0 0 0 1px rgba(242, 236, 227, .22); transition: box-shadow .2s, color .2s; }
.social a:hover { box-shadow: inset 0 0 0 1px var(--glow); color: #fff; }
.social svg { width: 16px; height: 16px; color: var(--glow); }
.inquiry { display: grid; gap: 16px; padding: 42px 40px; background: rgba(255, 250, 240, .04); box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .2), 0 40px 90px rgba(0, 0, 0, .35); backdrop-filter: blur(10px); }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { display: grid; gap: 8px; min-width: 0; }
.field > span { font-size: 11px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--on-dark-2); }
.field em { font-style: normal; text-transform: none; letter-spacing: 0; font-weight: 400; opacity: .7; margin-left: 4px; }
.field input, .field select, .field textarea { width: 100%; padding: 14px 16px; border-radius: var(--radius); border: 1px solid rgba(242, 236, 227, .18); background: rgba(10, 9, 8, .35); color: #fbf4e8; font: 400 16px/1.4 var(--sans); transition: border-color .2s, box-shadow .2s, background .2s; }
.field select option { color: #111; }
.field textarea { resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: rgba(242, 236, 227, .38); }
.field input:focus, .field select:focus, .field textarea:focus { outline: 0; border-color: var(--glow); box-shadow: 0 0 0 4px rgba(242, 189, 92, .16); background: rgba(10, 9, 8, .5); }
.field .bad { border-color: #ff8a7a; }
.inquiry .btn { justify-self: start; margin-top: 6px; }
.inquiry__fine { font-size: 12.5px; color: var(--on-dark-2); }
.inquiry__error { font-size: 14px; color: #ffb4a8; }
.inquiry__error a { text-decoration: underline; }
.inquiry.sent > :not(.inquiry__done) { display: none; }
.inquiry__done { display: grid; justify-items: center; gap: 12px; text-align: center; padding: 40px 10px; }
.inquiry__done h3 { font-size: 46px; font-weight: 300; color: #fbf4e8; }
.inquiry__done p { color: var(--on-dark-2); max-width: 420px; }
.inquiry__spark { width: 16px; height: 16px; border-radius: 50%; background: var(--glow-2); box-shadow: 0 0 20px 8px var(--glow), 0 0 60px 20px rgba(242, 189, 92, .4); animation: blink 2s infinite; margin-bottom: 14px; }

/* ── Inner page tops */
.page-hero { position: relative; overflow: hidden; isolation: isolate; color: var(--on-dark); padding: 200px 0 100px; min-height: 82vh; display: flex; align-items: flex-end; background: var(--charcoal); }
.page-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 32%; z-index: -2; animation: kenburns 28s ease-in-out infinite alternate; }
.page-hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(20, 18, 16, .5) 0%, rgba(20, 18, 16, .2) 40%, rgba(20, 18, 16, .88) 100%); }
.page-hero__copy { position: relative; z-index: 1; }
.page-hero h1 { font-size: clamp(58px, 9vw, 132px); font-weight: 300; color: #fdf7ec; margin: 20px 0 16px; }
.page-hero h1 em { color: var(--glow-2); }
.page-hero__sub { font-family: var(--serif); font-size: clamp(24px, 2.6vw, 34px); font-weight: 300; color: #ede3d4; max-width: 760px; }
.page-hero__sub em { color: var(--glow-2); }
.page-hero .lead { max-width: 720px; color: #e2d8ca; }
.page-hero--plain { min-height: 0; padding: 200px 0 110px; background: radial-gradient(60% 70% at 85% 30%, #3a2d22, transparent 70%), var(--charcoal); }
.page-hero--plain h1 { font-size: clamp(50px, 7vw, 104px); max-width: 1000px; }
.page-hero--xp h1 { font-size: clamp(44px, 5.8vw, 86px); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.chip { padding: 10px 18px; border: 0; background: none; cursor: pointer; font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; box-shadow: inset 0 0 0 1px rgba(242, 236, 227, .28); transition: box-shadow .2s, background .2s, color .2s; }
.chip:hover { box-shadow: inset 0 0 0 1px var(--glow); }
.chip.on { background: linear-gradient(135deg, #f1d79f, #d8ae62); color: var(--charcoal); box-shadow: none; }
.chips--light { margin: 0 0 50px; justify-content: center; }
.chips--light .chip { box-shadow: inset 0 0 0 1px var(--line); color: var(--ink); }
.chips--light .chip:hover { box-shadow: inset 0 0 0 1px var(--gold); }
.chips--light .chip.on { color: var(--charcoal); box-shadow: none; }

/* ── Service pages */
.svc-intro { background: var(--ivory); }
.svc-intro__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: start; }
.svc-intro h2 { font-size: clamp(42px, 4.8vw, 68px); }
.ticks { display: grid; gap: 10px; }
.ticks li { position: relative; padding-left: 26px; font-size: 15px; }
.ticks li::before { content: ''; position: absolute; left: 3px; top: .62em; width: 7px; height: 7px; border-radius: 50%; background: var(--glow); box-shadow: 0 0 10px 1px rgba(242, 189, 92, .75); }
.ticks--roomy { margin: 30px 0 38px; gap: 14px; }
.ticks--roomy li { color: var(--muted); font-size: 16px; }
.svc-intro__links { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }
.svc-gallery { padding-top: 40px; background: var(--ivory); }
.svc-how { background: var(--ivory-2); }
.svc-how__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.svc-how h2 { font-size: clamp(40px, 4.4vw, 62px); margin-bottom: 30px; }
.mini-steps { counter-reset: m; display: grid; gap: 0; margin-bottom: 34px; border-top: 1px solid var(--line); }
.mini-steps li { counter-increment: m; display: flex; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: 23px; }
.mini-steps li::before { content: counter(m, decimal-leading-zero); font-family: var(--sans); font-size: 11px; letter-spacing: .2em; color: var(--gold-text); }
.mini-steps strong { font-weight: 400; }
.svc-how__pkg .center { margin-top: 22px; }
.svc-reviews { background: var(--ivory); }
.svc-reviews .center { margin-top: 44px; }
.private { max-width: 720px; margin: 0 auto; text-align: center; padding: 60px 30px; border: 1px solid var(--line); background: #fff; }
.private .kicker { justify-content: center; }
.private h2 { font-size: clamp(38px, 4.4vw, 58px); margin-bottom: 20px; }
.private p:not(.kicker) { color: var(--muted); margin-bottom: 30px; }
.pager { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding-top: 30px; padding-bottom: 110px; }
.pager a { display: grid; gap: 4px; padding: 30px 32px; background: var(--ivory-2); border: 1px solid var(--line); transition: background .3s, transform .3s var(--ease); }
.pager a:last-child { text-align: right; }
.pager a:hover { background: var(--champagne); transform: translateY(-3px); }
.pager span { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.pager strong { font-family: var(--serif); font-size: 34px; font-weight: 400; }
/* each specialty has its own mood */
.mood-bold .svc-gallery { background: var(--charcoal); }
.mood-bold .svc-gallery .masonry__item, .mood-bold .svc-gallery .spread__item { background: var(--charcoal-2); }
.mood-bold .svc-intro { background: var(--ivory-2); }
.mood-warm .svc-gallery, .mood-warm .svc-intro { background: #f6efe3; }
.mood-intimate .svc-gallery .egallery { max-width: 1060px; margin: 0 auto; }
.mood-intimate .svc-intro { background: var(--ivory); }
.mood-romantic .page-hero__shade { background: linear-gradient(180deg, rgba(24, 20, 16, .45) 0%, rgba(40, 30, 20, .15) 45%, rgba(20, 18, 16, .88) 100%); }

/* ── Editorial gallery: a spread of the first photos, then a masonry wall */
.spread { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 330px; gap: 14px; margin-bottom: 14px; }
.spread__item, .masonry__item { position: relative; display: block; padding: 0; border: 0; overflow: hidden; cursor: zoom-in; background: var(--champagne); }
.spread__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.spread__item:hover img, .masonry__item:hover img { transform: scale(1.04); }
.spread--5 .spread__item--1, .spread--4 .spread__item--1, .spread--3 .spread__item--1 { grid-column: 1 / 8; grid-row: 1 / 3; }
.spread--5 .spread__item--2, .spread--4 .spread__item--2, .spread--3 .spread__item--2 { grid-column: 8 / 13; grid-row: 1 / 2; }
.spread--5 .spread__item--3, .spread--4 .spread__item--3, .spread--3 .spread__item--3 { grid-column: 8 / 13; grid-row: 2 / 3; }
.spread--5 .spread__item--4 { grid-column: 1 / 6; grid-row: 3 / 4; }
.spread--5 .spread__item--5 { grid-column: 6 / 13; grid-row: 3 / 4; }
.spread--4 .spread__item--4 { grid-column: 1 / 13; grid-row: 3 / 4; }
.spread--2 .spread__item { grid-column: span 6; grid-row: span 2; }
.spread--1 .spread__item { grid-column: 1 / 13; grid-row: span 2; }
.masonry { columns: 3; column-gap: 14px; }
.masonry__item { width: 100%; margin: 0 0 14px; break-inside: avoid; }
.masonry__item img { width: 100%; height: auto; transition: transform 1.2s var(--ease); }
.masonry__item::after, .spread__item::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, rgba(242, 189, 92, 0), rgba(20, 18, 16, 0)); transition: background .5s; pointer-events: none; }
.masonry__item:hover::after, .spread__item:hover::after { background: radial-gradient(circle at 50% 50%, rgba(242, 189, 92, .1), rgba(20, 18, 16, .12)); }

/* ── Portfolio index */
.pf { display: grid; gap: 14px; }
.pf__row { display: grid; grid-template-columns: 1fr 1fr; min-height: 420px; background: #fff; border: 1px solid var(--line); overflow: hidden; }
.pf__row:nth-child(even) .pf__img { order: 2; }
.pf__img { position: relative; overflow: hidden; }
.pf__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.pf__row:hover .pf__img img { transform: scale(1.05); }
.pf__text { display: grid; align-content: center; gap: 14px; padding: 50px 56px; }
.pf__text small { font-size: 11px; letter-spacing: .3em; color: var(--gold-text); }
.pf__text strong { font-family: var(--serif); font-weight: 400; font-size: clamp(36px, 3.8vw, 54px); line-height: 1.05; }
.pf__text > span { color: var(--muted); }
.pf__text em { display: inline-flex; align-items: center; gap: 10px; font-style: normal; font-size: 11.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; }
.pf__text em svg { width: 15px; height: 15px; transition: transform .3s var(--ease); }
.pf__row:hover .pf__text em svg { transform: translateX(5px); }

/* ── Experience page */
.xp-story { background: var(--ivory); }
.xp-story__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: center; }
.xp-story__photos { position: relative; height: 640px; }
.xp-story__p { position: absolute; overflow: hidden; box-shadow: 0 30px 60px rgba(40, 30, 20, .18); }
.xp-story__p img { width: 100%; height: 100%; object-fit: cover; }
.xp-story__p--1 { left: 0; top: 0; width: 58%; height: 66%; }
.xp-story__p--2 { right: 0; top: 18%; width: 46%; height: 52%; z-index: 2; border: 8px solid var(--ivory); }
.xp-story__p--3 { left: 14%; bottom: 0; width: 44%; height: 38%; z-index: 1; }
.xp-story__copy p { color: var(--muted); margin-bottom: 22px; }
.xp-story__copy .lead--ink { color: var(--ink); }
.xp-story__closing { margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--line); font-family: var(--serif); font-style: italic; font-size: 27px; line-height: 1.45; color: var(--ink) !important; }
.xp-pillars { background: var(--ivory-2); }

/* ── Process timeline (dark) */
.process { background: radial-gradient(60% 60% at 15% 10%, #3a2d22, transparent 70%), var(--charcoal); color: var(--on-dark); }
.process .kicker { color: var(--glow); }
.process h2 { color: #fbf4e8; }
.process h2 em { color: var(--glow-2); }
.process .section__sub { color: var(--on-dark-2); }
.tabs { display: flex; justify-content: center; gap: 8px; margin-bottom: 50px; flex-wrap: wrap; }
.tabs__btn { padding: 13px 22px; border: 0; background: none; cursor: pointer; font-size: 11.5px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--on-dark-2); box-shadow: inset 0 0 0 1px rgba(242, 236, 227, .22); transition: color .2s, box-shadow .2s, background .2s; }
.tabs__btn:hover { color: #fff; box-shadow: inset 0 0 0 1px var(--glow); }
.tabs__btn.on { background: linear-gradient(135deg, #f1d79f, #d8ae62); color: var(--charcoal); box-shadow: none; }
.timeline { max-width: 860px; margin: 0 auto; }
.timeline__note { text-align: center; color: var(--on-dark-2); font-style: italic; font-family: var(--serif); font-size: 21px; margin-bottom: 40px; }
.timeline ol { position: relative; display: grid; gap: 0; }
.timeline ol::before { content: ''; position: absolute; left: 31px; top: 20px; bottom: 20px; width: 1px; background: linear-gradient(180deg, transparent, rgba(242, 189, 92, .45) 8%, rgba(242, 189, 92, .45) 92%, transparent); }
.timeline li { position: relative; display: grid; grid-template-columns: 64px 1fr; gap: 28px; padding: 22px 0; }
.timeline__n { position: relative; z-index: 1; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--charcoal); box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .5), 0 0 30px rgba(242, 189, 92, .18); font-family: var(--serif); font-size: 24px; color: var(--glow-2); }
.timeline h3 { font-size: 32px; color: #fbf4e8; margin: 10px 0 10px; }
.timeline p { color: var(--on-dark-2); }

/* ── FAQ */
.faq { background: var(--ivory); }
.faq__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; }
.faq__list { border-top: 1px solid var(--line); }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__item summary { list-style: none; position: relative; padding: 24px 50px 24px 0; cursor: pointer; font-family: var(--serif); font-size: 25px; line-height: 1.3; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: '+'; position: absolute; right: 6px; top: 50%; translate: 0 -50%; font-family: var(--sans); font-weight: 300; font-size: 26px; color: var(--gold-text); transition: rotate .3s var(--ease); }
.faq__item[open] summary::after { rotate: 45deg; }
.faq__item p { padding: 0 40px 26px 0; color: var(--muted); }

/* ── Pricing */
.pricing { background: var(--ivory); }
.pricing__list { display: grid; gap: 90px; }
.pricing__row { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.pricing__row--flip .pricing__img { order: 2; }
.pricing__img { position: relative; overflow: hidden; aspect-ratio: 4 / 5; background: var(--champagne); }
.pricing__img img { width: 100%; height: 100%; object-fit: cover; }
.pkg { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 46px 44px 40px; background: #fff; border: 1px solid var(--line); }
.pkg h3 { font-size: clamp(34px, 3.2vw, 46px); }
.pkg__price { font-family: var(--serif); font-size: 64px; font-weight: 300; line-height: 1; margin: 16px 0 6px; color: var(--gold-text); }
.pkg__where { font-size: 11px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.pkg__for { color: var(--muted); margin: 14px 0 6px; }
.pkg__label { margin-top: 20px; font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--ink); }
.pkg__label + * { margin-top: 10px; }
.plain { display: grid; gap: 5px; font-size: 15px; color: var(--muted); }
.pkg__note { font-size: 15px; color: var(--muted); }
.pkg__process { display: flex; gap: 12px; margin: 26px 0 4px; padding: 16px 18px; background: var(--ivory-2); font-size: 14px; color: var(--muted); }
.pkg__process svg { width: 18px; height: 18px; color: var(--gold); margin-top: 3px; }
.pkg__process a { color: var(--ink); border-bottom: 1px solid currentColor; }
.pkg > .btn { margin-top: 28px; align-self: flex-start; }
.pkg__tag { position: absolute; top: -13px; left: 44px; padding: 7px 14px; background: linear-gradient(135deg, #f1d79f, #d8ae62); color: var(--charcoal); font-size: 10.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.pkg--featured { background: var(--charcoal); color: var(--on-dark); border-color: var(--charcoal); box-shadow: 0 30px 70px rgba(20, 18, 16, .25); }
.pkg--featured .pkg__price { color: var(--glow-2); text-shadow: 0 0 30px rgba(242, 189, 92, .3); }
.pkg--featured .pkg__for, .pkg--featured .plain, .pkg--featured .pkg__note, .pkg--featured .pkg__where { color: var(--on-dark-2); }
.pkg--featured .pkg__label { color: var(--on-dark); }
.pkg--featured .pkg__process { background: rgba(255, 255, 255, .05); color: var(--on-dark-2); }
.pkg--featured .pkg__process a { color: var(--on-dark); }
.proof { background: var(--charcoal); color: var(--on-dark); }
.proof__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
.proof .kicker { color: var(--glow); }
.proof h2 { font-size: clamp(42px, 4.6vw, 64px); color: #fbf4e8; margin-bottom: 24px; }
.proof h2 em { color: var(--glow-2); }
.proof__steps { display: grid; gap: 1px; background: rgba(242, 189, 92, .16); border: 1px solid rgba(242, 189, 92, .16); counter-reset: p; }
.proof__steps li { counter-increment: p; display: grid; grid-template-columns: 48px 1fr; gap: 4px 16px; padding: 24px 26px; background: var(--charcoal); }
.proof__steps li::before { content: counter(p, decimal-leading-zero); grid-row: span 2; font-family: var(--serif); font-size: 30px; color: var(--glow); line-height: 1; }
.proof__steps strong { font-family: var(--serif); font-weight: 400; font-size: 25px; color: #fbf4e8; }
.proof__steps span { color: var(--on-dark-2); font-size: 15px; }
.proof__note { margin-top: 50px; text-align: center; font-family: var(--serif); font-style: italic; font-size: 21px; color: var(--on-dark-2); }
.proof__note a { color: var(--glow-2); border-bottom: 1px solid currentColor; }

/* ── About */
.about-hero { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; position: relative; z-index: 1; }
.about-hero__photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 20%; border-radius: 260px 260px 0 0; box-shadow: 0 40px 90px rgba(0, 0, 0, .5), 0 0 0 1px rgba(242, 189, 92, .25); }
.page-hero--about h1 { font-size: clamp(46px, 5.6vw, 84px); }
.about-story { background: var(--ivory); }
.about-story__inner { max-width: 820px; }
.about-story p { font-size: 19px; color: var(--muted); margin-bottom: 26px; }
.about-story__first { font-family: var(--serif); font-size: 30px !important; line-height: 1.45; color: var(--ink) !important; }
.about-story__first::first-letter { float: left; font-size: 92px; line-height: .8; padding: 8px 12px 0 0; color: var(--gold-text); }
.about-story__closing { margin-top: 50px !important; font-family: var(--serif); font-style: italic; font-size: clamp(30px, 3.4vw, 44px) !important; line-height: 1.3; color: var(--ink) !important; text-align: center; }
.about-personal { background: var(--ivory-2); }
.personal { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 50px; }
.personal li { padding: 34px 28px; background: var(--ivory); border: 1px solid var(--line); }
.personal__dot { display: block; width: 9px; height: 9px; border-radius: 50%; background: var(--glow); box-shadow: 0 0 14px 3px rgba(242, 189, 92, .7); margin-bottom: 20px; animation: blink 3.4s infinite; }
.personal li:nth-child(2) .personal__dot { animation-delay: -1s; } .personal li:nth-child(3) .personal__dot { animation-delay: -2s; }
.personal h3 { font-size: 28px; margin-bottom: 10px; }
.personal p { color: var(--muted); font-size: 15px; }

/* ── Reviews page */
.reviews-page { background: var(--ivory-2); }
.review-hero { max-width: 860px; margin: 0 auto 60px; }
.review-hero .review blockquote { font-size: clamp(24px, 2.6vw, 32px); }
.review-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; margin-top: 60px; text-align: center; }
.review-cta p { flex-basis: 100%; color: var(--muted); font-size: 14px; }
.review-cta svg { width: 17px; height: 17px; }
[data-filtered] > div.out { display: none; }

/* ── Contact */
.next { background: var(--ivory); }
.next__steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.next__steps li { padding: 36px 30px; background: #fff; border: 1px solid var(--line); }
.next__steps span { display: block; font-family: var(--serif); font-size: 44px; font-weight: 300; color: var(--gold); margin-bottom: 14px; line-height: 1; }
.next__steps h3 { font-size: 28px; margin-bottom: 10px; }
.next__steps p { color: var(--muted); }

/* ── Journal + articles */
.journal { background: var(--ivory); }
.page-hero--journal h1 { font-size: clamp(60px, 9vw, 140px); }
.art-hero { position: relative; overflow: hidden; isolation: isolate; color: var(--on-dark); min-height: 86vh; display: flex; align-items: flex-end; padding: 200px 0 90px; background: var(--charcoal); }
.art-hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; animation: kenburns 30s ease-in-out infinite alternate; }
.art-hero__copy { position: relative; z-index: 1; max-width: 1000px; }
.art-hero h1 { font-size: clamp(44px, 6vw, 88px); font-weight: 300; color: #fdf7ec; margin: 22px 0 22px; }
.art-hero__meta { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--on-dark-2); }
.art-body { max-width: 760px; margin: 0 auto; padding: 100px 28px 40px; font-size: 18px; line-height: 1.85; }
.art-body > p, .art-body > ul, .art-body > ol { margin-bottom: 26px; color: #3d3630; }
.art-body .j-lead { font-family: var(--serif); font-size: 29px; line-height: 1.5; color: var(--ink); }
.art-body .j-lead::first-letter { float: left; font-size: 96px; line-height: .8; padding: 8px 12px 0 0; color: var(--gold-text); }
.art-body h2 { font-size: clamp(34px, 3.4vw, 46px); margin: 60px 0 20px; }
.art-body h3 { font-size: 30px; margin: 40px 0 14px; }
.art-body a { color: var(--gold-text); border-bottom: 1px solid currentColor; }
.art-body ul li { position: relative; padding-left: 26px; margin-bottom: 10px; }
.art-body ul li::before { content: ''; position: absolute; left: 4px; top: .78em; width: 7px; height: 7px; border-radius: 50%; background: var(--glow); box-shadow: 0 0 10px rgba(242, 189, 92, .8); }
.art-body ol { counter-reset: o; }
.art-body ol li { counter-increment: o; position: relative; padding-left: 36px; margin-bottom: 10px; }
.art-body ol li::before { content: counter(o) '.'; position: absolute; left: 0; font-family: var(--serif); font-size: 22px; color: var(--gold-text); }
.art-body blockquote { margin: 50px 0; padding: 10px 0 10px 34px; border-left: 1px solid var(--gold); font-family: var(--serif); font-style: italic; font-size: 32px; line-height: 1.4; color: var(--ink); }
.art-body figure { margin: 50px 0; }
.art-body figure img { width: 100%; }
.art-body figcaption { margin-top: 12px; font-size: 13px; color: var(--muted); text-align: center; }
.art-body .j-wide { width: min(1160px, calc(100vw - 40px)); margin-left: 50%; transform: translateX(-50%); }
.art-body .j-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; width: min(1160px, calc(100vw - 40px)); margin: 50px 0 50px 50%; transform: translateX(-50%); }
.art-body .j-duo figure { margin: 0; }
.art-body .j-duo img { height: 100%; object-fit: cover; aspect-ratio: 4 / 5; }
.art-body .j-video { position: relative; aspect-ratio: 16 / 9; margin: 40px 0; }
.art-body .j-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.art-body .egallery { width: min(1160px, calc(100vw - 40px)); margin: 50px 0 50px 50%; transform: translateX(-50%); }
.art-foot { margin-top: 70px; padding-top: 34px; border-top: 1px solid var(--line); display: grid; gap: 34px; font-size: 15px; }
.art-share { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; }
.art-share span { font-size: 11px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.art-share a { border: 0; font-size: 12px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.art-share a:hover { color: var(--gold-text); }
.art-author { display: flex; gap: 20px; align-items: center; padding: 24px; background: var(--ivory-2); }
.art-author img { width: 78px; height: 78px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; flex: none; }
.art-author strong { font-family: var(--serif); font-size: 24px; font-weight: 400; }
.art-author p { margin: 2px 0 0; color: var(--muted); }

/* ── Lightbox */
.lightbox { position: fixed; inset: 0; z-index: 200; display: grid; grid-template-columns: 80px 1fr 80px; align-items: center; background: rgba(14, 12, 11, .97); backdrop-filter: blur(6px); animation: fade .35s; }
@keyframes fade { from { opacity: 0; } }
.lightbox figure { grid-column: 2; display: grid; justify-items: center; gap: 14px; height: 100vh; height: 100dvh; padding: 30px 0; align-content: center; min-width: 0; }
.lightbox img { max-width: 100%; max-height: calc(100dvh - 100px); object-fit: contain; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); animation: fade .45s; }
.lightbox figcaption { color: var(--on-dark-2); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; text-align: center; max-width: 80vw; }
.lightbox__nav, .lightbox__close { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; border: 1px solid rgba(242, 236, 227, .2); background: rgba(255, 255, 255, .04); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; transition: background .2s, border-color .2s; justify-self: center; }
.lightbox__nav svg { width: 24px; height: 24px; }
.lightbox__nav:hover, .lightbox__close:hover { background: rgba(242, 189, 92, .2); border-color: var(--glow); }
.lightbox__close { position: absolute; top: 20px; right: 20px; z-index: 2; }

/* ── Footer */
.footer { position: relative; overflow: hidden; background: #131210; color: var(--on-dark-2); font-size: 14.5px; padding-top: 90px; }
.footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 44px; padding-bottom: 60px; }
.footer__logo { width: 180px; height: auto; margin-bottom: 20px; filter: drop-shadow(0 0 24px rgba(242, 189, 92, .2)); }
.footer__tag { font-family: var(--serif); font-style: italic; font-size: 24px; color: var(--on-dark); margin-bottom: 12px; }
.footer p { max-width: 330px; }
.footer nav, .footer__grid > div:last-child { display: grid; align-content: start; gap: 10px; }
.footer strong { font-size: 11px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--on-dark); margin-bottom: 8px; }
.footer a { transition: color .2s; overflow-wrap: anywhere; }
.footer a:hover { color: var(--glow-2); }
.footer__row { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 24px; padding-bottom: 28px; border-top: 1px solid rgba(242, 236, 227, .08); font-size: 12.5px; }

/* ── Tablet */
@media (max-width: 1100px) {
  .nav { position: fixed; inset: 0; z-index: -1; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: 110px 32px 40px; background: rgba(20, 18, 16, .98); color: var(--on-dark); opacity: 0; visibility: hidden; transition: opacity .35s, visibility .35s; overflow-y: auto; text-transform: none; letter-spacing: 0; }
  .nav.open { opacity: 1; visibility: visible; }
  .nav > a, .drop summary { padding: 15px 0; border-bottom: 1px solid rgba(242, 236, 227, .08); font-family: var(--serif); font-size: 32px; font-weight: 400; }
  .nav > a::after, .drop summary::before { display: none; }
  .nav__cta { display: block; color: var(--glow-2); }
  .drop summary { display: flex; justify-content: space-between; }
  .drop__panel { position: static; transform: none; width: auto; grid-template-columns: repeat(4, 1fr); margin: 12px 0 8px; background: none; border: 0; padding: 0; box-shadow: none; animation: none; }
  .header__book { margin-left: auto; }
  .menu { display: block; }
  .xp__grid, .meet__grid, .book__grid, .about-hero, .svc-intro__grid, .svc-how__grid, .xp-story__grid, .faq__grid, .proof__grid { grid-template-columns: 1fr; gap: 56px; }
  .spec { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 300px; }
  .spec__tile { grid-column: auto !important; grid-row: auto !important; }
  .spec__tile--1 { grid-column: 1 / 3 !important; grid-row: span 2 !important; }
  .spec__tile--7 { grid-column: 1 / 3 !important; }
  .spec__text > span { opacity: 1; transform: none; }
  .ed { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 260px; }
  .ed__item, .ed__quote { grid-column: auto !important; grid-row: auto !important; }
  .ed__item--1 { grid-row: span 2 !important; }
  .ed__quote { grid-column: 1 / 3 !important; padding: 40px; }
  .pillars--light, .personal { grid-template-columns: repeat(2, 1fr); }
  .reviews__grid { grid-template-columns: repeat(2, 1fr); }
  .carousel__slide { flex-basis: calc((100% - 20px) / 2); }
  .jgrid { grid-template-columns: repeat(2, 1fr); }
  .jcard--big { grid-template-columns: 1fr; gap: 26px; }
  .pricing__row { grid-template-columns: 1fr; gap: 0; }
  .pricing__row--flip .pricing__img { order: 0; }
  .pricing__img { aspect-ratio: 16 / 10; }
  .pricing__img img { object-position: 50% 22%; } /* keep faces in the wide crop */
  .pf__row { grid-template-columns: 1fr; }
  .pf__row:nth-child(even) .pf__img { order: 0; }
  .pf__img { aspect-ratio: 16 / 10; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .about-hero__photo, .meet__photo { max-width: 420px; }
  .meet__photo { margin: 0 auto; }
  .xp-story__photos { height: 560px; max-width: 640px; }
  .next__steps { grid-template-columns: 1fr; }
}

/* ── Phone */
@media (max-width: 760px) {
  body { font-size: 16px; }
  .wrap { padding: 0 20px; }
  .header__row, .header.scrolled .header__row { height: 66px; gap: 10px; }
  .logo__word { font-size: 25px; }
  .logo__sub { display: none; }
  .logo__icon { height: 34px; }
  .header__book { padding: 10px 14px; font-size: 10.5px; letter-spacing: .16em; }
  /* the opening on a phone: one photograph at a time, gently cross-fading */
  .hero__photos { display: block; }
  .hero__photo { position: absolute; inset: 0; opacity: 0; animation: heroFade 18s infinite; }
  .hero__photo--1 { animation-delay: -1s; opacity: 1; }
  .hero__photo--2 { animation-delay: 5s; }
  .hero__photo--3 { animation-delay: 11s; }
  @keyframes heroFade { 0% { opacity: 0; } 4% { opacity: 1; } 33% { opacity: 1; } 38% { opacity: 0; } 100% { opacity: 0; } }
  .hero h1 { font-size: clamp(42px, 12.4vw, 66px); }
  .review--big blockquote { font-size: 20px; }
  .review { padding: 30px 24px 24px; }
  .hero__lead { font-size: 16.5px; }
  .hero__actions { width: 100%; }
  .hero__actions .btn { flex: 1 1 100%; }
  .hero__scroll { display: none; }
  .marquee i { font-size: 24px; }
  .section, .book { padding: 90px 0; }
  .statement { padding: 100px 0; }
  .book--page { padding-top: 120px; }
  .section__head { margin-bottom: 40px; }
  .lead { font-size: 17px; }
  .lead--ink { font-size: 22px; }
  /* the first (Weddings) row is taller; giving the tile a height of its own let the next tile cover its words */
  .spec { grid-template-columns: 1fr; grid-template-rows: 460px; grid-auto-rows: 340px; gap: 10px; }
  .spec__tile--1, .spec__tile--7 { grid-column: auto !important; grid-row: auto !important; }
  .ed { grid-auto-rows: 200px; gap: 8px; }
  .filmstrip__item { height: 210px; }
  .pillars, .pillars--light, .personal, .reviews__grid, .jgrid { grid-template-columns: 1fr; }
  .carousel__slide { flex-basis: 88%; }
  .row2 { grid-template-columns: 1fr; }
  .inquiry { padding: 28px 20px; }
  .inquiry .btn { justify-self: stretch; }
  .page-hero { padding: 140px 0 60px; min-height: 72vh; }
  .page-hero__shade { background: linear-gradient(180deg, rgba(20, 18, 16, .5) 0%, rgba(20, 18, 16, .65) 45%, rgba(20, 18, 16, .94) 100%); }
  .page-hero--plain { padding: 130px 0 70px; }
  .spread { grid-template-columns: 1fr 1fr; grid-auto-rows: 220px; gap: 8px; margin-bottom: 8px; }
  .spread .spread__item { grid-column: auto !important; grid-row: auto !important; }
  .spread .spread__item--1 { grid-column: 1 / 3 !important; grid-row: span 2 !important; }
  .masonry { columns: 2; column-gap: 8px; }
  .masonry__item { margin-bottom: 8px; }
  .pager { grid-template-columns: 1fr; padding-bottom: 80px; }
  .pager a:last-child { text-align: left; }
  .pkg { padding: 34px 24px 30px; }
  .pkg__price { font-size: 54px; }
  .pkg__tag { left: 24px; }
  .pf__text { padding: 32px 24px; }
  .xp-story__photos { height: 440px; }
  .meet__badge { right: 0; }
  .about-story__first { font-size: 25px !important; }
  .faq__item summary { font-size: 22px; }
  .timeline ol::before { left: 23px; }
  .timeline li { grid-template-columns: 48px 1fr; gap: 18px; }
  .timeline__n { width: 48px; height: 48px; font-size: 19px; }
  .timeline h3 { font-size: 26px; margin-top: 6px; }
  .art-hero { min-height: 74vh; padding: 140px 0 60px; }
  .art-body { padding-top: 64px; font-size: 17px; }
  .art-body .j-lead { font-size: 24px; }
  .art-body blockquote { font-size: 26px; padding-left: 22px; }
  .art-body .j-duo { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr; }
  .drop__panel { grid-template-columns: repeat(2, 1fr); }
  .mark--book { width: 170vw; right: -70vw; top: auto; bottom: -6%; --ty: 0%; --o: .06; --lights: .45; }
  .mark--page { width: 150vw; right: -75vw; top: 38%; --o: .07; --lights: .45; }
  .mark--left { left: -60vw; top: 22%; }
  .lightbox { grid-template-columns: 0 1fr 0; }
  .lightbox__nav { position: absolute; bottom: 22px; }
  .lightbox__nav--prev { left: calc(50% - 66px); } .lightbox__nav--next { right: calc(50% - 66px); }
  .lightbox figure { padding: 60px 8px 96px; }
  .lightbox img { max-height: calc(100dvh - 176px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .reveal { opacity: 1; translate: none; }
  .hero__photo--1 { opacity: 1 !important; }
  .carousel__track { scroll-behavior: auto; }
}

/* ── Report / Request (System Requests; TEST PERIOD — take out before launch) */
.rq-btn { flex: none; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; border-radius: 999px; cursor: pointer; color: inherit;
  font: 600 13px/1 var(--sans); letter-spacing: .03em; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .45); backdrop-filter: blur(8px);
  transition: background .25s, box-shadow .25s, transform .25s var(--ease); margin-left: 4px; position: relative; }
.rq-btn svg { width: 17px; height: 17px; color: var(--glow); }
.rq-btn::after { content: ''; position: absolute; top: 6px; right: 7px; width: 7px; height: 7px; border-radius: 50%; background: var(--glow-2); box-shadow: 0 0 8px 2px var(--glow); animation: blink 2.6s infinite; }
.rq-btn:hover { background: rgba(242, 189, 92, .14); box-shadow: inset 0 0 0 1px var(--glow), 0 0 24px rgba(242, 189, 92, .25); transform: translateY(-1px); }
body.rq-open { overflow: hidden; }
.rq { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 20px; }
.rq__back { position: absolute; inset: 0; background: rgba(10, 8, 6, .72); backdrop-filter: blur(6px); animation: fade .3s; }
.rq__win { position: relative; width: min(560px, 100%); max-height: calc(100dvh - 40px); overflow: auto; border-radius: 24px; color: var(--on-dark);
  background: radial-gradient(80% 60% at 100% 0%, #3a2a1c, transparent 70%), var(--night); box-shadow: 0 0 0 1px rgba(242, 189, 92, .25), 0 40px 100px rgba(0, 0, 0, .6); animation: rqIn .35s var(--ease); }
@keyframes rqIn { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.rq__head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 12px; padding: 22px 22px 6px 26px; background: linear-gradient(var(--night) 70%, transparent); }
.rq__head h2 { flex: 1; font-size: 28px; color: #fbf3e6; line-height: 1.1; }
.rq__x { width: 40px; height: 40px; flex: none; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .07); color: #fff; font-size: 24px; cursor: pointer; }
.rq__x:hover { background: rgba(242, 189, 92, .25); }
.rq__body { padding: 12px 26px 26px; }
.rq__form { display: grid; gap: 16px; }
.rq__kinds { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.rq__kind { display: flex; align-items: flex-start; gap: 12px; padding: 14px; border: 0; border-radius: 16px; text-align: left; cursor: pointer; color: var(--on-dark-2);
  background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(239, 230, 218, .14); font: 500 13px/1.35 var(--sans); transition: box-shadow .2s, background .2s; }
.rq__kind svg { width: 22px; height: 22px; flex: none; color: var(--on-dark-2); }
.rq__kind b { display: block; font-size: 15px; color: #fbf3e6; margin-bottom: 2px; }
.rq__kind.on { background: rgba(242, 189, 92, .12); box-shadow: inset 0 0 0 1.5px var(--glow); }
.rq__kind.on svg { color: var(--glow); }
.rq__field { display: grid; gap: 7px; }
.rq__field > span { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--on-dark-2); }
.rq__field small { font-size: 12px; color: var(--on-dark-2); }
.rq select, .rq textarea { width: 100%; padding: 13px 15px; border-radius: 12px; border: 1px solid rgba(239, 230, 218, .18); background: rgba(10, 8, 6, .4); color: #fbf3e6; font: 500 16px/1.45 var(--sans); }
.rq select option { color: #111; }
.rq textarea { resize: vertical; min-height: 120px; }
.rq select:focus, .rq textarea:focus { outline: 0; border-color: var(--glow); box-shadow: 0 0 0 4px rgba(242, 189, 92, .18); }
.rq__box { display: grid; gap: 12px; justify-items: start; padding: 14px; border-radius: 16px; background: rgba(255, 255, 255, .035); box-shadow: inset 0 0 0 1px rgba(239, 230, 218, .1); }
.rq__check { display: flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; cursor: pointer; }
.rq__check input { width: 20px; height: 20px; accent-color: var(--glow); }
.rq__preview { width: 100%; max-height: 220px; object-fit: contain; border-radius: 10px; background: #000; box-shadow: 0 0 0 1px rgba(239, 230, 218, .15); }
.rq__file { position: relative; overflow: hidden; color: var(--on-dark); box-shadow: inset 0 0 0 1.5px rgba(239, 230, 218, .25); }
.rq__file svg { width: 16px; height: 16px; color: var(--glow); }
.rq__file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.rq__loading { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--on-dark-2); }
.rq__spin { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(242, 189, 92, .25); border-top-color: var(--glow); animation: rqSpin .8s linear infinite; }
@keyframes rqSpin { to { transform: rotate(360deg); } }
.rq__warn { font-size: 14px; color: #ffcf8a; }
.rq__fine { font-size: 13px; color: var(--on-dark-2); }
.rq__link { background: none; border: 0; padding: 0; color: var(--glow-2); font: inherit; text-decoration: underline; cursor: pointer; }
.rq__pre { margin-top: 8px; padding: 10px 12px; border-radius: 10px; background: rgba(0, 0, 0, .35); font-size: 12px; white-space: pre-wrap; max-height: 140px; overflow: auto; }
.rq__error { padding: 10px 14px; border-radius: 12px; background: rgba(255, 120, 100, .12); color: #ffb4a8; font-size: 14px; }
.rq__row { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.rq__row .btn { min-width: 120px; }
.rq__row .btn--line { color: var(--on-dark); box-shadow: inset 0 0 0 1.5px rgba(239, 230, 218, .25); }
.rq__row .btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
.rq__sent { display: grid; justify-items: center; gap: 12px; text-align: center; padding: 26px 6px 6px; }
.rq__sent h3 { font-size: 34px; color: #fbf3e6; }
.rq__sent p { color: var(--on-dark-2); max-width: 380px; }
.rq__sent .rq__row { justify-content: center; margin-top: 10px; }
.rq__spark { width: 14px; height: 14px; border-radius: 50%; background: var(--glow-2); box-shadow: 0 0 20px 8px var(--glow), 0 0 60px 20px rgba(242, 189, 92, .4); animation: blink 2s infinite; margin-bottom: 12px; }
/* the requests list (inside the same window) */
.rq-count { position: absolute; top: -6px; right: -6px; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--glow-2), var(--glow)); color: var(--night); font: 800 11.5px/1 var(--sans); box-shadow: 0 0 12px rgba(242, 189, 92, .7); }
.rq-btn.has-new::after { display: none; }
.rq__seeall { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border: 0; border-radius: 14px; cursor: pointer; text-align: left; color: var(--on-dark);
  font: 600 14.5px/1.2 var(--sans); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(239, 230, 218, .12); transition: box-shadow .2s, background .2s; }
.rq__seeall:hover { background: rgba(242, 189, 92, .1); box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .5); }
.rq__seeall svg { width: 18px; height: 18px; color: var(--glow); }
.rq__seeall span { flex: 1; }
.rq__seeall b { padding: 3px 9px; border-radius: 999px; background: linear-gradient(135deg, var(--glow-2), var(--glow)); color: var(--night); font-size: 12px; }
.rq__seeall i { font-style: normal; font-size: 22px; color: var(--on-dark-2); }
.rq__list { display: grid; gap: 14px; }
.rq__listbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.rq__listbar .btn { color: var(--on-dark); box-shadow: inset 0 0 0 1.5px rgba(239, 230, 218, .25); }
.rq__listbar .btn svg { width: 16px; height: 16px; }
.rq__tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.rq__tabs::-webkit-scrollbar { display: none; }
.rq__tab { flex: none; padding: 8px 13px; border: 0; border-radius: 999px; cursor: pointer; color: var(--on-dark-2); font: 600 13px/1 var(--sans);
  background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(239, 230, 218, .14); }
.rq__tab small { opacity: .7; margin-left: 3px; }
.rq__tab.on { background: linear-gradient(135deg, var(--glow-2), var(--glow)); color: var(--night); box-shadow: none; }
.rq__empty { padding: 30px 10px; text-align: center; color: var(--on-dark-2); }
.rq__items { display: grid; gap: 12px; }
.rq__item { display: grid; gap: 9px; padding: 16px; border-radius: 16px; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(239, 230, 218, .12); }
.rq__item--new { box-shadow: inset 0 0 0 1px rgba(242, 189, 92, .45); }
.rq__item--done { opacity: .8; }
.rq__itemhead { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--on-dark-2); }
.rq__itemhead time { margin-left: auto; }
.rq__badge { padding: 3px 9px; border-radius: 999px; font-weight: 700; font-size: 11.5px; letter-spacing: .04em; }
.rq__badge--new { background: rgba(242, 189, 92, .2); color: var(--glow-2); }
.rq__badge--working { background: rgba(125, 190, 255, .16); color: #a9d2ff; }
.rq__badge--done { background: rgba(120, 220, 160, .14); color: #9fe2b8; }
.rq__kindtag { display: inline-flex; align-items: center; gap: 5px; }
.rq__kindtag svg { width: 14px; height: 14px; color: var(--glow); }
.rq__text { color: #fbf3e6; font-size: 15px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.rq__meta { font-size: 12.5px; color: var(--on-dark-2); }
.rq__done { font-size: 13px; color: #9fe2b8; }
.rq__item > .rq__link, .rq__item > .rq__loading { justify-self: start; }
.rq__shot { padding: 0; border: 0; background: #000; border-radius: 10px; overflow: hidden; cursor: zoom-in; justify-self: start; max-width: 100%; }
.rq__shot img { display: block; max-height: 150px; width: auto; max-width: 100%; }
.rq__shot.big { cursor: zoom-out; justify-self: stretch; }
.rq__shot.big img { max-height: none; width: 100%; }
.rq__itemacts { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.rq__itemacts .btn--line { color: var(--on-dark); box-shadow: inset 0 0 0 1.5px rgba(239, 230, 218, .25); }
.rq__itemacts .btn[disabled] { opacity: .5; }
.rq__sent .rq__link { margin-top: 6px; }
@media (max-width: 1100px) { .rq-btn { margin-left: auto; } .rq-btn ~ .header__book { margin-left: 0; } }
@media (max-width: 640px) {
  .rq-btn { width: 38px; height: 38px; padding: 0; justify-content: center; }
  .logo__word { font-size: 23px; }
  .logo__icon { height: 34px; }
  .logo { gap: 8px; }
  .header__row { gap: 8px; }
  .rq-btn span { display: none; }
  .rq-btn::after { top: 4px; right: 4px; }
  .rq { padding: 0; place-items: end stretch; }
  .rq__win { width: 100%; max-height: 92dvh; border-radius: 22px 22px 0 0; padding-bottom: env(safe-area-inset-bottom); }
  .rq__head { padding: 18px 16px 4px 20px; }
  .rq__head h2 { font-size: 24px; }
  .rq__body { padding: 10px 20px 22px; }
  .rq__kinds { grid-template-columns: 1fr; }
  .rq__row .btn { flex: 1; }
}

/* ── ERP shortcut (TEST PERIOD — take out before launch, with the Report / Request button) */
.erp-btn { text-decoration: none; }
.erp-btn::after { display: none; }
.nav__erp { display: none; }
@media (max-width: 1100px) { .erp-btn { margin-left: auto; } .erp-btn + .rq-btn { margin-left: 4px; } .nav__erp { display: block; color: var(--on-dark-2); font-size: 22px !important; } }
@media (max-width: 760px) { .erp-btn { display: none; } .erp-btn + .rq-btn { margin-left: auto; } }

/* ── Journal & reviews additions (owner 2026-10-30): reviews keep their paragraphs, article subtitle, a client's Google
   review inside a story, and the closing invitation buttons */
.review blockquote { white-space: pre-line; overflow-wrap: anywhere; }
.art-hero__sub { font-family: var(--serif); font-style: italic; font-size: clamp(21px, 2.3vw, 29px); line-height: 1.4; color: var(--on-dark); max-width: 780px; margin: -4px 0 24px; }
.art-body .j-review { position: relative; margin: 56px 0; padding: 40px 38px 30px; background: #fff; border: 1px solid var(--line); box-shadow: 0 26px 50px rgba(60, 45, 25, .07); }
.art-body .j-review__mark { position: absolute; right: 28px; top: 4px; font-family: var(--serif); font-size: 110px; line-height: 1; color: var(--champagne); }
.art-body .j-review__stars { color: var(--gold); letter-spacing: .2em; font-size: 15px; }
.art-body .j-review blockquote { margin: 14px 0 22px; padding: 0; border: 0; font-style: normal; font-size: 26px; line-height: 1.5; }
.art-body .j-review figcaption { margin: 0; text-align: left; font-size: 12.5px; color: var(--muted); }
.art-body .j-review figcaption strong { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); margin-right: 10px; }
.art-body .j-sign { font-family: var(--serif); font-style: italic; font-size: 26px; line-height: 1.4; color: var(--ink); }
.art-body .j-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 34px 0 10px; }
.art-body .j-cta a { border-bottom: 0; }
.art-body .j-cta .btn--line { color: var(--ink); }
.art-body .j-cta .btn--gold { color: var(--charcoal); }
@media (max-width: 640px) {
  .art-body .j-review { padding: 32px 22px 24px; }
  .art-body .j-review blockquote { font-size: 22px; }
  .art-body .j-cta .btn { flex: 1 1 100%; justify-content: center; }
}

/* ── iPhone fit (owner 2026-10-30: text running past the right edge on iPhone). Safari enlarges text by itself in landscape
   unless told not to, and only clipping the body still lets the page slide sideways there; long words may break rather than
   push past the edge. Nothing here changes the desktop layout. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }
h1, h2, h3, h4, p, li, blockquote, figcaption, dd, dt, label, .eyebrow, .kicker, .lead { overflow-wrap: break-word; }
/* (owner 2026-10-31, iPhone 16 Pro: the opening words still ran off the right edge.) Safari let the centred grid's one
   column grow to the text's full length; pin it to the screen width so the words wrap inside it. */
.hero__copy, .inquiry__done { grid-template-columns: minmax(0, 1fr); }
.hero__copy > *, .inquiry__done > * { min-width: 0; }
/* The real culprit: a button's words never break, so with Safari's larger text the gold button outgrew the screen and
   (the box being a flex item) dragged the whole opening wider with it. Let the box shrink and long button words wrap. */
.hero__copy { min-width: 0; }
@media (max-width: 640px) {
  .btn { white-space: normal; text-align: center; line-height: 1.4; }
  .hero .eyebrow { letter-spacing: .22em; line-height: 1.6; }
  /* the phone .wrap rule zeroed this, so a tall opening (larger text) slid up under the header; keep it clear */
  .hero__copy { padding-top: 96px; padding-bottom: 56px; }
}
@media (max-width: 380px) {
  /* very narrow (or Safari's larger text): tighten the two opening buttons so each stays on one line */
  .hero__actions .btn { padding-left: 16px; padding-right: 16px; letter-spacing: .14em; gap: 8px; }
}