.remote-message-actions {
  display: block;
}

.remote-whatsapp-option {
  margin-top: clamp(2.75rem, 5vw, 4.5rem);
}

.remote-selected-clients {
  background: #000;
  padding-top: clamp(2.5rem, 5vw, 4.5rem);
}

.remote-color-grading-page .color-grading-reel {
  padding-bottom: clamp(2.5rem, 5vw, 4.5rem);
}

.remote-color-hero-copy {
  color: #d2d0cb;
  font-size: clamp(1rem, 1.55vw, 1.18rem);
  line-height: 1.5;
  margin: clamp(1.35rem, 2.5vw, 2rem) 0 0;
  max-width: 46rem;
  position: relative;
  z-index: 2;
}

.remote-color-hero-rate {
  font: 500 clamp(1.15rem, 2vw, 1.45rem)/1.2 'Playfair Display', serif;
  letter-spacing: -.025em;
  margin: clamp(1rem, 2vw, 1.5rem) 0 0;
  position: relative;
  white-space: nowrap;
  z-index: 2;
}

.remote-selected-clients .section-head {
  justify-content: center;
  text-align: center;
}

.remote-selected-clients .section-head h2 {
  font: 500 clamp(.95rem, 1.5vw, 1.25rem)/1.2 DM Mono, monospace;
  letter-spacing: .12em;
}

.remote-client-logo-row {
  border-top: 1px solid var(--line);
  align-items: center;
  display: flex;
  gap: clamp(3rem, 10vw, 10rem);
  justify-content: center;
  margin-inline: auto;
  padding: clamp(1.5rem, 3vw, 3rem);
  width: fit-content;
}

.remote-client-logo {
  align-items: center;
  display: flex;
  justify-content: center;
}

.remote-client-logo img {
  display: block;
  height: auto;
  max-height: 6rem;
  max-width: min(100%, 12rem);
  object-fit: contain;
  width: 100%;
}

@media (max-width: 700px) {
  .remote-client-logo-row {
    align-items: center;
    flex-direction: column;
    gap: 2.5rem;
  }
}

