@font-face {

  font-family: "Instrument Serif";

  font-style: normal;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/instrument-serif-ext.woff2") format("woff2");

  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family: "Instrument Serif";

  font-style: normal;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/instrument-serif.woff2") format("woff2");

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family: "Instrument Serif";

  font-style: italic;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/instrument-serif-italic-ext.woff2") format("woff2");

  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family: "Instrument Serif";

  font-style: italic;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/instrument-serif-italic.woff2") format("woff2");

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 300;

  font-display: swap;

  src: url("../fonts/sora-300-ext.woff2") format("woff2");

  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 300;

  font-display: swap;

  src: url("../fonts/sora-300.woff2") format("woff2");

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/sora-400-ext.woff2") format("woff2");

  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 400;

  font-display: swap;

  src: url("../fonts/sora-400.woff2") format("woff2");

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 500;

  font-display: swap;

  src: url("../fonts/sora-500-ext.woff2") format("woff2");

  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;

}

@font-face {

  font-family: "Sora";

  font-style: normal;

  font-weight: 500;

  font-display: swap;

  src: url("../fonts/sora-500.woff2") format("woff2");

  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;

}



:root {

  --coal: #0f0d0b;

  --coal-soft: #1a1612;

  --coal-lift: #24201b;

  --ash: #e6e1d8;

  --ash-soft: #f0ebe3;

  --ink: #161310;

  --muted: #6a6258;

  --muted-light: #b8aea0;

  --amber: #b8894a;

  --amber-soft: #d0ae74;

  --amber-deep: #8e6a38;

  --line: rgba(22, 19, 16, .12);

  --line-dark: rgba(240, 235, 227, .12);

  --serif: "Instrument Serif", "Times New Roman", serif;

  --sans: "Sora", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --ease: cubic-bezier(.22, 1, .36, 1);

  --ease-out: cubic-bezier(.16, 1, .3, 1);

  --header-h: 72px;

  --shadow: 0 30px 80px -40px rgba(15, 13, 11, .55);

}



*,

*::before,

*::after { box-sizing: border-box; }



html { scroll-behavior: smooth; }



body {

  margin: 0;

  background: var(--ash-soft);

  color: var(--ink);

  font: 300 16px/1.75 var(--sans);

  -webkit-font-smoothing: antialiased;

  overflow-x: hidden;

}



body.menu-open,

body.lightbox-open { overflow: hidden; }



img { display: block; width: 100%; height: auto; }

a { color: inherit; text-decoration: none; }

button, input, textarea { font: inherit; }

button { color: inherit; }



h1, h2, h3, h4, p { margin-top: 0; }

h1, h2, h3, h4 {

  font-family: var(--serif);

  font-weight: 400;

  line-height: 1.05;

  letter-spacing: -.01em;

}



p:last-child { margin-bottom: 0; }

::selection { background: var(--amber); color: white; }



:focus-visible {

  outline: 2px solid var(--amber);

  outline-offset: 4px;

}



.skip-link {

  position: fixed;

  top: 12px;

  left: 12px;

  z-index: 2000;

  transform: translateY(-150%);

  padding: 10px 16px;

  background: var(--ash-soft);

  color: var(--ink);

  transition: transform .2s;

}

.skip-link:focus { transform: none; }



.container {

  width: min(1180px, calc(100% - 40px));

  margin-inline: auto;

}

.container--narrow {

  width: min(760px, calc(100% - 40px));

  margin-inline: auto;

}



.section { padding: clamp(72px, 12vw, 140px) 0; }

.section--compact { padding: clamp(56px, 8vw, 96px) 0; }

.section--paper { background: var(--ash-soft); }

.section--tint { background: var(--ash); }

.section--dark {

  background:

    radial-gradient(120% 80% at 10% 0%, rgba(184, 137, 74, .14), transparent 55%),

    var(--coal);

  color: var(--ash-soft);

}



.eyebrow {

  display: inline-block;

  margin-bottom: 18px;

  color: var(--amber);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .28em;

  text-transform: uppercase;

}



.section-heading {

  max-width: 720px;

  margin: 0 auto clamp(40px, 6vw, 72px);

  text-align: center;

}

.section-heading h2 {

  margin-bottom: 16px;

  font-size: clamp(2.4rem, 7vw, 4.2rem);

}

.section-heading p {

  color: var(--muted);

  font-size: 1.02rem;

}

.section-heading p + p { margin-top: 1em; }

.section--dark .section-heading p { color: var(--muted-light); }

.centered-copy { text-align: center; }

.centered-copy p { color: var(--muted); }



.rule {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin: 20px auto;

  color: var(--amber);

  font-size: .7rem;

  letter-spacing: .3em;

}

.rule::before,

.rule::after {

  content: "";

  width: 36px;

  height: 1px;

  background: currentColor;

  opacity: .55;

}



.btn {

  display: inline-flex;

  min-height: 48px;

  align-items: center;

  justify-content: center;

  gap: 10px;

  padding: 12px 26px;

  border: 1px solid currentColor;

  background: transparent;

  color: inherit;

  cursor: pointer;

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .18em;

  text-transform: uppercase;

  transition: background .4s var(--ease), border-color .4s, color .4s, transform .4s var(--ease);

}

.btn:hover { transform: translateY(-2px); }

.btn--gold {

  border-color: var(--amber);

  background: var(--amber);

  color: white;

}

.btn--gold:hover {

  border-color: var(--amber-deep);

  background: var(--amber-deep);

  color: white;

}

.btn--light {

  border-color: rgba(240, 235, 227, .55);

  color: var(--ash-soft);

}

.btn--light:hover {

  background: var(--ash-soft);

  color: var(--coal);

}

.btn--ink {

  border-color: var(--ink);

  color: var(--ink);

}

.btn--ink:hover {

  background: var(--ink);

  color: var(--ash-soft);

}



.text-link {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  margin-top: 8px;

  color: var(--amber);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .18em;

  text-transform: uppercase;

}

.text-link::after {

  content: "→";

  font-size: 1rem;

  transition: transform .35s var(--ease);

}

.text-link:hover::after { transform: translateX(6px); }



/* Navigation */

.site-header {

  position: fixed;

  inset: 0 0 auto;

  z-index: 1000;

  border-bottom: 1px solid transparent;

  color: var(--ash-soft);

  transition: background .4s, color .4s, border-color .4s, backdrop-filter .4s;

}

.site-header.is-scrolled,

.site-header.header--solid {

  background: rgba(15, 13, 11, .88);

  border-color: var(--line-dark);

  color: var(--ash-soft);

  backdrop-filter: blur(16px);

  -webkit-backdrop-filter: blur(16px);

}

body.menu-open .site-header {

  background: var(--coal);

  border-color: var(--line-dark);

  color: var(--ash-soft);

}



.nav {

  display: flex;

  min-height: var(--header-h);

  align-items: center;

  justify-content: space-between;

  gap: 24px;

}

.brand {

  position: relative;

  z-index: 1100;

  font: 400 clamp(1.15rem, 2.4vw, 1.45rem)/1 var(--serif);

  letter-spacing: .22em;

  white-space: nowrap;

}

.brand span { color: var(--amber-soft); }



.nav__links {

  display: flex;

  align-items: center;

  gap: clamp(12px, 1.8vw, 26px);

  margin: 0;

  padding: 0;

  list-style: none;

}

.nav__links a {

  position: relative;

  font-size: .66rem;

  font-weight: 500;

  letter-spacing: .16em;

  text-transform: uppercase;

}

.nav__links a:not(.btn)::after {

  content: "";

  position: absolute;

  right: 0;

  bottom: -7px;

  left: 0;

  height: 1px;

  background: var(--amber);

  transform: scaleX(0);

  transform-origin: left;

  transition: transform .35s var(--ease);

}

.nav__links a:hover::after,

.nav__links a[aria-current="page"]::after { transform: scaleX(1); }

.nav__links .btn {

  min-height: 40px;

  padding: 8px 16px;

  border-color: rgba(240, 235, 227, .45);

  color: var(--ash-soft);

}

.site-header.is-scrolled .nav__links .btn,

.site-header.header--solid .nav__links .btn {

  border-color: var(--amber);

  color: var(--amber-soft);

}

.nav__links .btn:hover,

.site-header.is-scrolled .nav__links .btn:hover,

.site-header.header--solid .nav__links .btn:hover {

  background: var(--amber);

  border-color: var(--amber);

  color: white;

}



.nav-toggle {

  display: none;

  position: relative;

  z-index: 1100;

  width: 46px;

  height: 46px;

  padding: 11px;

  border: 0;

  background: transparent;

  cursor: pointer;

}

.nav-toggle span {

  display: block;

  width: 100%;

  height: 1px;

  margin: 6px 0;

  background: currentColor;

  transition: transform .35s var(--ease), opacity .3s;

}

.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }

.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }

.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }



/* Heroes */

.hero,

.page-hero {

  position: relative;

  display: grid;

  min-height: 100svh;

  place-items: end stretch;

  overflow: hidden;

  color: var(--ash-soft);

}

.page-hero {

  min-height: min(720px, 78svh);

  place-items: center;

  text-align: center;

}

.page-hero--short { min-height: min(560px, 68svh); }



.hero__media,

.page-hero__media {

  position: absolute;

  inset: 0;

  overflow: hidden;

}

.hero__media img,

.page-hero__media img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: center 40%;

  transform: scale(1.04);

  will-change: transform;

}

.hero__media img {

  object-position: 58% 36%;

}



@media (max-width: 720px) {

  .hero__media img {

    object-position: center 28%;

    transform: none;

  }

  .hero.is-ready .hero__media img {

    animation: none;

  }

}

.page-hero__media--portrait img { object-position: center 66%; }



.hero.is-ready .hero__media img {

  animation: hero-ken 22s var(--ease-out) forwards;

}

.page-hero.is-ready .page-hero__media img {

  animation: hero-ken 18s var(--ease-out) forwards;

}



@keyframes hero-ken {

  from { transform: scale(1.04); }

  to { transform: scale(1); }

}



.hero__media::after,

