/* CelmAgency visual identity. Original layout stays in styles.css. */
:root {
  --ink: #050505;
  --ink-soft: #0d0d0d;
  --navy: #151515;
  --navy-bright: #292929;
  --panel: #101010;
  --panel-solid: #141414;
  --text: #fff;
  --muted: #b0b0b0;
  --cyan: #dedede;
  --cyan-soft: #f5d547;
  --blue: #888;
  --red: #ef443b;
  --red-soft: #e7e7e7;
  --line: #2b2b2b;
  --legal-muted: #aaa;
  --legal-soft: #888;
  --brand-yellow: #f5d547;
  --brand-red: #ef443b;
}

body { background: var(--ink); }
body::before { background: none; }
::selection { color: #050505; background: var(--brand-yellow); }
.hero::before {
  background:
    radial-gradient(ellipse at 50% 0%, #ffffff12, transparent 49%),
    radial-gradient(ellipse at 0% 36%, #ffffff05, transparent 45%),
    #050505;
  pointer-events: none;
}
.hero::after {
  background: repeating-linear-gradient(90deg, transparent 0 119px, #ffffff05 119px 120px);
  mask-image: linear-gradient(#000, transparent 65%);
}
.brand {
  display: block;
  margin: 8px 0 22px;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -1px;
}
.brand::after { content: '.'; color: var(--brand-yellow); }
.audience-badge {
  border: 1px solid #f5d547a8;
  border-radius: 100px;
  background: #17150c;
  box-shadow: 0 0 18px #f5d5471c;
  color: var(--brand-yellow);
  font-size: 12px;
  letter-spacing: 1.6px;
}
.audience-badge::after { background: none; }
.audience-badge__signal { background: var(--brand-yellow); box-shadow: 0 0 8px #f5d54788; animation: none; }
h1 { letter-spacing: -1.2px; text-shadow: none; }
.hero-title-line--compact { color: #b0b0b0; white-space: normal; }
.text-accent {
  color: #fff;
  background: none;
  -webkit-text-fill-color: currentColor;
  filter: none;
  animation: none;
  transition: color 240ms ease;
}
h1 > .text-accent:last-child { margin-top: 10px; font-size: .65em; font-weight: 500; letter-spacing: -.3px; color: #aaa; }
.text-accent:is(:hover, :active) { color: var(--brand-yellow); }
.growth-partner {
  display: grid;
  grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr);
  width: min(100%, 1040px);
  min-height: 420px;
  margin: 0 0 30px;
  overflow: hidden;
  border: 1px solid #303030;
  border-radius: 12px;
  background: #101010;
  box-shadow: 0 16px 48px #0003;
  text-align: left;
}
.growth-partner__photo {
  position: relative;
  overflow: hidden;
  background: #1a1a1a;
}
.growth-partner__photo::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(90deg, transparent 55%, #101010 100%);
  pointer-events: none;
}
.growth-partner__photo img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  object-position: 50% 30%;
}
.growth-partner__pillars {
  display: grid;
  align-content: center;
  gap: 9px;
  width: auto;
  margin: 0;
  padding: 24px 28px;
  list-style: none;
}
.growth-partner__pillars li {
  position: relative;
  width: 100%;
  min-height: 78px;
  padding: 15px 20px 15px 48px;
  border: 1px solid #333;
  border-radius: 8px;
  background: linear-gradient(135deg, #1c1c1c, #141414);
  color: #f4f4f4;
  font-family: "Space Grotesk", Arial, sans-serif;
  font-size: clamp(.88rem, 1.18vw, .98rem);
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  transition: border-color 220ms ease, background 220ms ease, box-shadow 220ms ease;
}
.growth-partner__pillars li::before {
  position: absolute;
  top: 17px;
  left: 18px;
  color: var(--brand-yellow);
  font-family: "Space Grotesk", Arial, sans-serif;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 1px;
  content: "0" counter(list-item);
}
.growth-partner__pillars li:hover {
  border-color: #f5d54780;
  background: linear-gradient(135deg, #202020, #161616);
  box-shadow: 0 0 22px #f5d54716;
}
.video-frame, .testimonial-card, .written-testimonial-card,
.booking__calendar, .logo-carousel, .result-proof {
  border-color: #303030;
  border-radius: 12px;
  background: #101010;
  box-shadow: 0 16px 48px #0003;
  transition: border-color 240ms ease, box-shadow 240ms ease, background 240ms ease;
}
.video-frame::before { background: none; }
.testimonial-card::before, .written-testimonial-card::before,
.booking__calendar::before, .logo-carousel::before,
.testimonial-card::after, .written-testimonial-card::after,
.booking__calendar::after, .logo-carousel::after,
.result-proof::before, .result-proof::after { content: none; }
.testimonial-card, .written-testimonial-card, .result-proof {
  background: radial-gradient(420px circle at var(--pointer-x, 50%) var(--pointer-y, 0%), #ffffff06, transparent 75%), #101010;
}
:is(.testimonial-card, .written-testimonial-card, .result-proof):is(:hover, :focus-within, .is-touched) {
  border-color: #f5d54780;
  background: radial-gradient(420px circle at var(--pointer-x, 50%) var(--pointer-y, 0%), #f5d54712, transparent 75%), #111;
  box-shadow: 0 16px 48px #0003;
}
.cta-button {
  background: var(--brand-yellow);
  border-color: var(--brand-yellow);
  border-radius: 8px;
  color: #111;
  box-shadow: none;
  animation: none;
  transition: background 220ms ease, border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease;
}
.cta-button::after { content: none; display: none; }
.cta-button:is(:hover, :focus-visible, :active) {
  color: #080808;
  background: var(--brand-yellow);
  border-color: var(--brand-yellow);
  box-shadow: 0 8px 38px #f5d54724;
}
.trusted-creators { border-color: #282828; }
.trusted-creators__label { color: #aaa; }
.trusted-creator figcaption { color: #aaa; }
.trusted-creator__portrait {
  border-color: #555;
  box-shadow: none;
  transition: border-color 240ms ease, box-shadow 240ms ease;
}
.trusted-creator:is(:hover, :focus-within, :active, .is-touched) .trusted-creator__portrait {
  border-color: var(--brand-yellow);
  box-shadow: 0 0 22px #f5d54726;
}
.trusted-creators__grid { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
.review-summary {
  display: grid;
  place-items: center;
  gap: 4px;
  width: fit-content;
  margin: 42px auto 0;
  padding: 0;
  color: #fff;
  text-align: center;
}
.review-summary__brand {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: "Space Grotesk", Arial, sans-serif;
  font-size: clamp(1.55rem, 2.3vw, 1.95rem);
  font-weight: 700;
  letter-spacing: -1px;
}
.review-summary__star {
  color: #00b67a;
  font-size: 1.08em;
  line-height: 1;
}
.review-summary__rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #fff;
  font-family: "Space Grotesk", Arial, sans-serif;
  font-size: 1.1rem;
  font-weight: 500;
}
.review-summary__rating .review-summary__star { font-size: 1.05em; }
.review-summary__rating strong { font-weight: 500; letter-spacing: -.6px; }
.review-summary__count {
  margin: 0;
  color: #fff;
  font-family: "Space Grotesk", Arial, sans-serif;
  font-size: clamp(.82rem, 1.5vw, 1rem);
  font-weight: 500;
  letter-spacing: .65px;
  text-transform: uppercase;
}
.review-summary__count strong { color: #00b67a; font-weight: 500; }
.results { border-color: #252525; background: #080808; box-shadow: none; }
.section-heading::after, .booking__heading::after,
.written-testimonials__heading::after, .results-gallery__heading::after {
  background: linear-gradient(90deg, transparent, #ffffff45, transparent);
  box-shadow: none;
}
.booking__calendar iframe { background: #0a0a0a; }
.booking__fallback a { color: var(--brand-yellow); text-underline-offset: 4px; }
.booking__fallback a:hover { color: var(--brand-yellow); }
.written-testimonial-card__profile img { border-color: #444; box-shadow: none; }
.written-testimonial-card__meta { color: #aaa; }
.written-testimonial-card__rating { color: var(--brand-yellow); transition: color 240ms ease; }
.written-testimonial-card:is(:hover, :focus-within, .is-touched) .written-testimonial-card__rating { color: var(--brand-yellow); }
.written-testimonial-card:nth-child(3) { order: -3; }
.written-testimonial-card:nth-child(7) { order: -2; }
.written-testimonial-card:nth-child(8) { order: -1; }
.trusted-creator img, .written-testimonial-card__profile img,
.result-proof img, .youtube-preview-player__image {
  filter: grayscale(1);
  transition: filter 350ms ease, transform 350ms ease;
}
:is(.trusted-creator, .written-testimonial-card, .result-proof):is(:hover, :focus-within, :active, .is-touched) img,
.youtube-preview-player:is(:hover, :focus-visible, :active) .youtube-preview-player__image { filter: grayscale(0); }
.youtube-preview-player__play { border-color: var(--brand-red); background: var(--brand-red); }
.youtube-preview-player:is(:hover, :focus-visible, :active) .youtube-preview-player__play {
  background: var(--brand-red); border-color: var(--brand-red);
  box-shadow: 0 0 32px #ef443b55;
}
/* Main video and client portraits stay in their original colors. */
.hero .youtube-preview-player__image,
.hero .trusted-creator img { filter: none; }
.logo-item { filter: grayscale(1) invert(1) brightness(2.2); }
.logo-item:is(:hover, :active) { filter: grayscale(0); }
.logo-carousel:is(:hover, :focus-within) .logo-carousel-track { animation-play-state: paused; }
.result-proof:hover { border-color: #f5d54780; box-shadow: 0 16px 48px #0003; }
.legal { background: #050505; }
:focus-visible { outline: 2px solid var(--brand-yellow); outline-offset: 4px; }
/* Borderless metallic buttons with a soft outer aura. */
.cta-button {
  background: linear-gradient(115deg, #b99226 0%, #f5d547 28%, #fff2ac 47%, #f5d547 58%, #c5a032 100%);
  border: 0;
  justify-content: center;
  text-align: center;
  padding: 0 24px;
  box-shadow: 0 0 18px #f5d54728;
}
.cta-button::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent 35%, #ffffff65 50%, transparent 65%);
  transform: translateX(-130%);
  transition: transform 650ms ease;
}
.cta-button:is(:hover, :focus-visible, :active) {
  background: linear-gradient(115deg, #c5a032 0%, #ffdf58 28%, #fff5bd 47%, #ffdf58 58%, #d3ac37 100%);
  border: 0;
  box-shadow: 0 0 24px #f5d54740;
}
.cta-button:is(:hover, :focus-visible, :active)::before { transform: translateX(130%); }
.youtube-preview-player__play {
  background: linear-gradient(135deg, #9e2924 0%, #ef443b 38%, #ff9084 49%, #ef443b 60%, #aa2a24 100%);
  border: 0;
  box-shadow: 0 0 18px #ef443b30;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 220ms ease;
}
.youtube-preview-player:is(:hover, :focus-visible, :active) .youtube-preview-player__play {
  background: linear-gradient(135deg, #b42e27 0%, #f85247 38%, #ffaaa0 49%, #f85247 60%, #b42e27 100%);
  border: 0;
  box-shadow: 0 0 24px #ef443b45;
}

/* Decorative medical crosses around the main promise. */
h1 { position: relative; isolation: isolate; }
.hero-title-line { position: relative; z-index: 1; }
.health-cross {
  position: absolute;
  z-index: 0;
  display: block;
  width: 28px;
  aspect-ratio: 1;
  background: linear-gradient(135deg, #fff 0%, #f5d547 56%, #c89e27 100%);
  clip-path: polygon(34% 0, 66% 0, 66% 34%, 100% 34%, 100% 66%, 66% 66%, 66% 100%, 34% 100%, 34% 66%, 0 66%, 0 34%, 34% 34%);
  filter: drop-shadow(0 0 9px #f5d54775);
  opacity: .9;
  pointer-events: none;
}
.health-cross--left { top: 5%; left: clamp(-50px, -5vw, -24px); }
.health-cross--right {
  top: 38%;
  right: clamp(-50px, -5vw, -24px);
  width: 22px;
  background: linear-gradient(135deg, #fff 0%, #ef443b 65%, #a92b25 100%);
  filter: drop-shadow(0 0 9px #ef443b70);
}
.health-cross--top { top: 59%; right: 18%; width: 16px; opacity: .72; }

@media (max-width: 760px) {
  .brand { font-size: 20px; margin-top: 0; }
  .audience-badge { font-size: 10px; letter-spacing: 1px; }
  h1 { letter-spacing: -.8px; }
  .growth-partner { grid-template-columns: 1fr; min-height: 0; margin-bottom: 24px; }
  .growth-partner__photo { height: 330px; }
  .growth-partner__photo::after { background: linear-gradient(180deg, transparent 55%, #101010 100%); }
  .growth-partner__photo img { min-height: 330px; object-position: 50% 28%; }
  .growth-partner__pillars { gap: 9px; padding: 19px; }
  .growth-partner__pillars li { min-height: 0; padding: 16px 16px 16px 45px; font-size: .94rem; }
  .growth-partner__pillars li::before { top: 17px; left: 15px; }
  .health-cross--left { top: -16px; left: 3%; width: 18px; }
  .health-cross--right { top: 38%; right: 1%; width: 15px; }
  .health-cross--top { top: 66%; right: 20%; width: 11px; }
  .trusted-creators__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .trusted-creator,
  .trusted-creator:nth-child(4),
  .trusted-creator:nth-child(5) { grid-column: auto; }
  .review-summary { margin-top: 36px; }
  .review-summary__brand { font-size: 1.55rem; }
  .hero-title-line--compact { margin-top: 12px; font-size: .7em; line-height: 1.45; }
  h1 > .text-accent:last-child { font-size: .6em; line-height: 1.4; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
