/* A blue paper collage: decorative geometry sits behind the original photographs. */
:root {
  --ice: #e5f1ff;
  --powder: #c9def9;
  --sky: #91bbed;
  --periwinkle: #bac9f4;
  --midnight: #14233f;
}

.hero {
  isolation: isolate;
  background: linear-gradient(125deg, #f2f7fd 5%, #e5effd 55%, #cadffa 100%);
}
.hero::before, .hero::after,
.gallery-heading::before, .gallery-heading::after,
.booking-finale::before, .booking-finale::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
}
.hero::before {
  width: 48vw;
  height: 48vw;
  border: clamp(25px, 4vw, 70px) solid #9dc1f080;
  border-radius: 50%;
  left: -24vw;
  top: 36%;
}
.hero::after {
  width: 42vw;
  height: 27vw;
  border-radius: 50%;
  background: linear-gradient(135deg, #aecff8 12%, #8fafea 90%);
  right: -9vw;
  bottom: 11%;
  transform: rotate(-27deg);
  opacity: .65;
}
.hero-bottom { border-color: #9db7d180; }
.hero-round-link { background: #f2f7fd; }

.selected-work, .gallery-collection {
  position: relative;
  isolation: isolate;
  overflow: clip;
}
.selected-work {
  background: linear-gradient(180deg, var(--paper) 0%, #f1f5fc 48%, #edf4fd 100%);
}
.work-plate, .gallery-item {
  position: relative;
  isolation: isolate;
}
.work-plate::before, .work-plate::after,
.gallery-item::before, .gallery-item::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
}
.work-plate::before {
  width: 118%;
  aspect-ratio: 1;
  top: 7%;
  left: -8%;
  border-radius: 50%;
  background: linear-gradient(140deg, #d4e7ff 5%, #82adee 100%);
}
.work-plate-1::before { top: -4%; left: -22%; width: 126%; }
.work-plate-2::before {
  background: none;
  border: clamp(20px, 3vw, 48px) solid #9fbde9;
  width: 133%;
  left: -14%;
  top: 9%;
}
.work-plate-3::before {
  border-radius: 45% 45% 8% 8%;
  width: 110%;
  height: 100%;
  left: 5%;
  top: -4%;
  transform: rotate(13deg);
  background: linear-gradient(150deg, #c4d2f8, #a6cbf7);
}
.work-plate-4::before { width: 112%; left: 7%; top: -6%; background: linear-gradient(140deg, #b5d5ff, #729fdc); }
.work-plate-5::before {
  border-radius: 0;
  top: -8%;
  left: -16%;
  width: 128%;
  transform: rotate(12deg);
  background: #bad5f8;
  clip-path: polygon(50% 0, 61% 26%, 85% 15%, 74% 39%, 100% 50%, 74% 61%, 85% 85%, 61% 74%, 50% 100%, 39% 74%, 15% 85%, 26% 61%, 0 50%, 26% 39%, 15% 15%, 39% 26%);
}
.work-plate figcaption, .gallery-item figcaption { position: relative; }
.work-plate .photo-button, .gallery-item .photo-button { box-shadow: 0 14px 26px #243c5b12; }
.work-statement { padding-left: 3%; }

.artist { background: var(--midnight); }
.artist-copy h2 em, .artist-mark { color: var(--powder); }
.artist-copy p { color: #e3eaf4; }
.artist a:focus-visible { outline-color: var(--powder); }
.services { background: linear-gradient(150deg, #f7faff, #e9f3ff); }
.faq-section { background: #f7faff; border-top-color: #bccce0; }
.service-row, .service-content dl > div, .faq-list details { border-bottom-color: #bccce0; }
.button-white:hover { background: var(--powder); }

.booking-finale {
  isolation: isolate;
  background: linear-gradient(115deg, #edf6ff 0%, #deedff 50%, #c7def9 100%);
}
.booking-finale::before {
  width: 42vw;
  height: 42vw;
  border: 4vw solid #9bc3f066;
  border-radius: 50%;
  left: -25vw;
  top: -10%;
}
.booking-finale::after {
  width: 34vw;
  height: 34vw;
  border: 1px solid #5e90ce70;
  border-radius: 50%;
  right: -15vw;
  bottom: -26%;
  box-shadow: 0 0 0 30px #b8d4f566, 0 0 0 65px #c5def666;
}
.site-footer { background: #f3f7fd; }
.lightbox button:focus-visible { outline-color: var(--powder); }

.gallery-page { background: #eff5fd; }
.gallery-page .site-header { background: #f4f8fe; border-bottom-color: #c4d5eb; }
.gallery-page .mobile-menu { background: #f4f8fe; }
.gallery-heading {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(112deg, #f5f9fe 0%, #e2edfc 65%, #ccdefb 100%);
}
.gallery-heading::before {
  width: 610px;
  height: 610px;
  border-radius: 50%;
  background: linear-gradient(135deg, #c6dffd, #91b9ec);
  right: -250px;
  top: -310px;
}
.gallery-heading::after {
  width: 440px;
  height: 220px;
  border: 22px solid #a1bce773;
  border-radius: 50%;
  right: 0;
  bottom: -75px;
  transform: rotate(-26deg);
}
.gallery-collection {
  padding-top: 8px;
  background: linear-gradient(180deg, #e9f1fd 0, #f6f9ff 1500px, #eaf2ff 3600px, #f4f8fd 100%);
}
.gallery-grid { column-gap: clamp(35px, 4.6vw, 80px); row-gap: 105px; padding: 32px 18px 0; }
.gallery-item::before {
  width: 117%;
  aspect-ratio: 1;
  left: -11%;
  top: -5%;
  border-radius: 50%;
  background: linear-gradient(145deg, #d2e5ff 4%, #88b1eb 100%);
}
.gallery-item:nth-child(6n+2)::before {
  width: 124%;
  left: -12%;
  top: 8%;
  background: none;
  border: clamp(20px, 2.2vw, 34px) solid #9dbcea;
}
.gallery-item:nth-child(6n+3)::before {
  border-radius: 46% 46% 8% 8%;
  background: linear-gradient(160deg, #c4d3f5, #9ec9f8);
  top: -3%;
  left: -1%;
  height: 92%;
  width: 105%;
  transform: rotate(9deg);
}
.gallery-item:nth-child(6n+4)::before {
  left: -9%;
  top: 20%;
  background: linear-gradient(140deg, #b7d6fc, #98afe4);
}
.gallery-item:nth-child(6n+5)::before {
  width: 132%;
  left: -16%;
  top: -8%;
  background: #b6d4f8;
  border-radius: 0;
  transform: rotate(-10deg);
  clip-path: polygon(50% 0, 61% 26%, 85% 15%, 74% 39%, 100% 50%, 74% 61%, 85% 85%, 61% 74%, 50% 100%, 39% 74%, 15% 85%, 26% 61%, 0 50%, 26% 39%, 15% 15%, 39% 26%);
}
.gallery-item:nth-child(6n+6)::before {
  background: none;
  border: 1px solid #71a4e4;
  width: 117%;
  height: 80%;
  top: -4%;
  left: -5%;
  border-radius: 50%;
  transform: rotate(-24deg);
  box-shadow: 0 0 0 18px #b9d6f65e;
}
.gallery-item::after {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--blue);
  right: -22px;
  top: -20px;
}
.gallery-item:nth-child(2n)::after { width: 9px; height: 9px; left: -21px; top: 36px; }
.gallery-item figcaption { margin-top: 17px; font-size:16px; line-height: 1.65; }
.gallery-toolbar { border-top-color: #6886aa; }
.gallery-end { color: #4c607a; }
.gallery-booking {
  background: linear-gradient(120deg, #daeaff, #bed7f7);
  color: var(--ink);
}
.gallery-booking h2 em { color: var(--blue); }
.gallery-booking .button { background: var(--blue); color: white; }
.gallery-booking .button:hover { background: #073787; }

@media (max-width: 700px) {
  .hero::before { width: 78vw; height: 78vw; left: -58vw; top: 28%; border-width: 24px; }
  .hero::after { width: 70vw; height: 52vw; right: -35vw; bottom: 20%; }
  .work-plate-1::before { width: 118%; left: -17%; top: -3%; }
  .work-plate-2::before { width: 119%; left: -9%; border-width: 21px; }
  .work-plate-3::before { left: 1%; width: 109%; }
  .work-plate-4::before { width: 117%; left: -5%; }
  .work-plate-5::before { width: 119%; left: -8%; }
  .work-statement { padding-left: 0; }
  .gallery-heading::before { width: 330px; height: 330px; right: -200px; top: -150px; }
  .gallery-heading::after { width: 230px; height: 135px; right: -80px; bottom: -50px; border-width: 15px; }
  .gallery-grid { padding: 22px 7px 0; column-gap: 29px; row-gap: 54px; }
  .gallery-item:nth-child(6n+2)::before { border-width: 13px; }
  .gallery-item:nth-child(6n+6)::before { box-shadow: 0 0 0 9px #b9d6f65e; }
  .gallery-item::after { width: 9px; height: 9px; right: -11px; top: -10px; }
  .gallery-item:nth-child(2n)::after { width: 5px; height: 5px; left: -11px; top: 18px; }
  .gallery-item figcaption { font-size:16px; margin-top: 13px; }
  .booking-finale::before { width: 75vw; height: 75vw; left: -61vw; border-width: 8vw; top: 13%; }
  .booking-finale::after { width: 62vw; height: 62vw; right: -51vw; bottom: -26%; box-shadow: 0 0 0 16px #b8d4f566, 0 0 0 36px #c5def666; }
}
@media (max-width: 360px) {
  .gallery-grid { column-gap: 24px; padding-left: 5px; padding-right: 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .work-plate::before, .gallery-item::before { animation: none; }
}