.page-hero__media::after {

  content: "";

  position: absolute;

  inset: 0;

  background:

    linear-gradient(180deg, rgba(15, 13, 11, .35) 0%, rgba(15, 13, 11, .15) 35%, rgba(15, 13, 11, .78) 100%),

    radial-gradient(80% 60% at 70% 20%, rgba(184, 137, 74, .18), transparent 60%);

}



.hero__grain,

.page-hero__grain {

  position: absolute;

  inset: 0;

  z-index: 1;

  opacity: .18;

  pointer-events: none;

  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

  mix-blend-mode: soft-light;

}



.hero__content {

  position: relative;

  z-index: 2;

  width: min(920px, calc(100% - 40px));

  margin: 0 auto;

  padding: 0 0 clamp(72px, 12vw, 110px);

}

.page-hero__content {

  position: relative;

  z-index: 2;

  width: min(860px, calc(100% - 40px));

  padding-top: var(--header-h);

}



.hero__brand {

  margin: 0 0 18px;

  font: 400 clamp(3.4rem, 14vw, 6.8rem)/.92 var(--serif);

  letter-spacing: .06em;

  text-transform: uppercase;

  text-shadow: 0 18px 60px rgba(0, 0, 0, .45);

}

.hero__brand span { color: var(--amber-soft); }



.hero h1 {

  margin: 0 0 16px;

  max-width: 16ch;

  font-size: clamp(1.55rem, 4.2vw, 2.35rem);

  font-family: var(--sans);

  font-weight: 300;

  letter-spacing: .04em;

  line-height: 1.25;

  color: #f4efe7;

}

.hero__lead {

  max-width: 34ch;

  margin: 0 0 28px;

  color: #d8cfc3;

  font-size: clamp(.95rem, 2.2vw, 1.08rem);

}

.hero__actions {

  display: flex;

  flex-wrap: wrap;

  gap: 12px;

}



.hero__scroll {

  position: absolute;

  right: clamp(20px, 4vw, 40px);

  bottom: clamp(28px, 5vw, 48px);

  z-index: 2;

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 10px;

  color: rgba(240, 235, 227, .7);

  font-size: .58rem;

  letter-spacing: .22em;

  text-transform: uppercase;

}

.hero__scroll::after {

  content: "";

  width: 1px;

  height: 42px;

  background: linear-gradient(180deg, var(--amber-soft), transparent);

  animation: scroll-pulse 2.2s var(--ease) infinite;

}



@keyframes scroll-pulse {

  0%, 100% { transform: scaleY(.55); opacity: .4; transform-origin: top; }

  50% { transform: scaleY(1); opacity: 1; transform-origin: top; }

}



.hero.is-ready .hero__content > *,

.page-hero.is-ready .page-hero__content > * {

  opacity: 0;

  transform: translateY(28px);

  animation: rise-in .9s var(--ease-out) forwards;

}

.hero.is-ready .hero__content > *:nth-child(1),

.page-hero.is-ready .page-hero__content > *:nth-child(1) { animation-delay: .15s; }

.hero.is-ready .hero__content > *:nth-child(2),

.page-hero.is-ready .page-hero__content > *:nth-child(2) { animation-delay: .28s; }

.hero.is-ready .hero__content > *:nth-child(3),

.page-hero.is-ready .page-hero__content > *:nth-child(3) { animation-delay: .4s; }

.hero.is-ready .hero__content > *:nth-child(4),

.page-hero.is-ready .page-hero__content > *:nth-child(4) { animation-delay: .52s; }



@keyframes rise-in {

  to { opacity: 1; transform: none; }

}



.page-hero h1 {

  margin-bottom: 16px;

  font-size: clamp(2.8rem, 9vw, 5.6rem);

}

.page-hero p {

  max-width: 38ch;

  margin-inline: auto;

  color: #d9d0c4;

  font-size: 1.05rem;

}



/* Nature / Wildlife */

.page-hero--nature .page-hero__media {

  background:

    radial-gradient(90% 70% at 78% 18%, rgba(90, 118, 78, .38), transparent 55%),

    radial-gradient(70% 55% at 14% 82%, rgba(184, 137, 74, .14), transparent 50%),

    linear-gradient(165deg, #1a2218 0%, #0f0d0b 48%, #161310 100%);

}

.page-hero--nature .page-hero__media::after {

  background:

    linear-gradient(180deg, rgba(15, 13, 11, .28) 0%, rgba(15, 13, 11, .1) 40%, rgba(15, 13, 11, .74) 100%);

}



.nature-aside {

  padding: clamp(28px, 4vw, 40px);

  border: 1px solid var(--line);

  background: rgba(255, 255, 255, .32);

}

.nature-aside__label {

  margin: 0 0 10px;

  color: var(--amber);

  font: 500 .72rem/1 var(--sans);

  letter-spacing: .2em;

  text-transform: uppercase;

}

.nature-aside h3 {

  margin: 0 0 12px;

  font-size: clamp(1.55rem, 3.4vw, 2.05rem);

}

.nature-aside p {

  margin-bottom: 22px;

  color: var(--muted);

}

.nature-aside__links {

  display: flex;

  flex-wrap: wrap;

  gap: 16px 28px;

}



/* Dog manifesto */

.dog-manifest {

  max-width: 40rem;

  margin-bottom: clamp(40px, 7vw, 72px);

}

.dog-manifest h2 {

  margin: 0 0 28px;

  font-size: clamp(2.2rem, 5.5vw, 3.6rem);

}

.dog-manifest__copy p {

  color: var(--muted);

  margin: 0 0 1.15em;

  font-size: 1.05rem;

  line-height: 1.8;

}

.dog-manifest__pillars {

  margin: 1.5em 0 1.6em;

  padding: 0;

  list-style: none;

  border-top: 1px solid var(--line);

  border-bottom: 1px solid var(--line);

}

.dog-manifest__pillars li {

  position: relative;

  padding: 14px 0 14px 18px;

  border-bottom: 1px solid var(--line);

  color: var(--muted);

  font-size: 1.02rem;

  line-height: 1.65;

}

.dog-manifest__pillars li:last-child { border-bottom: 0; }

.dog-manifest__pillars li::before {

  content: "";

  position: absolute;

  left: 0;

  top: 1.35em;

  width: 6px;

  height: 1px;

  background: var(--amber);

}

.dog-manifest__pillars strong {

  color: var(--ink);

  font-weight: 500;

}

.dog-manifest__close {

  margin-top: 1.4em !important;

  max-width: 42ch;

}

.dog-manifest__close em {

  font-family: var(--serif);

  font-style: italic;

  color: var(--ink);

}

.dog-manifest .text-link { margin-top: 8px; }



.dog-pillar-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: clamp(28px, 5vw, 40px);

  margin-bottom: clamp(48px, 8vw, 80px);

}

.dog-pillar {

  margin: 0;

}

.dog-pillar__media {

  overflow: hidden;

  background: var(--coal);

  aspect-ratio: 3 / 2;

}

.dog-pillar__media img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.1s var(--ease);

}

.dog-pillar:hover .dog-pillar__media img {

  transform: scale(1.03);

}

.dog-pillar figcaption {

  margin-top: 14px;

  color: var(--muted);

  font: 500 .72rem/1.4 var(--sans);

  letter-spacing: .12em;

  text-transform: uppercase;

}

.dog-pillar figcaption span {

  margin-right: 10px;

  color: var(--amber);

  font-family: var(--serif);

  font-size: 1rem;

  font-style: italic;

  font-weight: 400;

  letter-spacing: 0;

  text-transform: none;

}



.dog-print-aside {

  max-width: 52rem;

}



@media (min-width: 800px) {

  .dog-pillar-grid {

    grid-template-columns: repeat(3, 1fr);

    gap: clamp(20px, 3vw, 32px);

    align-items: start;

  }

}



@media (prefers-reduced-motion: reduce) {

  .dog-pillar:hover .dog-pillar__media img { transform: none; }

}



/* Iconic Portraits */

.page-iconic {

  background: var(--coal);

  color: var(--ash-soft);

}

.page-iconic .section--portfolio {

  background: var(--coal);

  color: var(--ash-soft);

}

.page-iconic .section--portfolio .section-heading p,

.page-iconic .photo-strip__hint {

  color: var(--muted-light);

}

.page-hero--iconic {

  min-height: min(88svh, 860px);

}

.page-hero--iconic .page-hero__media img {

  object-position: 38% 42%;

}

.page-hero--iconic .page-hero__media::after {

  background:

    linear-gradient(180deg, rgba(15, 13, 11, .42) 0%, rgba(15, 13, 11, .12) 38%, rgba(15, 13, 11, .88) 100%),

    radial-gradient(70% 55% at 72% 18%, rgba(184, 137, 74, .22), transparent 58%);

}



.iconic-manifest {

  max-width: 40rem;

  margin-bottom: clamp(36px, 6vw, 64px);

}

.iconic-manifest h2 {

  margin: 0 0 28px;

  font-size: clamp(2.2rem, 5.6vw, 3.7rem);

}

.iconic-manifest__copy p {

  margin: 0 0 1.15em;

  color: var(--muted-light);

  font-size: 1.05rem;

  line-height: 1.8;

}



.character-translation {

  position: relative;

  margin: 0 0 clamp(52px, 9vw, 96px);

  padding: clamp(30px, 6vw, 64px);

  overflow: hidden;

  border: 1px solid var(--line-dark);

  background:

    linear-gradient(135deg, rgba(184, 137, 74, .12), transparent 42%),

    var(--coal-soft);

}

.character-translation::after {

  content: "A / C";

  position: absolute;

  right: -.04em;

  bottom: -.22em;

  color: rgba(240, 235, 227, .025);

  font: 400 clamp(7rem, 20vw, 16rem)/1 var(--serif);

  letter-spacing: -.08em;

  pointer-events: none;

}

.character-translation__label {

  position: relative;

  z-index: 1;

  margin: 0 0 16px;

  color: var(--amber);

  font: 500 .65rem/1.4 var(--sans);

  letter-spacing: .22em;

  text-transform: uppercase;

}

.character-translation h2 {

  position: relative;

  z-index: 1;

  max-width: 16ch;

  margin: 0 0 clamp(30px, 5vw, 48px);

  font-size: clamp(2.2rem, 6vw, 4.4rem);

}

