/* Gallery and reviews use the same opening language as Rexa's service pages. */
.rexa-gallery,
.rexa-reviews {
  --ink: #171224;
  --deep: #151026;
  --paper: #fffaf2;
  --cream: #f4efe6;
  --coral: #ff6848;
  font-family: Manrope, Arial, sans-serif;
}

.rexa-gallery .site-header,
.rexa-reviews .site-header {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  height: 90px;
  padding: 0 max(36px, calc((100vw - 1320px) / 2));
  border-bottom: 1px solid rgba(255, 255, 255, .18);
  background: var(--deep);
  color: var(--paper);
}

.rexa-gallery .brand,
.rexa-reviews .brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  flex: none;
}

.rexa-gallery .brand img:first-child,
.rexa-reviews .brand img:first-child { width: 37px; height: 37px; flex: none; }
.rexa-gallery .brand .wordmark,
.rexa-reviews .brand .wordmark { display: block; width: 112px; height: auto; max-width: none; max-height: 29px; }

.rexa-gallery .header-links,
.rexa-reviews .site-header nav { display: flex; align-items: center; gap: 24px; min-width: 0; }
.rexa-gallery .header-links a,
.rexa-reviews .site-header nav a { font: 800 13px/1 Manrope, Arial, sans-serif; letter-spacing: 0; text-transform: none; }
.rexa-gallery .header-cta,
.rexa-reviews .nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 13px 17px;
  border-radius: 4px;
  background: var(--coral);
  color: var(--ink);
  white-space: nowrap;
  gap: 8px;
}
.rexa-gallery .header-cta img,
.rexa-reviews .nav-cta img { width: 15px; height: 15px; flex: none; filter: brightness(0); }

.rexa-gallery .hero,
.rexa-reviews .hero {
  display: grid;
  grid-template-columns: minmax(0, 58%) minmax(0, 42%);
  align-items: stretch;
  gap: 0;
  height: auto;
  min-height: 760px;
  padding: 0;
  background: var(--deep);
  color: var(--paper);
  isolation: isolate;
}
.rexa-gallery .hero::before { display: none; }
.rexa-gallery .hero-copy,
.rexa-reviews .hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-width: 0;
  max-width: none;
  padding: 70px clamp(28px, 5vw, 80px) 70px max(36px, calc((100vw - 1320px) / 2));
}
.rexa-gallery .hero h1,
.rexa-reviews .hero h1 {
  max-width: 780px;
  margin: 0;
  font: 800 clamp(46px, 5.2vw, 84px)/1 "DM Sans", Arial, sans-serif;
  letter-spacing: -.075em;
}
.rexa-gallery .hero h1 em,
.rexa-reviews .hero h1 em { color: var(--coral); font-style: normal; font-weight: 800; }
.rexa-gallery .hero-intro,
.rexa-reviews .hero-lede {
  max-width: 610px;
  margin: 28px 0 0;
  color: #e4dce4;
  font: 400 clamp(16px, 1.28vw, 20px)/1.6 Manrope, Arial, sans-serif;
}
.rexa-gallery .hero-anchor,
.rexa-reviews .button-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  min-height: 52px;
  margin: 30px 0 0;
  padding: 13px 19px;
  border: 1px solid var(--coral);
  border-radius: 4px;
  background: var(--coral);
  color: var(--ink);
  font: 850 13px/1.2 Manrope, Arial, sans-serif;
  text-decoration: none;
  white-space: nowrap;
}
.rexa-gallery .hero-anchor span { color: var(--ink); font-size: 17px; }
.rexa-reviews .hero-actions { margin-top: 0; }
.rexa-reviews .button-text { min-height: 52px; margin-top: 30px; padding: 13px 0; }

.rexa-gallery .hero-art,
.rexa-reviews .hero-visual { position: relative; z-index: -1; width: 100%; height: 100%; min-height: 760px; margin: 0; overflow: hidden; }
.rexa-gallery .hero-photo--main,
.rexa-reviews .photo-one {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}
.rexa-gallery .hero-photo--main img,
.rexa-reviews .photo-one img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
.rexa-gallery .hero-photo--side,
.rexa-gallery .hero-photo--detail,
.rexa-gallery .hero-art-stamp,
.rexa-gallery .hero-bottom,
.rexa-reviews .photo-two,
.rexa-reviews .visual-seal { display: none; }
.rexa-gallery .hero-art::after,
.rexa-reviews .hero-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(21, 16, 38, .28), transparent 45%), linear-gradient(0deg, rgba(21, 16, 38, .52), transparent 40%);
  pointer-events: none;
}