/* One existing rate, presented as a single dark glass panel. */
.remote-color-grading-page .remote-pricing{background:#000;color:#f2f1ed}
.remote-color-grading-page .remote-pricing .section-head{border-color:rgba(255,255,255,.18)}
.remote-color-grading-page .remote-pricing .section-label{color:#b5b2ac}
.remote-color-grading-page .remote-pricing-grid{position:relative;isolation:isolate;overflow:hidden;grid-template-columns:1fr 1fr 1.25fr;gap:0;margin-top:clamp(2.5rem,5vw,5rem);border:1px solid rgba(255,255,255,.15);border-radius:clamp(24px,3vw,32px);background-color:rgba(24,25,26,.6);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.14'/%3E%3C/svg%3E"),radial-gradient(ellipse 80% 60% at 16% 0%,rgba(255,255,255,.1),transparent 70%),linear-gradient(155deg,rgba(255,255,255,.055),transparent 40%,rgba(255,255,255,.025));box-shadow:0 22px 60px rgba(0,0,0,.32),inset 0 1px 1px rgba(255,255,255,.19),inset 0 -1px 2px rgba(255,255,255,.04);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.remote-color-grading-page .remote-pricing-grid>div,.remote-color-grading-page .remote-pricing-grid>div:first-child{min-height:0;padding:clamp(1.5rem,3vw,3rem);border-left:1px solid rgba(255,255,255,.12)}
.remote-color-grading-page .remote-pricing-grid>div:first-child{border-left:0}
.remote-color-grading-page .remote-pricing-grid span{color:#b9b6b0}
.remote-color-grading-page .remote-pricing-grid strong{color:#f5f3ef;font-size:clamp(1.35rem,2.3vw,2.1rem);line-height:1.2;margin-top:clamp(1.5rem,3vw,3rem)}
.remote-color-grading-page .remote-pricing-grid>div:nth-child(2) strong{font-size:clamp(1.65rem,3vw,2.8rem)}
.remote-color-grading-page .remote-pricing-grid ul{margin-top:clamp(1.5rem,3vw,3rem)}
.remote-color-grading-page .remote-pricing-grid li{color:#d0cdc7;line-height:1.5}
.remote-color-grading-page .remote-pricing-note{color:#f2f1ed}
.remote-color-grading-page .remote-pricing-scope{color:#b9b6b0}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.remote-color-grading-page .remote-pricing-grid:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.23);box-shadow:0 28px 70px rgba(0,0,0,.38),inset 0 1px 2px rgba(255,255,255,.24),inset 0 -1px 2px rgba(255,255,255,.05)}}
@media(max-width:700px){.remote-color-grading-page .remote-pricing-grid{grid-template-columns:1fr}.remote-color-grading-page .remote-pricing-grid>div,.remote-color-grading-page .remote-pricing-grid>div:first-child{padding:1.5rem;border-left:0;border-top:1px solid rgba(255,255,255,.12)}.remote-color-grading-page .remote-pricing-grid>div:first-child{border-top:0}.remote-color-grading-page .remote-pricing-grid strong,.remote-color-grading-page .remote-pricing-grid ul{margin-top:1rem}}
@media(prefers-reduced-motion:reduce){.remote-color-grading-page .remote-pricing-grid{transition:none}}

/* Let the pricing glass overlap and softly refract the heading underneath. */
.remote-color-grading-page .remote-pricing .section-head{position:relative;z-index:0;margin-bottom:0}
.remote-color-grading-page .remote-pricing-grid{z-index:1;margin-top:clamp(-1.1rem,-1.8vw,-.55rem)}

/* Glass surrounds for the existing client logos. */
.remote-color-grading-page .remote-pricing .section-head{border-top:0}
.remote-color-grading-page .remote-pricing-fi{letter-spacing:.035em}
.remote-color-grading-page .remote-client-logo img{mix-blend-mode:screen;max-width:100%;max-height:100%}

/* Shared glass panel for the clients and their heading. */
.remote-color-grading-page .remote-clients-glass{padding:clamp(2rem,5vw,4.5rem);border:1px solid rgba(255,255,255,.15);border-radius:clamp(20px,2.5vw,28px);background-color:rgba(255,255,255,.045);background-image:radial-gradient(ellipse at 18% 0%,rgba(255,255,255,.13),transparent 62%),linear-gradient(150deg,rgba(255,255,255,.055),transparent 45%,rgba(255,255,255,.025));-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 18px 44px rgba(0,0,0,.24),inset 0 1px 2px rgba(255,255,255,.23),inset 0 -1px 2px rgba(0,0,0,.15)}
.remote-color-grading-page .remote-clients-glass .section-head{border-top:0;padding-top:0;margin-bottom:clamp(2rem,4vw,3.5rem)}
.remote-color-grading-page .remote-client-logo-row{border-top:0;padding:0;margin:0 auto}
.remote-color-grading-page .remote-client-logo{width:clamp(7rem,13vw,10rem);height:clamp(5rem,9vw,7rem)}
.remote-color-grading-page .remote-pricing .section-head h2{margin-left:clamp(1rem,3vw,3rem);max-width:min(45rem,calc(100% - clamp(1rem,3vw,3rem)));font-size:clamp(2.7rem,5.8vw,6.2rem)}

.remote-color-grading-page .remote-clients-glass{width:min(100%,46rem);margin-inline:auto}
.remote-color-grading-page .remote-pricing .section-head h2{font-size:clamp(3.24rem,6.96vw,7.44rem);position:relative;top:clamp(1rem,2vw,1.5rem)}

/* A subtle glass glint, and a seamless transition from reviews. */
.remote-color-grading-page .remote-clients-glass{position:relative;isolation:isolate;overflow:hidden}
.remote-color-grading-page .remote-clients-glass::after{content:'';position:absolute;inset:-35% -100%;pointer-events:none;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.16) 49%,rgba(255,255,255,.025) 54%,transparent 61%);transform:translateX(-100%);opacity:0}
@media(prefers-reduced-motion:no-preference){.remote-color-grading-page .remote-clients-glass.is-revealed::after{animation:wedding-glass-glint 2.4s ease-in-out infinite}}
.remote-color-grading-page .remote-included{background:linear-gradient(to bottom,#000 0%,#0a0a0a 22%,#0a0a0a 100%)}
.remote-color-grading-page .remote-finishing-fi{letter-spacing:.035em}

/* Dark ambient colour fades to black at both section edges. */
.remote-color-grading-page .remote-pricing{background-color:#000;background-image:linear-gradient(to bottom,#000 0%,rgba(0,0,0,.96) 5%,transparent 38%,transparent 62%,rgba(0,0,0,.96) 95%,#000 100%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E"),linear-gradient(154deg,transparent 24%,rgba(92,92,92,.08) 42%,rgba(28,28,28,.18) 52%,transparent 69%),radial-gradient(ellipse 75% 28% at 5% 35%,rgba(105,105,105,.21),transparent 75%),radial-gradient(ellipse 26% 53% at 86% 52%,rgba(90,90,90,.16),transparent 75%),radial-gradient(ellipse 63% 20% at 54% 72%,rgba(108,108,108,.11),transparent 75%),radial-gradient(ellipse 48% 39% at 31% 45%,rgba(4,4,4,.62),transparent 76%),linear-gradient(120deg,#030303 16%,#101010 53%,#030303 85%);background-size:100% 100%,180px 180px,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%}
.remote-color-grading-page .remote-pricing .section-head h2{top:calc(-1 * clamp(2rem,4vw,3rem))}
.remote-color-grading-page .remote-pricing-line{display:block}
.remote-color-grading-page .remote-pricing-grid{margin-top:0}

.remote-color-grading-page .remote-pricing + .remote-color-testimonials > .section-head{border-top:0}

/* A more compact clients panel. */
.remote-color-grading-page .remote-clients-glass{width:min(100%,27rem);padding:clamp(1.35rem,3vw,2.4rem)}
.remote-color-grading-page .remote-clients-glass .section-head{margin-bottom:clamp(1.35rem,2.5vw,2rem)}
.remote-color-grading-page .remote-client-logo{width:clamp(6rem,10vw,8rem);height:clamp(4.5rem,7.5vw,6rem)}

.remote-color-grading-page .remote-client-logo--adidas img{transform:scale(1.32)}

.remote-color-grading-page .remote-client-logo-row{gap:clamp(1.5rem,4vw,3rem)}

/* Match the home glass panels' texture, edges and depth. */
.remote-color-grading-page .remote-clients-glass{border-color:rgba(255,255,255,.14);border-radius:clamp(7px,1vw,12px);background-color:rgba(15,16,17,.2);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.10'/%3E%3C/svg%3E");box-shadow:0 16px 42px rgba(0,0,0,.18),0 4px 14px rgba(0,0,0,.1),inset 0 1px 1px rgba(255,255,255,.25),inset 1px 0 1px rgba(255,255,255,.11),inset -1px -1px 2px rgba(255,255,255,.09),inset 0 -8px 18px rgba(0,0,0,.09)}
.remote-color-grading-page .remote-clients-glass::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse 70% 55% at 9% 0%,rgba(255,255,255,.13),transparent 65%),radial-gradient(ellipse 45% 32% at 92% 100%,rgba(255,255,255,.06),transparent 70%),linear-gradient(150deg,rgba(255,255,255,.055),transparent 38%,rgba(0,0,0,.025) 68%,rgba(255,255,255,.035));box-shadow:inset 0 2px 3px rgba(255,255,255,.08),inset 2px 0 3px rgba(255,255,255,.04),inset -2px -2px 4px rgba(0,0,0,.1)}
.remote-color-grading-page .remote-clients-glass > *{position:relative;z-index:1}