.character-translation h2 em {

  color: var(--amber-soft);

  font-weight: 400;

}

.character-translation__grid {

  position: relative;

  z-index: 1;

  display: grid;

  gap: 22px;

}

.character-translation__grid > div {

  padding-top: 16px;

  border-top: 1px solid var(--line-dark);

}

.character-translation__grid span {

  display: block;

  margin-bottom: 8px;

  color: var(--muted-light);

  font-size: .63rem;

  font-weight: 500;

  letter-spacing: .18em;

  text-transform: uppercase;

}

.character-translation__grid p {

  margin: 0;

  color: var(--ash-soft);

  font: italic 400 clamp(1.2rem, 3vw, 1.65rem)/1.5 var(--serif);

}



.section--coal {

  background: var(--coal-soft);

  color: var(--ash-soft);

}

.section--coal .section-heading p { color: var(--muted-light); }



.who-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

  border-top: 1px solid var(--line-dark);

}

.who-card {

  padding: clamp(26px, 4vw, 36px) 0;

  border-bottom: 1px solid var(--line-dark);

}

.who-card span {

  display: block;

  margin-bottom: 10px;

  color: var(--amber);

  font: italic 400 1.25rem/1 var(--serif);

}

.who-card h3 {

  margin: 0 0 10px;

  font-size: clamp(1.55rem, 3.4vw, 2rem);

}

.who-card p {

  max-width: 38ch;

  margin: 0;

  color: var(--muted-light);

}



.iconic-story {

  display: grid;

  gap: clamp(28px, 5vw, 56px);

  align-items: center;

  margin-bottom: clamp(40px, 7vw, 72px);

}

.iconic-story__copy h2 {

  margin-bottom: 18px;

  font-size: clamp(2.1rem, 5vw, 3.4rem);

}

.iconic-story__copy p {

  color: var(--muted-light);

  font-size: 1.04rem;

  line-height: 1.8;

}

.iconic-story__copy p + p { margin-top: 1em; }

.iconic-story__copy em {

  font-family: var(--serif);

  font-style: italic;

  color: var(--ash-soft);

}

.iconic-story__frame {

  position: relative;

  margin: 0;

  overflow: hidden;

  background: var(--coal);

}

.iconic-story__frame img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.iconic-story__frame--portrait {

  aspect-ratio: 3 / 4;

  max-height: min(78vh, 760px);

}

.iconic-story__frame figcaption,

.iconic-pair figcaption {

  position: absolute;

  right: 0;

  bottom: 0;

  left: 0;

  z-index: 1;

  padding: 40px 22px 18px;

  color: rgba(240, 235, 227, .78);

  background: linear-gradient(0deg, rgba(15, 13, 11, .88), transparent);

  font-size: .68rem;

  letter-spacing: .12em;

  line-height: 1.5;

  text-transform: uppercase;

}



.iconic-bleed {

  position: relative;

  margin: 0 0 clamp(28px, 5vw, 48px);

  overflow: hidden;

}

.iconic-bleed img {

  width: 100%;

  height: min(72vh, 780px);

  object-fit: cover;

  object-position: center 40%;

}

.iconic-bleed::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(90deg, rgba(15, 13, 11, .78), rgba(15, 13, 11, .08) 68%);

  pointer-events: none;

}

.iconic-bleed blockquote {

  position: absolute;

  left: max(20px, calc((100% - 1180px) / 2));

  bottom: clamp(28px, 7vw, 80px);

  z-index: 1;

  max-width: 19ch;

  margin: 0;

  color: var(--ash-soft);

  font: italic 400 clamp(1.8rem, 4.5vw, 3.8rem)/1.08 var(--serif);

  text-wrap: balance;

}



.iconic-pair {

  display: grid;

  grid-template-columns: 1fr;

  gap: 12px;

}

.iconic-pair figure {

  position: relative;

  margin: 0;

  overflow: hidden;

  background: var(--coal);

}

.iconic-pair img {

  width: 100%;

  height: min(72vh, 720px);

  object-fit: cover;

}

.iconic-story-note {

  max-width: 52rem;

  padding-top: clamp(56px, 9vw, 104px);

  padding-bottom: clamp(56px, 9vw, 104px);

  text-align: center;

}

.iconic-story-note p {

  margin: 0 auto;

  color: var(--ash-soft);

  font: italic 400 clamp(1.75rem, 4.5vw, 3.35rem)/1.18 var(--serif);

  text-wrap: balance;

}

.iconic-bleed--freedom img {

  object-position: center 44%;

}

.iconic-pair--details {

  margin-bottom: clamp(64px, 10vw, 112px);

}

.iconic-story--closing {

  margin-bottom: 0;

}



.page-iconic .feature p { color: var(--muted-light); }

.page-iconic .feature-strip { border-top-color: var(--line-dark); }

.page-iconic .feature { border-bottom-color: var(--line-dark); }

.page-iconic .text-link--light { color: var(--amber-soft); }



@media (min-width: 800px) {

  .character-translation__grid {

    grid-template-columns: 1fr 1fr;

    gap: 40px;

  }

  .who-grid {

    grid-template-columns: repeat(3, 1fr);

    gap: 28px;

    border-top: 0;

  }

  .who-card {

    padding: 28px 8px 0;

    border-bottom: 0;

    border-top: 1px solid var(--line-dark);

  }

  .iconic-pair {

    grid-template-columns: 1fr 1fr;

    gap: 16px;

  }

}



@media (max-width: 719px) {

  .page-hero--iconic .page-hero__media img {

    object-position: 68% 42%;

  }

  .iconic-bleed img {

    height: 70svh;

    object-position: 58% 40%;

  }

  .iconic-bleed::after {

    background: linear-gradient(0deg, rgba(15, 13, 11, .86), rgba(15, 13, 11, .04) 72%);

  }

  .iconic-bleed blockquote {

    right: 20px;

    left: 20px;

    max-width: 18ch;

  }

  .iconic-bleed--freedom img {

    object-position: 48% 50%;

  }

}



@media (min-width: 1000px) {

  .iconic-story {

    grid-template-columns: 1.05fr .95fr;

  }

}



/* Fine-art prints */

.print-pledge {

  max-width: 62ch;

  margin: 0 auto clamp(48px, 8vw, 80px);

  padding-top: 8px;

  text-align: center;

}

.print-pledge__label {

  margin: 0 0 14px;

  color: var(--amber);

  font: 500 .68rem/1 var(--sans);

  letter-spacing: .18em;

  text-transform: uppercase;

}

.print-pledge p:last-child {

  margin: 0;

  color: var(--muted);

  font-size: 1.05rem;

  line-height: 1.8;

}



.print-editions {

  display: grid;

  gap: clamp(56px, 10vw, 120px);

}



.print-edition {

  display: grid;

  grid-template-columns: 1fr;

  gap: clamp(24px, 4vw, 48px);

  align-items: center;

  padding-bottom: clamp(40px, 6vw, 64px);

  border-bottom: 1px solid var(--line);

}

.print-edition:last-child { border-bottom: 0; padding-bottom: 0; }



.print-edition__media {

  overflow: hidden;

  background: var(--coal);

  aspect-ratio: 3 / 2;

}

.print-edition__media img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.2s var(--ease);

}

.print-edition:hover .print-edition__media img {

  transform: scale(1.03);

}



.print-edition__meta {

  margin: 0 0 12px;

  color: var(--amber);

  font: 500 .68rem/1 var(--sans);

  letter-spacing: .16em;

  text-transform: uppercase;

}

.print-edition__body h3 {

  margin: 0 0 14px;

  font-size: clamp(1.9rem, 4.2vw, 2.7rem);

}

.print-edition__body > p {

  margin: 0 0 18px;

  color: var(--muted);

  max-width: 38ch;

}

.print-edition__price {

  margin: 0 0 22px !important;

  color: var(--ink) !important;

  font-family: var(--serif);

  font-size: clamp(1.45rem, 3vw, 1.85rem);

  letter-spacing: -.01em;

}

.print-edition__price-note {

  margin-left: 8px;

  color: var(--muted);

  font-family: var(--sans);

  font-size: .72rem;

  font-weight: 400;

  letter-spacing: .06em;

  text-transform: uppercase;

  vertical-align: middle;

}

.print-edition__actions {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 16px 28px;

}

.print-edition__actions .text-link { margin-top: 0; }



.print-details {

  display: grid;

  gap: clamp(28px, 5vw, 48px);

  margin-top: clamp(56px, 9vw, 96px);

  padding-top: clamp(36px, 6vw, 56px);

  border-top: 1px solid var(--line);

}

.print-details h3 {

  margin: 0 0 16px;

  font-size: clamp(1.5rem, 3vw, 1.9rem);

}

.print-details ul {

  margin: 0;

  padding: 0;

  list-style: none;

}

.print-details li {

  position: relative;

  padding: 10px 0 10px 18px;

  border-bottom: 1px solid var(--line);

  color: var(--muted);

}

.print-details li:last-child { border-bottom: 0; }

.print-details li::before {

  content: "";

  position: absolute;

  left: 0;

  top: 1.15em;

  width: 6px;

  height: 1px;

  background: var(--amber);

}



.print-inquiry {

  margin-top: clamp(56px, 9vw, 100px);

  padding-top: clamp(40px, 7vw, 72px);

  border-top: 1px solid var(--line);

}



@media (min-width: 860px) {

  .print-edition {

    grid-template-columns: 1.15fr 0.85fr;

    gap: clamp(36px, 5vw, 72px);

  }

  .print-edition--flip .print-edition__media { order: 2; }

  .print-edition--flip .print-edition__body { order: 1; }

  .print-details {

    grid-template-columns: 1fr 1fr;

    gap: 64px;

  }

}



.photo-strip--empty {

  display: grid;

  place-items: center;

  width: min(1180px, calc(100% - 40px));

  min-height: min(420px, 52svh);

  margin: 0 auto;

  border: 1px dashed var(--line);

  background:

    radial-gradient(80% 80% at 50% 0%, rgba(90, 118, 78, .08), transparent 60%),

    rgba(255, 255, 255, .22);

}