.rexa-gallery .gallery-section,
.rexa-reviews .featured,
.rexa-reviews .directory { background: var(--cream); }
.rexa-gallery .gallery-section h2,
.rexa-gallery .audience h2,
.rexa-gallery .closing h2,
.rexa-reviews .featured h2,
.rexa-reviews .directory h2,
.rexa-reviews .closing h2 {
  font-family: "DM Sans", Arial, sans-serif;
  font-weight: 800;
  font-style: normal;
  letter-spacing: -.07em;
}
.rexa-gallery h2 em,
.rexa-reviews h2 em { font-style: normal; font-weight: 800; color: var(--coral); }
.rexa-gallery .gallery-section h2,
.rexa-reviews .featured h2,
.rexa-reviews .directory h2 { font-size: clamp(34px, 3.5vw, 54px); line-height: 1.07; }
.rexa-gallery .audience-heading h2,
.rexa-gallery .closing h2,
.rexa-reviews .closing h2 { font-size: clamp(38px, 4.2vw, 60px); line-height: 1.03; }
.rexa-gallery .comment-source,
.rexa-gallery .comment-author { color: #a84935; }
.rexa-gallery .audience-all:hover { color: #a84935; }
.rexa-gallery .closing { background: var(--coral); }
.rexa-gallery .closing h2 em { color: var(--ink); }
.rexa-gallery .closing-actions a { border-radius: 4px; }
.rexa-gallery .source-links a,
.rexa-reviews .quote-card-bottom a { color: #a84935; }
.rexa-reviews .trust-strip { background: #f0e6df; }
.rexa-gallery .audience,
.rexa-reviews .social-voice { background: #eee5df; }

@media (max-width: 760px) {
  .rexa-gallery .site-header,
  .rexa-reviews .site-header { height: 70px; padding: 0 18px; gap: 10px; }
  .rexa-gallery .brand,
  .rexa-reviews .brand { gap: 8px; }
  .rexa-gallery .brand img:first-child,
  .rexa-reviews .brand img:first-child { width: 30px; height: 30px; }
  .rexa-gallery .brand .wordmark,
  .rexa-reviews .brand .wordmark { display: block; width: 90px; max-height: 25px; }
  .rexa-gallery .header-links,
  .rexa-reviews .site-header nav { gap: 0; flex: none; }
  .rexa-gallery .header-link,
  .rexa-reviews .site-header nav > a:not(.nav-cta) { display: none; }
  .rexa-gallery .header-cta,
  .rexa-reviews .nav-cta { min-height: 42px; padding: 10px 12px; font-size: 11px; line-height: 1; white-space: nowrap; }
  .rexa-gallery .header-cta span,
  .rexa-reviews .nav-cta span { display: none; }

  .rexa-gallery .hero,
  .rexa-reviews .hero { position: relative; display: block; min-height: 760px; }
  .rexa-gallery .hero-art,
  .rexa-reviews .hero-visual { position: absolute; inset: 0; z-index: -1; min-height: 0; height: 100%; max-width: none; }
  .rexa-gallery .hero-art::after,
  .rexa-reviews .hero-visual::after {
    background: linear-gradient(0deg, rgba(21, 16, 38, .99) 0%, rgba(21, 16, 38, .93) 34%, rgba(21, 16, 38, .48) 68%, rgba(21, 16, 38, .16) 100%);
  }
  .rexa-gallery .hero-copy,
  .rexa-reviews .hero-copy { position: relative; z-index: 1; min-height: 760px; justify-content: flex-end; padding: 280px 22px 55px; }
  .rexa-gallery .hero h1,
  .rexa-reviews .hero h1 { font-size: clamp(39px, 11vw, 58px); }
  .rexa-gallery .hero-intro,
  .rexa-reviews .hero-lede { margin-top: 20px; font-size: 15px; }
  .rexa-gallery .hero-anchor,
  .rexa-reviews .button-primary { margin-top: 26px; }
  .rexa-reviews .hero-actions { flex-wrap: wrap; gap: 10px; }
  .rexa-reviews .button-text { margin-top: 26px; }
  .rexa-gallery .gallery-section h2,
  .rexa-reviews .featured h2,
  .rexa-reviews .directory h2 { font-size: 34px; }
  .rexa-gallery .audience-heading h2,
  .rexa-gallery .closing h2,
  .rexa-reviews .closing h2 { font-size: clamp(38px, 10.5vw, 50px); }
}

@media (max-width: 380px) {
  .rexa-gallery .brand .wordmark,
  .rexa-reviews .brand .wordmark { width: 82px; }
  .rexa-gallery .header-cta { font-size: 10px !important; }
  .rexa-gallery .hero-copy,
  .rexa-reviews .hero-copy { padding-top: 250px; }
}