.nature-gallery-empty {

  max-width: 42ch;

  padding: clamp(36px, 6vw, 64px) 24px;

  text-align: center;

}

.nature-gallery-empty h3 {

  margin: 0 0 12px;

  font-size: clamp(1.8rem, 4vw, 2.55rem);

}

.nature-gallery-empty p {

  margin-bottom: 28px;

  color: var(--muted);

}

.nature-gallery-empty .btn { margin-inline: auto; }



.section--dark .feature-strip { border-color: var(--line-dark); }

.section--dark .feature { border-color: var(--line-dark); }

.section--dark .feature p { color: var(--muted-light); }



/* Blog */

.blog-list {

  display: grid;

  gap: clamp(28px, 5vw, 48px);

  max-width: 920px;

  margin-inline: auto;

}

.blog-teaser {

  display: grid;

  grid-template-columns: 1fr;

  gap: clamp(20px, 4vw, 36px);

  align-items: center;

  color: inherit;

  transition: transform .45s var(--ease);

}

.blog-teaser:hover { transform: translateY(-4px); }

.blog-teaser__media {

  position: relative;

  overflow: hidden;

  aspect-ratio: 16 / 10;

  background: var(--coal);

}

.blog-teaser__media img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.1s var(--ease);

}

.blog-teaser:hover .blog-teaser__media img { transform: scale(1.04); }

.blog-teaser__badge {

  position: absolute;

  top: 14px;

  left: 14px;

  z-index: 1;

  padding: 7px 12px;

  background: var(--amber);

  color: #fff;

  font: 500 .62rem/1 var(--sans);

  letter-spacing: .16em;

  text-transform: uppercase;

}

.blog-teaser__meta {

  display: block;

  margin-bottom: 10px;

  color: var(--amber);

  font: 500 .68rem/1 var(--sans);

  letter-spacing: .18em;

  text-transform: uppercase;

}

.blog-teaser h3 {

  margin: 0 0 12px;

  font-size: clamp(1.8rem, 4vw, 2.6rem);

}

.blog-teaser p {

  margin: 0 0 8px;

  color: var(--muted);

  max-width: 42ch;

}

.blog-teaser__soon-label {

  display: inline-block;

  margin-top: 10px;

  color: var(--muted);

  font: 500 .78rem/1.4 var(--sans);

  letter-spacing: .04em;

}

.blog-teaser--soon {

  cursor: default;

  pointer-events: none;

  opacity: .92;

}

.blog-teaser--soon:hover { transform: none; }

.blog-teaser--soon:hover .blog-teaser__media img { transform: none; }

.blog-teaser--soon .blog-teaser__media img { filter: saturate(.85); }

.blog-topics {

  display: grid;

  gap: 28px;

  margin-top: clamp(28px, 5vw, 40px);

  text-align: left;

}

.blog-topic h3 {

  margin: 0 0 8px;

  font-size: clamp(1.4rem, 3vw, 1.8rem);

}

.blog-topic p { color: var(--muted-light); margin: 0; }



.article { padding-top: calc(var(--header-h) + 28px); }

.article-hero {

  padding: clamp(24px, 5vw, 48px) 0 clamp(12px, 3vw, 24px);

  text-align: left;

}

.article-breadcrumb {

  margin: 0 0 18px;

  color: var(--muted);

  font-size: .85rem;

}

.article-breadcrumb a { color: var(--amber); }

.article-hero h1 {

  margin: 0 0 16px;

  font-size: clamp(2.4rem, 7vw, 4.2rem);

}

.article-lead {

  margin: 0 0 18px;

  color: var(--muted);

  font-size: 1.12rem;

  max-width: 40ch;

}

.article-meta {

  margin: 0;

  color: var(--muted);

  font-size: .85rem;

  letter-spacing: .04em;

}

.article-body {

  padding-bottom: clamp(40px, 7vw, 72px);

}

.article-body p,

.article-body li {

  color: var(--ink);

  font-size: 1.05rem;

  line-height: 1.85;

}

.article-body p { margin: 0 0 1.25em; }

.article-body h2 {

  margin: 2em 0 .7em;

  font-size: clamp(1.7rem, 4vw, 2.3rem);

}

.article-figure {

  margin: 2em 0;

}

.article-figure img {

  width: 100%;

  height: auto;

}

.article-figure--portrait {

  max-width: min(420px, 100%);

  margin-inline: auto;

}

.article-figure--gear {

  background: #0a0a0a;

  padding: clamp(16px, 3vw, 28px);

}

.article-figure--gear figcaption {

  color: var(--muted);

}

.article-figure figcaption {

  margin-top: 12px;

  color: var(--muted);

  font-size: .88rem;

  line-height: 1.5;

}

.article-body a:not(.text-link):not(.btn) {

  color: var(--amber-deep);

  text-decoration: underline;

  text-decoration-thickness: 1px;

  text-underline-offset: 3px;

}

.article-body a:not(.text-link):not(.btn):hover {

  color: var(--amber);

}

.article-aside {

  margin: 2.5em 0 0;

  padding: clamp(24px, 4vw, 32px);

  border: 1px solid var(--line);

  background: rgba(255, 255, 255, .35);

}

.article-aside__label {

  margin: 0 0 8px;

  color: var(--amber);

  font: 500 .68rem/1 var(--sans);

  letter-spacing: .18em;

  text-transform: uppercase;

}

.article-aside p { margin: 0 0 12px; color: var(--muted); }

.article-gear {

  margin: 2.5em 0 0;

  padding-top: 1.25em;

  border-top: 1px solid var(--line);

  color: var(--muted);

  font-size: .92rem;

  letter-spacing: .01em;

}

.article-gear__label {

  display: inline-block;

  margin-right: 10px;

  color: var(--amber);

  font: 500 .68rem/1 var(--sans);

  letter-spacing: .16em;

  text-transform: uppercase;

}

.article-note {

  margin: 1.6em 0 2em;

  padding: 1.15em 1.2em 1.15em 1.3em;

  border-left: 2px solid var(--amber);

  background: rgba(184, 137, 74, .07);

}

.article-note p { margin: 0; }

.article-steps {

  list-style: none;

  margin: 1.4em 0 2em;

  padding: 0;

  display: grid;

  gap: 22px;

}

.article-steps li {

  display: grid;

  grid-template-columns: auto 1fr;

  gap: 14px 18px;

  align-items: start;

}

.article-steps__n {

  color: var(--amber);

  font: 500 .68rem/1.6 var(--sans);

  letter-spacing: .16em;

  text-transform: uppercase;

  padding-top: .35em;

}

.article-steps strong {

  display: block;

  margin: 0 0 .35em;

  font-family: var(--serif);

  font-size: 1.25rem;

  font-weight: 500;

}

.article-steps p {

  margin: 0;

  color: var(--muted);

  font-size: 1rem;

}

.ba-compare {

  --pos: 50%;

  position: relative;

  overflow: hidden;

  margin: 0;

  background: var(--coal);

  touch-action: none;

  cursor: ew-resize;

  user-select: none;

}

.ba-compare__after {

  display: block;

  width: 100%;

  height: auto;

}

.ba-compare__clip {

  position: absolute;

  inset: 0 auto 0 0;

  width: var(--pos);

  overflow: hidden;

  border-right: 2px solid rgba(255, 255, 255, .72);

}

.ba-compare__clip img {

  display: block;

  height: 100%;

  width: auto;

  max-width: none;

}

.ba-compare__handle {

  position: absolute;

  top: 50%;

  left: var(--pos);

  z-index: 2;

  width: 36px;

  height: 36px;

  transform: translate(-50%, -50%);

  border: 2px solid #fff;

  border-radius: 50%;

  background: var(--amber);

  box-shadow: 0 6px 18px rgba(0, 0, 0, .35);

  pointer-events: none;

}

.ba-compare__handle::before,

.ba-compare__handle::after {

  content: "";

  position: absolute;

  top: 50%;

  width: 6px;

  height: 6px;

  border-top: 2px solid #fff;

  border-right: 2px solid #fff;

  transform: translateY(-50%) rotate(45deg);

}

.ba-compare__handle::before {

  left: 8px;

  transform: translateY(-50%) rotate(-135deg);

}

.ba-compare__handle::after { right: 8px; }

.ba-compare:focus-within .ba-compare__handle {

  box-shadow: 0 0 0 3px rgba(255, 255, 255, .85), 0 6px 18px rgba(0, 0, 0, .35);

}

.ba-compare__range {

  position: absolute;

  width: 1px;

  height: 1px;

  padding: 0;

  margin: -1px;

  overflow: hidden;

  clip: rect(0, 0, 0, 0);

  white-space: nowrap;

  border: 0;

}

.ba-compare__label {

  position: absolute;

  bottom: 12px;

  z-index: 2;

  padding: 5px 9px;

  background: rgba(15, 13, 11, .72);

  color: #fff;

  font: 500 .62rem/1 var(--sans);

  letter-spacing: .16em;

  text-transform: uppercase;

  pointer-events: none;

}

.ba-compare__label--before { left: 12px; }

.ba-compare__label--after { right: 12px; }

.ba-compare + figcaption { margin-top: 12px; }

.article-footer {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  padding: 0 0 clamp(56px, 10vw, 96px);

  border-top: 1px solid var(--line);

  padding-top: 28px;

}

.nature-cta-row {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: center;

  gap: 18px 28px;

  margin-top: 8px;

}

.nature-cta-row .text-link { margin-top: 0; }



@media (min-width: 800px) {

  .blog-teaser {

    grid-template-columns: 1.05fr 1fr;

  }

  .blog-topics {

    grid-template-columns: repeat(3, 1fr);

    gap: 32px;

  }

}



/* Home */

.intro-grid,

.about-grid,

.contact-grid {

  display: grid;

  grid-template-columns: 1fr;

  align-items: center;

  gap: clamp(36px, 7vw, 88px);

}

.intro-copy h2,

.about-copy h2,

.contact-copy h2 {

  font-size: clamp(2.4rem, 6vw, 4rem);

}

.intro-copy p,

.about-copy p { color: var(--muted); }

.section--dark .intro-copy p { color: var(--muted-light); }

.section--dark .intro-copy li { color: var(--ash-soft); }



.framed-image {

  position: relative;

  overflow: hidden;

}

.framed-image::before {

  content: "";

  position: absolute;

  inset: 12px;

  z-index: 1;

  border: 1px solid rgba(240, 235, 227, .28);

  pointer-events: none;

}

.framed-image img {

  aspect-ratio: 4/5;

  object-fit: cover;

  transition: transform 1.2s var(--ease);

}

.framed-image:hover img { transform: scale(1.04); }



.split-image {

  display: grid;

  grid-template-columns: 1fr 1fr;

  aspect-ratio: 4/5;

  overflow: hidden;

  background: var(--coal);

}

.split-image__panel {

  position: relative;

  min-width: 0;

  overflow: hidden;

}

.split-image__panel::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, transparent 45%, rgba(10, 8, 6, .72));

}

.split-image__panel:first-child {

  border-right: 1px solid rgba(240, 235, 227, .28);

}

.split-image__panel img {

  width: 100%;

  height: 100%;

  aspect-ratio: auto;

  object-fit: cover;

  transition: transform 1.3s var(--ease);

}

.split-image:hover .split-image__panel img { transform: scale(1.05); }

.split-image__panel:first-child img { object-position: 35% center; }

.split-image__panel:last-child img { object-position: 58% center; }

.split-image__panel span {

  position: absolute;

  right: 0;

  bottom: 20px;

  left: 0;

  z-index: 1;

  color: white;

  font: 500 .64rem var(--sans);

  letter-spacing: .24em;

  text-align: center;

  text-transform: uppercase;

}



.brand-teasers {

  display: grid;

  grid-template-columns: 1fr;

}

.brand-card {

  position: relative;

  min-height: min(72svh, 620px);

  display: flex;

  align-items: flex-end;

  overflow: hidden;

  color: white;

}

.brand-card img {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 1.4s var(--ease);

}

.brand-card:hover img { transform: scale(1.06); }

.brand-card--iconic img { object-position: center 22%; }

.brand-card::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .78));

  transition: background .5s;

}

.brand-card:hover::after {

  background: linear-gradient(180deg, rgba(184, 137, 74, .12), rgba(0, 0, 0, .82));

}

.brand-card__content {

  position: relative;

  z-index: 1;

  max-width: 520px;

  padding: clamp(28px, 6vw, 64px);

}

.brand-card h2 {

  margin: 0 0 10px;

  font-size: clamp(2.6rem, 7vw, 4.4rem);

}

.brand-card p { color: #ddd5c9; max-width: 28ch; }



.feature-strip {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

  border-top: 1px solid var(--line);

}

.feature {

  padding: clamp(28px, 5vw, 40px) 0;

  border-bottom: 1px solid var(--line);

  text-align: left;

}

.feature__num {

  display: block;

  margin-bottom: 8px;

  color: var(--amber);

  font: 400 1.35rem/1 var(--serif);

  font-style: italic;

}

.feature h3 {

  margin: 0 0 8px;

  font-size: clamp(1.6rem, 4vw, 2rem);

}

.feature p {

  max-width: 36ch;

  color: var(--muted);

  font-size: .95rem;

}



/* Approach pillars */

.section--approach {

  padding-block: clamp(72px, 11vw, 132px);

}

.section--approach .section-heading {

  max-width: 760px;

}

.section--approach .section-heading p {

  max-width: 52ch;

  margin-inline: auto;

}

.section--approach .section-heading h2 {

  font-size: clamp(2.2rem, 6.4vw, 3.85rem);

}

.approach-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

}

.approach-card {

  position: relative;

  padding: clamp(28px, 5vw, 40px) 4.5rem clamp(28px, 5vw, 40px) 0;

  border-top: 1px solid var(--line-dark);

  overflow: hidden;

}

.approach-card__num {

  position: absolute;

  top: 12px;

  right: 0;

  color: var(--ash-soft);

  font: italic 400 clamp(4.2rem, 10vw, 6.4rem)/.8 var(--serif);

  opacity: .07;

  pointer-events: none;

  user-select: none;

}

.approach-card__kicker {

  margin: 0 0 10px;

  color: var(--amber-soft);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .22em;

  text-transform: uppercase;

}

.approach-card h3 {

  margin: 0 0 14px;

  font-size: clamp(1.7rem, 3.6vw, 2.15rem);

}

.approach-card p {

  max-width: 44ch;

  color: var(--muted-light);

  font-size: .95rem;

}

.approach-coda {

  max-width: 22em;

  margin: clamp(36px, 6vw, 64px) auto 0;

  color: var(--ash-soft);

  font: italic 400 clamp(1.35rem, 3.2vw, 1.85rem)/1.35 var(--serif);

  text-align: center;

}



.value-band {

  margin-top: clamp(48px, 8vw, 80px);

}

.value-band__label {

  margin: 0 0 clamp(22px, 4vw, 32px);

  color: var(--amber-soft);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .22em;

  text-transform: uppercase;

  text-align: center;

}

.value-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 14px;

}

.value-card {

  padding: clamp(24px, 4vw, 34px);

  border: 1px solid rgba(184, 137, 74, .16);

  border-radius: 10px;

  background:

    linear-gradient(165deg, rgba(184, 137, 74, .08), transparent 46%),

    var(--coal-lift);

}

.value-card__icon {

  display: flex;

  width: 26px;

  height: 26px;

  margin-bottom: 16px;

  color: var(--amber-soft);

}

.value-card__icon svg {

  display: block;

  width: 100%;

  height: 100%;

}

.value-card h3 {

  margin: 0 0 8px;

  color: var(--ash-soft);

  font-size: clamp(1.4rem, 3vw, 1.8rem);

}

.value-card__sub {

  margin: 0 0 14px;

  color: rgba(184, 174, 160, .85);

  font: italic 400 .9rem/1.45 var(--serif);

}

.value-card__body {

  margin: 0;

  max-width: 38ch;

  color: var(--muted-light);

  font-size: .92rem;

}



.section--portfolio {

  overflow-x: clip;

  padding-block: clamp(56px, 10vw, 120px);

}

.section--portfolio .section-heading {

  max-width: 820px;

  margin-bottom: clamp(28px, 5vw, 52px);

  padding-inline: 4px;

}



/* Photo strip — dvouřadý horizontální pás (mobile first) */

.photo-strip {

  position: relative;

}

.photo-strip__viewport {

  overflow-x: auto;

  overflow-y: hidden;

  overscroll-behavior-x: contain;

  -webkit-overflow-scrolling: touch;

  scroll-snap-type: x proximity;

  scroll-behavior: smooth;

  scrollbar-width: none;

  padding-inline: max(16px, env(safe-area-inset-left));

  padding-bottom: 4px;

}

.photo-strip__viewport::-webkit-scrollbar {

  display: none;

}

.photo-strip__track {

  display: grid;

  grid-auto-flow: column dense;

  grid-template-rows: repeat(2, clamp(168px, 44vw, 320px));

  grid-auto-columns: clamp(168px, 44vw, 320px);

  gap: 12px;

  width: max-content;

  padding-right: max(16px, env(safe-area-inset-right));

}

.photo-strip__track .gallery-card {

  width: 100%;

  height: 100%;

  margin: 0;

  scroll-snap-align: start;

  -webkit-tap-highlight-color: transparent;

}

/* Občas velká fotka přes obě řady — dodá rytmus */

.photo-strip__track .gallery-card:nth-child(8n + 1) {

  grid-row: span 2;

  grid-column: span 2;

}

.photo-strip__track .gallery-card img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  pointer-events: none;

}

.photo-strip__arrow {

  display: none;

}

.photo-strip__hint {

  margin: 14px 16px 0;

  text-align: center;

  color: var(--muted);

  font-size: .68rem;

  letter-spacing: .06em;

  text-transform: uppercase;

  line-height: 1.45;

}

.photo-strip__hint--desktop { display: none; }



/* Filmový pás — jedna řada, těsné mezery, odraz (svatby) */

.photo-strip--film .photo-strip__viewport {

  padding-bottom: clamp(72px, 16vw, 128px);

  touch-action: pan-x;

}

.photo-strip--film .photo-strip__track {

  display: flex;

  grid: none;

  height: clamp(260px, 58vw, 440px);

  width: max-content;

  gap: 4px;

  padding-right: max(16px, env(safe-area-inset-right));

  -webkit-box-reflect: below 4px linear-gradient(

    to bottom,

    rgba(255, 255, 255, .1) 0%,

    rgba(255, 255, 255, .04) 40%,

    rgba(255, 255, 255, 0) 75%

  );

}

.photo-strip--film .photo-strip__track .gallery-card,

.photo-strip--film .photo-strip__track .gallery-card:nth-child(8n + 1) {

  flex: 0 0 auto;

  width: auto;

  height: 100%;

  grid-row: auto;

  grid-column: auto;

  aspect-ratio: 3 / 4;

}

.photo-strip--film .gallery-card--wide { aspect-ratio: 16 / 10; }

.photo-strip--film .gallery-card--square { aspect-ratio: 1 / 1; }

.photo-strip--film .photo-strip__track .gallery-card img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.photo-strip--film .photo-strip__hint {

  margin-top: 8px;

}

@supports not (-webkit-box-reflect: below) {

  .photo-strip--film .photo-strip__viewport {

    padding-bottom: 4px;

  }

}



@media (min-width: 900px) {

  .photo-strip__viewport {

    padding-inline: clamp(24px, 4vw, 64px);

    -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);

    mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);

  }

  .photo-strip__track {

    grid-template-rows: repeat(2, clamp(230px, 24vw, 360px));

    grid-auto-columns: clamp(230px, 24vw, 360px);

    gap: 16px;

  }

  .photo-strip--film .photo-strip__track {

    height: clamp(340px, 32vw, 480px);

    gap: 5px;

  }

  .photo-strip--film .photo-strip__viewport {

    padding-bottom: clamp(96px, 10vw, 150px);

  }

  .photo-strip__hint--mobile { display: none; }

  .photo-strip__hint--desktop { display: inline; }

}



@media (min-width: 900px) and (hover: hover) {

  .photo-strip__arrow {

    position: absolute;

    top: 50%;

    z-index: 5;

    display: grid;

    place-items: center;

    width: 52px;

    height: 52px;

    border: 0;

    border-radius: 50%;

    transform: translateY(calc(-50% - 14px));

    background: rgba(15, 13, 11, .82);

    color: var(--ash-soft);

    font-size: 1.6rem;

    line-height: 1;

    cursor: pointer;

    transition: background .3s, opacity .3s;

  }

  .photo-strip__arrow:hover { background: var(--amber); }

  .photo-strip__arrow--prev { left: 14px; }

  .photo-strip__arrow--next { right: 14px; }

  .photo-strip__arrow[disabled] {

    opacity: .25;

    cursor: default;

  }

  .photo-strip__arrow[disabled]:hover { background: rgba(15, 13, 11, .82); }

  .photo-strip--film .photo-strip__arrow {

    top: calc(clamp(340px, 32vw, 480px) / 2);

    transform: translateY(-50%);

  }

}



.gallery-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 10px;

}

.gallery-card {

  position: relative;

  margin: 0;

  overflow: hidden;

  background: var(--ash);

  cursor: zoom-in;

  transition: opacity .25s, transform .4s var(--ease);

}

.gallery-card img {

  width: 100%;

  height: auto;

  aspect-ratio: auto;

  object-fit: cover;

  transition: transform .9s var(--ease), filter .9s;

}

.gallery-card:hover img {

  transform: scale(1.04);

  filter: saturate(1.05);

}

.gallery-card::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, transparent 60%, rgba(0, 0, 0, .35));

  opacity: 0;

  transition: opacity .4s;

}

.gallery-card:hover::after { opacity: 1; }



@media (hover: none) {

  .gallery-card:hover img {

    transform: none;

    filter: none;

  }

  .gallery-card:hover::after { opacity: 0; }

  .gallery-card:active {

    transform: scale(.985);

  }

}



.lightbox {

  position: fixed;

  inset: 0;

  z-index: 1600;

  display: grid;

  place-items: center;

  padding: 60px 16px;

  background: rgba(10, 8, 6, .96);

  opacity: 0;

  visibility: hidden;

  transition: opacity .3s, visibility .3s;

}

.lightbox.is-open {

  opacity: 1;

  visibility: visible;

}

.lightbox__image {

  width: auto;

  max-width: min(94vw, 1500px);

  height: auto;

  max-height: 86vh;

  object-fit: contain;

}

.lightbox__close,

.lightbox__nav {

  position: absolute;

  border: 0;

  background: transparent;

  color: white;

  cursor: pointer;

}

.lightbox__close {

  top: 16px;

  right: 16px;

  width: 48px;

  height: 48px;

  font-size: 2rem;

}

.lightbox__nav {

  top: 50%;

  width: 44px;

  height: 64px;

  transform: translateY(-50%);

  font-size: 1.8rem;

  background: rgba(0, 0, 0, .28);

}

.lightbox__nav--prev { left: 8px; }

.lightbox__nav--next { right: 8px; }



/* Pixieset */

.client-galleries {

  display: grid;

  grid-template-columns: 1fr;

  gap: 14px;

}

.client-card {

  position: relative;

  min-height: 320px;

  display: flex;

  align-items: flex-end;

  overflow: hidden;

  color: white;

}

.client-card img {

  position: absolute;

  inset: 0;

  height: 100%;

  object-fit: cover;

  transition: transform .9s var(--ease);

}

.client-card::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, rgba(0, 0, 0, .05), rgba(0, 0, 0, .78));

}

.client-card:hover img { transform: scale(1.05); }

.client-card__content {

  position: relative;

  z-index: 1;

  width: 100%;

  padding: 28px;

}

.client-card__lock {

  font-size: .66rem;

  letter-spacing: .16em;

  text-transform: uppercase;

  color: var(--amber-soft);

}

.client-card h3 {

  margin: 8px 0 2px;

  font-size: 1.7rem;

}

.client-card p {

  color: #d7d0c5;

  font-size: .85rem;

}



.gallery-handoff__note {

  margin-top: 14px;

  font-size: .82rem;

}



.section-heading > .btn {

  margin-top: 22px;

}



/* Pricing & FAQ */

.pricing-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 16px;

  align-items: stretch;

}

.price-card {

  position: relative;

  display: flex;

  flex-direction: column;

  padding: clamp(28px, 5vw, 44px);

  border: 1px solid var(--line);

  background: var(--ash-soft);

}

.price-card--featured {

  border-color: var(--amber);

  background:

    linear-gradient(180deg, rgba(184, 137, 74, .08), transparent 40%),

    var(--ash-soft);

}

.price-card__badge {

  position: absolute;

  top: 0;

  left: 50%;

  padding: 7px 14px;

  transform: translate(-50%, -50%);

  background: var(--amber);

  color: white;

  font-size: .6rem;

  font-weight: 500;

  letter-spacing: .15em;

  text-transform: uppercase;

  white-space: nowrap;

}

.price-card h2 {

  margin-bottom: 8px;

  font-size: 1.9rem;

}

.price-card__sub {

  min-height: auto;

  color: var(--muted);

  font-size: .85rem;

}

.price-card__amount {

  margin: 16px 0 22px;

  color: var(--amber);

  font: 400 2rem var(--serif);

}

.price-card ul {

  flex: 1;

  margin: 0 0 28px;

  padding: 0;

  list-style: none;

}

.price-card > .btn {

  align-self: stretch;

  width: 100%;

  margin-top: auto;

  box-sizing: border-box;

}

.price-card li {

  position: relative;

  padding: 9px 0 9px 18px;

  border-bottom: 1px solid var(--line);

  color: var(--muted);

  font-size: .9rem;

}

.price-card li::before {

  content: "·";

  position: absolute;

  left: 2px;

  color: var(--amber);

}

.price-item--bonus {

  border-bottom-color: rgba(184, 137, 74, .22);

  background: linear-gradient(90deg, rgba(184, 137, 74, .08), transparent 85%);

  color: var(--ink);

  font-weight: 400;

  margin: 0 -8px;

  padding-left: 26px;

  padding-right: 8px;

}

.price-item--bonus::before {

  content: "✦";

  left: 8px;

  font-size: .65rem;

}

.tag-inline,

.tag-new {

  display: inline-block;

  margin-right: 6px;

  padding: 2px 7px;

  border: 1px solid rgba(184, 137, 74, .35);

  background: rgba(184, 137, 74, .12);

  color: var(--amber-deep);

  font-size: .55rem;

  font-weight: 500;

  letter-spacing: .12em;

  text-transform: uppercase;

  vertical-align: middle;

  white-space: nowrap;

}

.tag-new {

  margin-bottom: 10px;

  margin-right: 0;

}



.included-band {

  margin: 0 0 clamp(36px, 6vw, 56px);

  padding: clamp(24px, 4vw, 36px);

  border: 1px solid rgba(184, 137, 74, .28);

  background:

    linear-gradient(135deg, rgba(184, 137, 74, .07), transparent 55%),

    var(--ash-soft);

}

.included-band__label {

  margin: 0 0 22px;

  color: var(--amber);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .16em;

  text-transform: uppercase;

}

.included-band__grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 22px;

}

.included-item h3 {

  margin: 0 0 8px;

  font-size: 1.35rem;

}

.included-item p {

  color: var(--muted);

  font-size: .9rem;

  max-width: 42ch;

}

.included-item p + p {

  margin-top: 10px;

}

.included-band--addon {

  margin-top: clamp(28px, 5vw, 40px);

  margin-bottom: 0;

}

.included-band--addon .included-item p,

.included-band__grid--pair .included-item p {

  max-width: 58ch;

}

.included-item .included-item__note {

  margin: -12px 0 16px;

  color: var(--muted);

  font-size: .85rem;

}

.included-item .price-card__amount {

  margin: 8px 0 6px;

  font-size: 1.65rem;

}

.included-item ul {

  margin: 14px 0 0;

  padding: 0;

  list-style: none;

}

.included-item li {

  position: relative;

  padding: 9px 0 9px 18px;

  border-bottom: 1px solid var(--line);

  color: var(--muted);

  font-size: .9rem;

}

.included-item li:last-child {

  border-bottom: 0;

}

.included-item li::before {

  content: "·";

  position: absolute;

  left: 2px;

  color: var(--amber);

}

.included-item li strong {

  color: var(--ink);

  font-weight: 500;

}



.pricing-note {

  max-width: 62ch;

  margin: clamp(28px, 5vw, 40px) auto 0;

  text-align: center;

  color: var(--muted);

  font-size: .9rem;

}

.pricing-note .text-link {

  margin-top: 0;

  justify-content: center;

}

.pricing-legal {

  max-width: 46ch;

  margin: 14px auto 0;

  text-align: center;

  color: var(--muted);

  font-size: .78rem;

  letter-spacing: .04em;

}



.booking-steps {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

}

.booking-step {

  position: relative;

  padding: clamp(24px, 4vw, 36px) 0 clamp(24px, 4vw, 36px) 0;

  border-top: 1px solid var(--line-dark);

}

.booking-step__num {

  display: block;

  margin-bottom: 10px;

  color: var(--amber-soft);

  font: italic 400 1.2rem/1 var(--serif);

}

.booking-step h3 {

  margin: 0 0 10px;

  font-size: clamp(1.45rem, 3vw, 1.85rem);

}

.booking-step p {

  max-width: 38ch;

  margin: 0;

  color: var(--muted-light);

  font-size: .92rem;

}



.field-row {

  display: grid;

  grid-template-columns: 1fr;

  gap: 0;

}

.field__hint {

  margin-left: 6px;

  color: var(--muted);

  font-weight: 300;

  letter-spacing: .04em;

  text-transform: none;

}



.guarantee-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 14px;

}

.guarantee-card {

  padding: clamp(24px, 4vw, 32px);

  border: 1px solid var(--line-dark);

  background: rgba(255, 255, 255, .03);

}

.guarantee-card__num {

  display: block;

  margin-bottom: 10px;

  color: var(--amber-soft);

  font: italic 1.15rem var(--serif);

}

.guarantee-card h3 {

  margin: 0 0 10px;

  font-size: clamp(1.35rem, 3vw, 1.7rem);

}

.guarantee-card p {

  color: var(--muted-light);

  font-size: .92rem;

  max-width: 38ch;

}

.guarantee-link {

  margin: 36px 0 0;

  text-align: center;

}

.text-link--light {

  color: var(--ash-soft);

}



.section-cta {

  margin: 36px 0 0;

  text-align: center;

}



.faq {

  max-width: 820px;

  margin-inline: auto;

  border-top: 1px solid var(--line);

}

.faq__item { border-bottom: 1px solid var(--line); }

.faq__item h3 { margin: 0; }

.faq__question {

  display: flex;

  width: 100%;

  align-items: center;

  justify-content: space-between;

  gap: 18px;

  padding: 22px 0;

  border: 0;

  background: transparent;

  cursor: pointer;

  text-align: left;

  font: 400 1.25rem/1.25 var(--serif);

}

.faq__question::after {

  content: "+";

  color: var(--amber);

  font: 300 1.5rem var(--sans);

  transition: transform .35s;

}

.faq__question[aria-expanded="true"]::after { transform: rotate(45deg); }

.faq__answer {

  display: grid;

  grid-template-rows: 0fr;

  transition: grid-template-rows .45s var(--ease);

}

.faq__answer > div { overflow: hidden; }

.faq__answer p {

  padding: 0 36px 22px 0;

  color: var(--muted);

}

.faq__answer a {

  color: var(--amber-deep);

  text-decoration: underline;

  text-underline-offset: 2px;

}

.faq__item.is-open .faq__answer { grid-template-rows: 1fr; }



/* About, process, reviews */

.process-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 28px;

}

.process-step {

  border-top: 1px solid var(--amber);

  padding-top: 18px;

}

.process-step__num {

  color: var(--amber);

  font: italic 1.15rem var(--serif);

}

.process-step h3 {

  margin: 10px 0 8px;

  font-size: 1.5rem;

}

.process-step p {

  color: var(--muted);

  font-size: .9rem;

}



.review-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 14px;

}

.review-card {

  border: 1px solid var(--line-dark);

  background: rgba(255, 255, 255, .03);

  text-align: left;

  padding: 18px 16px;

}

.review-card__stars {

  color: var(--amber-soft);

  font-size: .7rem;

  letter-spacing: .12em;

}

.review-card blockquote {

  margin: 10px 0 12px;

  font: italic 1.05rem/1.45 var(--serif);

  color: #ebe4da;

}

.review-card cite {

  color: #a99e90;

  font-size: .6rem;

  font-style: normal;

  letter-spacing: .14em;

  text-transform: uppercase;

}



.review-marquee { margin-top: 8px; text-align: center; }

.review-marquee__viewport {

  overflow: hidden;

  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);

}

.review-marquee__track {

  display: flex;

  width: max-content;

  gap: 12px;

  padding: 4px 0 8px;

}

.review-marquee__track.is-animated {

  animation: review-marquee 42s linear infinite;

}

.review-marquee:hover .review-marquee__track.is-animated {

  animation-play-state: paused;

}

.review-marquee__card {

  flex: 0 0 min(78vw, 280px);

}

.review-marquee__card blockquote {

  display: -webkit-box;

  overflow: hidden;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 4;

}

.review-marquee__google {

  display: inline-block;

  margin-top: 16px;

  color: #d8cfc3;

  font-size: .64rem;

  letter-spacing: .12em;

  text-transform: uppercase;

}

.review-marquee__google:hover { color: var(--amber-soft); }



@keyframes review-marquee {

  to { transform: translateX(-50%); }

}



/* Contact */

.contact-grid { align-items: start; }

.contact-copy ul {

  margin: 28px 0;

  padding: 0;

  list-style: none;

}

.contact-copy li {

  margin: 10px 0;

  color: var(--muted);

}

.contact-form {

  padding: clamp(28px, 5vw, 48px);

  background: var(--ash);

  border: 1px solid var(--line);

}

.field { margin-bottom: 18px; }

.field label {

  display: block;

  margin-bottom: 7px;

  font-size: .64rem;

  font-weight: 500;

  letter-spacing: .16em;

  text-transform: uppercase;

}

.field input,

.field textarea,

.field select {

  width: 100%;

  border: 0;

  border-bottom: 1px solid var(--line);

  border-radius: 0;

  background: transparent;

  color: var(--ink);

  padding: 12px 0;

  transition: border-color .3s;

}

.field input:focus,

.field textarea:focus,

.field select:focus {

  outline: none;

  border-bottom-color: var(--amber);

}

.field input[type="date"] {

  color-scheme: light;

  min-height: 46px;

}

.field select {

  appearance: none;

  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);

  background-position: calc(100% - 12px) calc(50% + 2px), calc(100% - 6px) calc(50% + 2px);

  background-size: 6px 6px, 6px 6px;

  background-repeat: no-repeat;

  padding-right: 28px;

  cursor: pointer;

}

.field--trap {

  position: absolute;

  left: -9999px;

}

.form-note {

  margin: 16px 0 0;

  max-width: 42ch;

  color: var(--muted);

  font-size: .78rem;

  line-height: 1.55;

  opacity: .85;

}

.form-note a {

  color: var(--amber-deep);

  text-decoration: underline;

  text-underline-offset: 2px;

}

.form-status {

  min-height: 28px;

  margin-top: 10px;

  color: var(--muted);

  font-size: .88rem;

}



/* Footer */

.site-footer {

  padding: 64px 0 24px;

  background: var(--coal);

  color: #e9e2d9;

}

.footer-grid {

  display: grid;

  grid-template-columns: 1fr;

  gap: 36px;

  padding-bottom: 40px;

}

.footer-brand {

  font: 400 1.7rem var(--serif);

  letter-spacing: .16em;

}

.footer-brand span { color: var(--amber-soft); }

.footer-copy {

  max-width: 420px;

  color: #a99f92;

  font-size: .9rem;

}

.footer-id {

  display: block;

  max-width: 420px;

  margin: 18px 0 0;

  color: #a99f92;

  font-size: .82rem;

  font-style: normal;

  line-height: 1.65;

}

.footer-id strong {

  color: #e9e2d9;

  font-weight: 500;

}

.footer-id em {

  display: block;

  margin-top: 8px;

  color: #81776d;

  font-size: .78rem;

}

.footer-title {

  margin-bottom: 14px;

  color: var(--amber-soft);

  font-size: .64rem;

  font-weight: 500;

  letter-spacing: .2em;

  text-transform: uppercase;

}

.footer-links {

  margin: 0;

  padding: 0;

  list-style: none;

}

.footer-links li {

  margin: 7px 0;

  color: #bbb1a4;

  font-size: .88rem;

}

.footer-links a:hover { color: white; }

.footer-bottom {

  display: flex;

  flex-direction: column;

  gap: 10px;

  padding-top: 22px;

  border-top: 1px solid var(--line-dark);

  color: #81776d;

  font-size: .72rem;

}

.footer-legal {

  display: flex;

  flex-wrap: wrap;

  gap: 8px 18px;

}

.footer-legal a:hover { color: #e9e2d9; }

.footer-adr {

  margin: 0;

  max-width: 62ch;

  line-height: 1.55;

}

.footer-adr a {

  text-decoration: underline;

  text-decoration-thickness: 1px;

  text-underline-offset: 2px;

}

.footer-adr a:hover { color: #e9e2d9; }



.to-top {

  position: fixed;

  right: 16px;

  bottom: 16px;

  z-index: 900;

  width: 46px;

  height: 46px;

  border: 0;

  border-radius: 50%;

  background: var(--amber);

  color: white;

  cursor: pointer;

  opacity: 0;

  pointer-events: none;

  transition: opacity .3s, transform .3s;

}

.to-top.is-visible {

  opacity: 1;

  pointer-events: auto;

}

.to-top:hover { transform: translateY(-4px); }



/* Legal pages */

.legal-page {

  padding-top: var(--header-h);

  background: var(--ash-soft);

}

.legal-hero {

  padding: clamp(36px, 7vw, 72px) 0 clamp(28px, 5vw, 44px);

  border-bottom: 1px solid var(--line);

  background:

    radial-gradient(90% 80% at 100% 0%, rgba(184, 137, 74, .1), transparent 55%),

    var(--ash-soft);

}

.legal-hero h1 {

  margin: 0 0 12px;

  font-size: clamp(2.4rem, 7vw, 4.2rem);

}

.legal-lead {

  max-width: 42ch;

  margin: 0 0 14px;

  color: var(--muted);

  font-size: 1.08rem;

}

.legal-back {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 28px;

  color: var(--amber);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .18em;

  text-transform: uppercase;

}

.legal-back::before {

  content: "←";

  font-size: 1rem;

  transition: transform .35s var(--ease);

}

.legal-back:hover::before { transform: translateX(-6px); }



.legal-doc {

  padding: clamp(40px, 7vw, 72px) 0 clamp(72px, 12vw, 120px);

}

.legal-doc h2 {

  margin: 2.2em 0 .7em;

  scroll-margin-top: calc(var(--header-h) + 16px);

  font-size: clamp(1.7rem, 4vw, 2.3rem);

}

.legal-doc h2:first-of-type { margin-top: 0; }

.legal-doc h3 {

  margin: 1.5em 0 .5em;

  font-family: var(--sans);

  font-size: clamp(1.05rem, 2.2vw, 1.2rem);

  font-weight: 500;

  letter-spacing: 0;

  line-height: 1.4;

}

.legal-doc p,

.legal-doc li {

  color: var(--ink);

  font-size: 1.02rem;

  line-height: 1.85;

}

.legal-doc p { margin: 0 0 1.15em; }

.legal-doc ul,

.legal-doc ol {

  margin: 0 0 1.4em;

  padding-left: 1.25em;

}

.legal-doc li { margin: 0 0 .45em; }

.legal-doc a:not(.legal-back):not(.btn) {

  color: var(--amber-deep);

  text-decoration: underline;

  text-decoration-thickness: 1px;

  text-underline-offset: 3px;

}

.legal-doc a:not(.legal-back):not(.btn):hover { color: var(--amber); }



.legal-id {

  display: block;

  margin: 0 0 1.5em;

  padding: clamp(20px, 3vw, 28px);

  border: 1px solid var(--line);

  background: rgba(255, 255, 255, .4);

  font-style: normal;

}

.legal-id p { margin: 0 0 .35em; }

.legal-id p:last-child { margin-bottom: 0; }



.legal-toc {

  margin: 0 0 2.4em;

  padding: 0;

  list-style: none;

  border-top: 1px solid var(--line);

}

.legal-toc li {

  margin: 0;

  border-bottom: 1px solid var(--line);

}

.legal-toc a {

  display: flex;

  align-items: baseline;

  justify-content: space-between;

  gap: 16px;

  padding: 13px 0;

  color: var(--ink) !important;

  text-decoration: none !important;

  font-size: .95rem;

}

.legal-toc a:hover { color: var(--amber) !important; }

.legal-toc span {

  color: var(--amber);

  font-family: var(--serif);

  font-style: italic;

  font-size: 1rem;

}



.legal-callout {

  margin: 1.6em 0;

  padding: clamp(20px, 3vw, 28px);

  border: 1px solid rgba(184, 137, 74, .35);

  background:

    linear-gradient(135deg, rgba(184, 137, 74, .08), transparent 55%),

    var(--ash);

}

.legal-callout__label {

  display: block;

  margin-bottom: 8px;

  color: var(--amber-deep);

  font-size: .68rem;

  font-weight: 500;

  letter-spacing: .16em;

  text-transform: uppercase;

}

.legal-callout p:last-child { margin-bottom: 0; }



.legal-cta {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 16px 28px;

  margin-top: 2.8em;

  padding-top: 28px;

  border-top: 1px solid var(--line);

}



/* Cookie bar */

.cookie-bar {

  position: fixed;

  right: 16px;

  bottom: 16px;

  left: 16px;

  z-index: 1500;

  display: grid;

  gap: 16px;

  max-width: 720px;

  margin-inline: auto;

  padding: 20px 22px;

  border: 1px solid var(--line-dark);

  background: rgba(15, 13, 11, .94);

  color: #e9e2d9;

  box-shadow: var(--shadow);

  backdrop-filter: blur(16px);

  -webkit-backdrop-filter: blur(16px);

}

.cookie-bar p {

  margin: 0;

  color: #cfc6ba;

  font-size: .88rem;

  line-height: 1.6;

}

.cookie-bar a {

  color: var(--amber-soft);

  text-decoration: underline;

  text-underline-offset: 2px;

}

.cookie-bar__actions {

  display: flex;

  flex-wrap: wrap;

  gap: 10px;

}

.cookie-bar .btn {

  min-height: 42px;

  padding: 10px 18px;

}

.cookie-bar .btn:not(.btn--gold) {

  border-color: rgba(240, 235, 227, .35);

  color: var(--ash-soft);

}

.cookie-bar .btn:not(.btn--gold):hover {

  background: var(--ash-soft);

  color: var(--coal);

}



@media (min-width: 720px) {

  .cookie-bar {

    grid-template-columns: 1fr auto;

    align-items: center;

    left: 24px;

    right: 24px;

    bottom: 24px;

    padding: 22px 26px;

  }

}



/* Reveal motion */

.reveal {

  opacity: 0;

  transform: translateY(28px);

  transition: opacity .9s var(--ease-out), transform .9s var(--ease-out);

}

.reveal.is-visible {

  opacity: 1;

  transform: none;

}

.reveal-delay { transition-delay: .12s; }

.reveal-delay-2 { transition-delay: .24s; }



/* Tablet+ */

@media (min-width: 720px) {

  body { font-size: 17px; }

  .container,

  .container--narrow { width: min(1180px, calc(100% - 56px)); }

  --header-h: 84px;



  .hero { place-items: end stretch; }

  .hero__content { padding-bottom: clamp(80px, 10vw, 120px); }

  .hero__scroll { display: flex; }



  .brand-teasers { grid-template-columns: 1fr 1fr; }

  .brand-teasers--three .brand-card:last-child { grid-column: 1 / -1; }

  .brand-card { min-height: 680px; }



  .feature-strip {

    grid-template-columns: repeat(3, 1fr);

    gap: 28px;

    border-top: 0;

  }

  .feature {

    padding: 8px 8px 0;

    border-bottom: 0;

    border-top: 1px solid var(--line);

  }



  .gallery-grid {

    grid-template-columns: repeat(12, 1fr);

    gap: 14px;

  }

  .gallery-grid .gallery-card { grid-column: span 4; }

  .gallery-grid .gallery-card:nth-child(5n + 1),

  .gallery-grid .gallery-card:nth-child(5n + 4) { grid-column: span 7; }

  .gallery-grid .gallery-card:nth-child(5n + 2),

  .gallery-grid .gallery-card:nth-child(5n + 5) { grid-column: span 5; }

  .gallery-grid .gallery-card img { height: clamp(300px, 34vw, 520px); }

  .gallery-grid .gallery-card:nth-child(3n) img { height: clamp(360px, 42vw, 620px); }



  .dog-grid .gallery-card { grid-column: span 4; }

  .dog-grid .gallery-card:nth-child(4n + 1) { grid-column: span 7; }

  .dog-grid .gallery-card:nth-child(4n + 2) { grid-column: span 5; }



  .client-galleries { grid-template-columns: 1fr 1fr; }

  .process-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  .pricing-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }

  .included-band__grid { grid-template-columns: 1fr; }

  .included-band__grid--pair { grid-template-columns: 1fr 1fr; gap: 28px; }

  .guarantee-grid { grid-template-columns: 1fr; }

  .booking-steps { grid-template-columns: 1fr 1fr; gap: 0 40px; }

  .field-row { grid-template-columns: 1fr 1fr; gap: 0 28px; }

  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }

  .footer-grid > :first-child { grid-column: 1 / -1; }

  .footer-bottom {

    flex-direction: row;

    flex-wrap: wrap;

    align-items: center;

    justify-content: space-between;

  }

  .footer-adr {

    flex: 1 1 100%;

  }

  .lightbox { padding: 30px 70px; }

  .lightbox__nav {

    width: 56px;

    height: 70px;

    background: transparent;

  }

  .approach-grid {

    grid-template-columns: repeat(3, 1fr);

    gap: 28px;

    border-top: 0;

  }

  .approach-card {

    padding: 28px 12px 0 8px;

    border-bottom: 0;

    border-top: 1px solid var(--line-dark);

  }

  .approach-card__num {

    font-size: clamp(3.4rem, 5vw, 5.2rem);

  }

  .value-grid {

    grid-template-columns: repeat(3, 1fr);

    gap: 18px;

  }

}



/* Desktop */

@media (min-width: 1000px) {

  .brand-teasers--three {

    grid-template-columns: 1fr 1fr 1fr;

  }

  .brand-teasers--three .brand-card:last-child { grid-column: auto; }

  .brand-teasers--three .brand-card { min-height: 640px; }



  .intro-grid,

  .about-grid,

  .contact-grid {

    grid-template-columns: 1fr 1fr;

  }



  .framed-image { margin: 0; }

  .framed-image::before { inset: 18px; }



  .pricing-grid {

    grid-template-columns: repeat(3, 1fr);

    max-width: none;

  }

  .price-card--featured { transform: translateY(-10px); }

  .included-band__grid { grid-template-columns: repeat(3, 1fr); gap: 28px; }

  .included-band__grid--pair { grid-template-columns: repeat(2, 1fr); }

  .guarantee-grid { grid-template-columns: repeat(3, 1fr); }

  .booking-steps { grid-template-columns: repeat(4, 1fr); gap: 28px; }

  .booking-step {

    padding-top: 28px;

    border-bottom: 0;

  }



  .process-grid { grid-template-columns: repeat(3, 1fr); }

  .review-grid { grid-template-columns: repeat(3, 1fr); }

  .client-galleries { grid-template-columns: repeat(3, 1fr); }



  .footer-grid {

    grid-template-columns: 1.5fr 1fr 1fr;

  }

  .footer-grid > :first-child { grid-column: auto; }



  .hero__content {

    width: min(1100px, calc(100% - 80px));

  }

  .hero__brand { letter-spacing: .12em; }

}



/* Mobile nav */

@media (max-width: 999px) {

  .nav-toggle { display: block; }

  .nav__links {

    position: fixed;

    top: 0;

    left: 0;

    z-index: 1050;

    display: flex;

    width: 100%;

    height: 100vh;

    height: 100dvh;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 28px;

    margin: 0;

    padding: 96px 24px 48px;

    background: var(--coal);

    color: var(--ash-soft);

    opacity: 0;

    pointer-events: none;

    visibility: hidden;

    transition: opacity .35s, visibility .35s;

  }

  .nav__links.is-open {

    opacity: 1;

    pointer-events: auto;

    visibility: visible;

  }

  .nav__links a { font-size: .84rem; }

  .nav__links .btn {

    border-color: var(--amber);

    background: var(--amber);

    color: white;

  }

}



@media (max-width: 719px) {

  .hero__scroll { display: none; }

  .brand { letter-spacing: .16em; }

  .hero__actions { flex-direction: column; align-items: stretch; }

  .hero__actions .btn { width: 100%; }

  .hero__lead { max-width: none; }

  .page-hero { min-height: 88svh; }

  .page-hero h1 { font-size: clamp(2.6rem, 12vw, 4rem); }

}



@media (prefers-reduced-motion: reduce) {

  html { scroll-behavior: auto; }

  *,

  *::before,

  *::after {

    animation-duration: .01ms !important;

    animation-iteration-count: 1 !important;

    transition-duration: .01ms !important;

  }

  .reveal,

  .hero__content > *,

  .page-hero__content > * {

    opacity: 1;

    transform: none;

  }

  .hero__media img,

  .page-hero__media img { transform: none; }

  .review-marquee__track.is-animated { animation: none; }

  .photo-strip__viewport { scroll-behavior: auto; }

}