/*
 * ============================================================
 * THINKERSTREET — COMING SOON CAROUSEL
 * ============================================================
 * Self-contained page styles.
 * All carousel selectors are scoped to .coming_soon.
 */

.coming_soon {
  --coming-blue:#38a7ff;
  --coming-green:#33ff72;
  --coming-magenta:#ff38e8;
  --coming-accent:var(--coming-blue);
  --coming-serif:Georgia,"Times New Roman",serif;
  --coming-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  position:fixed;

  /*
   * If your toolbar is about 60–70px tall,
   * this keeps Coming Soon below it.
   */
  inset:70px 0 0;

  width:100%;
  height:calc(100dvh - 70px);

  box-sizing:border-box;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  gap:0;

  padding:12px 14px 18px;

  overflow:hidden;

  isolation:isolate;
}

/* ============================================================
   PAGE INTRO
   ============================================================ */

.coming_soon .coming-intro {
  position:relative;
  z-index:4;

  width:min(760px,94vw);

  flex:0 0 auto;

  margin:0 auto 4px;

  text-align:center;
}

.coming_soon .coming-eyebrow {
  margin:0 0 6px;
  color:color-mix(in srgb,var(--coming-accent) 72%,white);
  font:700 8px/1 var(--coming-mono);
  letter-spacing:.22em;
  text-transform:uppercase;
}

.coming_soon .coming-intro h1 {
  margin:0;
  color:var(--ink,#f5f7fb);
  font:600 clamp(34px,5.8vw,58px)/.96 var(--coming-serif);
  letter-spacing:-.045em;
}

.coming_soon .coming-lede {
  margin:9px 0 0;
  color:var(--muted,rgba(245,247,251,.58));
  font-size:12px;
  line-height:1.5;
}


/* ============================================================
   CAROUSEL LAYOUT
   ============================================================ */

.coming_soon .coming-carousel-layer {
  position:relative;
  z-index:3;

  width:min(1060px,100%);

  /*
   * Don't force the page taller.
   */
  height:clamp(330px,54vh,430px);
  min-height:0;

  flex:0 1 auto;

  display:grid;
  grid-template-rows:minmax(250px,1fr) auto;

  align-items:center;
  justify-items:center;

  isolation:isolate;

  opacity:0;
  transform:translateY(14px) scale(.986);

  transition:
    opacity .8s ease,
    transform 1s cubic-bezier(.16,1,.3,1);
}

.coming_soon .coming-carousel-layer.ready {
  opacity:1;
  transform:none;
}

.coming_soon .coming-carousel-shell {
  width:100%;
  min-height:270px;
  overflow:hidden;
  display:grid;
  place-items:center;
  perspective:1700px;
  transition:filter .34s ease,transform .45s cubic-bezier(.16,1,.3,1),opacity .34s ease;
}

.coming_soon .coming-carousel-stage {
  position:relative;
  width:min(760px,98vw);
  height:270px;
  display:grid;
  place-items:center;
  perspective:1700px;
  transform-style:preserve-3d;
  cursor:grab;
  touch-action:pan-y;
  user-select:none;
  -webkit-user-select:none;
  transition:transform .75s cubic-bezier(.16,1,.3,1);
}

.coming_soon .coming-carousel-stage.dragging {
  cursor:grabbing;
  transition:none;
}

.coming_soon .coming-carousel-stage::before {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:410px;
  height:410px;
  margin:-205px 0 0 -205px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.055),transparent 64%);
  filter:blur(18px);
  opacity:.54;
  transform:translateZ(-230px);
  pointer-events:none;
}


/* ============================================================
   PROJECT CARDS
   ============================================================ */

.coming_soon .coming-card {
  --edge:rgba(255,255,255,.18);
  --shadow-color:rgba(56,167,255,.26);
  --card-accent:var(--coming-blue);
  --card-accent-2:#6ed7ff;

  position:absolute;
  left:50%;
  top:50%;
  width:246px;
  height:246px;
  margin:-123px 0 0 -123px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid var(--edge);
  border-radius:40px;
  outline:0;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.014));
  color:#fff;
  box-shadow:0 18px 54px color-mix(in srgb,var(--shadow-color) 42%,transparent),inset 0 0 20px rgba(255,255,255,.03);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  opacity:.88;
  transform:translate3d(0,0,-300px) rotateY(0deg) scale(.58);
  filter:saturate(.72) blur(.28px);
  transform-style:preserve-3d;
  will-change:transform,filter;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform 1.28s cubic-bezier(.16,1,.3,1),filter .95s ease,box-shadow .95s ease,opacity .78s ease,border-color .7s ease;
}

.coming_soon .coming-card[data-theme="law"] {
  --edge:rgba(150,220,255,.42);
  --shadow-color:rgba(20,120,255,.38);
  --card-accent:#38a7ff;
  --card-accent-2:#6ed7ff;
}

.coming_soon .coming-card[data-theme="thought"] {
  --edge:rgba(255,140,242,.42);
  --shadow-color:rgba(210,20,200,.35);
  --card-accent:#ff38e8;
  --card-accent-2:#ff9af6;
}

.coming_soon .coming-card[data-theme="golf"] {
  --edge:rgba(140,255,170,.36);
  --shadow-color:rgba(20,200,75,.34);
  --card-accent:#33ff72;
  --card-accent-2:#9cff6f;
}

.coming_soon .coming-card.active {
  z-index:8;
  opacity:1;
  transform:translate3d(0,0,150px) rotateY(0deg) scale(1);
  filter:none;
  box-shadow:0 32px 106px color-mix(in srgb,var(--shadow-color) 74%,transparent),0 0 74px color-mix(in srgb,var(--card-accent) 28%,transparent),inset 0 0 36px color-mix(in srgb,var(--card-accent) 14%,transparent);
}

.coming_soon .coming-card.prev {
  z-index:3;
  opacity:.9;
  transform:translate3d(-220px,16px,-185px) rotateY(60deg) rotateX(3deg) scale(.66);
  animation:coming-float-left 11.5s ease-in-out infinite;
}

.coming_soon .coming-card.next {
  z-index:3;
  opacity:.9;
  transform:translate3d(220px,-10px,-185px) rotateY(-60deg) rotateX(-3deg) scale(.66);
  animation:coming-float-right 12s ease-in-out infinite;
}

.coming_soon .coming-card.active.entering {
  animation:coming-focus-flare 1.18s cubic-bezier(.16,1,.3,1) both;
}

.coming_soon .coming-card:hover,
.coming_soon .coming-card:focus-visible {
  opacity:1!important;
  filter:none!important;
  border-color:color-mix(in srgb,var(--card-accent) 72%,white);
  box-shadow:0 46px 150px var(--shadow-color),0 0 92px color-mix(in srgb,var(--card-accent) 34%,transparent),inset 0 0 50px color-mix(in srgb,var(--card-accent) 18%,transparent);
}

@keyframes coming-float-left {
  0%,100% { margin-top:-123px;filter:saturate(.62) blur(.65px); }
  50% { margin-top:-129px;filter:saturate(.78) blur(.34px); }
}

@keyframes coming-float-right {
  0%,100% { margin-top:-123px;filter:saturate(.62) blur(.65px); }
  50% { margin-top:-117px;filter:saturate(.78) blur(.34px); }
}

@keyframes coming-focus-flare {
  0% { transform:translate3d(0,0,-20px) rotateY(-10deg) rotateX(3deg) scale(.88);filter:saturate(.92); }
  55% { transform:translate3d(0,0,168px) rotateY(3deg) scale(1.035);filter:saturate(1.2); }
  100% { transform:translate3d(0,0,150px) rotateY(0deg) scale(1);filter:none; }
}


/* ============================================================
   CARD ATMOSPHERE / ORBITS
   ============================================================ */

.coming_soon .coming-nebula {
  position:absolute;
  width:276px;
  height:276px;
  border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--card-accent) 22%,transparent),color-mix(in srgb,var(--card-accent) 8%,transparent) 38%,transparent 69%),conic-gradient(from 0deg,transparent,rgba(245,214,122,.08),transparent,color-mix(in srgb,var(--card-accent) 12%,transparent),transparent);
  filter:blur(20px);
  box-shadow:0 0 30px color-mix(in srgb,var(--card-accent) 32%,transparent),0 0 80px color-mix(in srgb,var(--card-accent-2) 18%,transparent),inset 0 0 44px color-mix(in srgb,var(--card-accent) 18%,transparent);
  animation:coming-nebula-spin 13s linear infinite,coming-gas-pulse 3.8s ease-in-out infinite;
}

.coming_soon .coming-orbit {
  position:absolute;
  inset:4px;
  border-radius:50%;
  pointer-events:none;
  animation:coming-orbit 6.5s linear infinite;
}

.coming_soon .coming-orbit.mid { inset:23px;animation-duration:9.5s;animation-direction:reverse; }
.coming_soon .coming-orbit.slow { inset:41px;animation-duration:15s; }

.coming_soon .coming-spark,
.coming_soon .coming-golf-orb,
.coming_soon .coming-cinema-chip {
  position:absolute;
  display:grid;
  place-items:center;
  filter:drop-shadow(0 0 9px var(--card-accent));
  animation:coming-twinkle 2.2s ease-in-out infinite;
}

.coming_soon .coming-spark { width:28px;height:28px; }
.coming_soon .coming-spark::before {
  content:"";
  width:100%;
  height:100%;
  background:var(--card-accent-2);
  clip-path:polygon(50% 0%,61% 35%,100% 50%,61% 65%,50% 100%,39% 65%,0% 50%,39% 35%);
}

.coming_soon .coming-golf-orb {
  width:24px;
  height:24px;
  border-radius:50%;
  background:radial-gradient(circle at 32% 30%,white,#ecfff0 55%,#b7e6bc 100%);
  box-shadow:inset -4px -5px 9px rgba(0,0,0,.18);
}

.coming_soon .coming-cinema-chip {
  width:30px;
  height:22px;
  border:2px solid var(--card-accent-2);
  border-radius:4px;
  opacity:.9;
}

.coming_soon .coming-cinema-chip::before {
  content:"";
  position:absolute;
  left:4px;
  right:4px;
  top:-7px;
  height:6px;
  background:repeating-linear-gradient(90deg,var(--card-accent-2) 0 5px,transparent 5px 10px);
}

.coming_soon .a { top:0;left:121px; }
.coming_soon .b { right:6px;top:158px;width:21px;height:21px; }
.coming_soon .c { left:20px;bottom:36px;width:22px;height:22px; }
.coming_soon .d { right:45px;top:29px; }
.coming_soon .e { left:55px;top:26px; }
.coming_soon .f { right:86px;bottom:2px; }

@keyframes coming-nebula-spin { to { transform:rotate(360deg); } }
@keyframes coming-orbit { to { transform:rotate(360deg); } }
@keyframes coming-gas-pulse {
  0%,100% { scale:1;opacity:.78;filter:blur(20px) saturate(1.05); }
  42% { scale:1.14;opacity:1;filter:blur(15px) saturate(1.5); }
  68% { scale:.97;opacity:.88;filter:blur(24px) saturate(1.2); }
}
@keyframes coming-twinkle {
  0%,100% { opacity:.5;scale:.72; }
  42% { opacity:1;scale:1.22; }
}


/* ============================================================
   LOGOS
   ============================================================ */

.coming_soon .coming-logo-wrap {
  position:relative;
  z-index:5;
  width:194px;
  height:194px;
  display:grid;
  place-items:center;
  animation:coming-logo-breathe 4.2s ease-in-out infinite;
}

.coming_soon .coming-logo-wrap img {
  width:100%;
  height:100%;
  object-fit:contain;
  filter:drop-shadow(0 0 13px var(--card-accent)) drop-shadow(0 0 40px color-mix(in srgb,var(--card-accent) 58%,transparent));
}

.coming_soon .coming-card.active .coming-logo-wrap {
  transform:scale(1.2);
  transition:transform .95s cubic-bezier(.16,1,.3,1);
}

.coming_soon .coming-card.active .coming-logo-wrap img {
  filter:drop-shadow(0 0 20px var(--card-accent)) drop-shadow(0 0 66px color-mix(in srgb,var(--card-accent) 72%,transparent)) drop-shadow(0 0 120px color-mix(in srgb,var(--card-accent) 26%,transparent));
}

@keyframes coming-logo-breathe {
  50% { transform:scale(1.05) rotate(.8deg); }
}


/* ============================================================
   ACTIVE PROJECT TITLE
   ============================================================ */

.coming_soon .coming-active-title {
  width:min(760px,94vw);
  min-height:84px;
  margin-top:1px;
  padding:4px 18px 8px;
  border:0;
  outline:0;
  background:transparent;
  color:#fff;
  text-align:center;
  cursor:pointer;
  transition:filter .34s ease,opacity .34s ease,transform .38s cubic-bezier(.16,1,.3,1);
}

.coming_soon .coming-active-title.swap {
  animation:coming-title-swap .54s cubic-bezier(.16,1,.3,1) both;
}

.coming_soon .coming-active-kicker {
  display:block;
  margin-bottom:4px;
  color:var(--coming-accent);
  font:650 8px/1 var(--coming-mono);
  letter-spacing:.18em;
  text-transform:uppercase;
}

.coming_soon .coming-active-heading {
  display:block;
  font:600 clamp(27px,4.3vw,41px)/1 var(--coming-serif);
  letter-spacing:-.035em;
  text-wrap:balance;
}

.coming_soon .coming-active-more {
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.34);
  font:600 7px/1 var(--coming-mono);
  letter-spacing:.16em;
}

.coming_soon .coming-active-title:hover .coming-active-more,
.coming_soon .coming-active-title:focus-visible .coming-active-more {
  color:rgba(255,255,255,.8);
}

@keyframes coming-title-swap {
  from { opacity:.18;transform:translateY(12px);filter:blur(4px); }
  to { opacity:1;transform:none;filter:none; }
}


/* ============================================================
   DETAIL OVERLAY
   ============================================================ */

.coming_soon .coming-detail-overlay {
  position:absolute;
  inset:0;
  z-index:90;
  display:grid;
  place-items:center;
  padding:18px;
  opacity:0;
  pointer-events:none;
  transition:opacity .32s ease;
}

.coming_soon .coming-detail-overlay.open {
  opacity:1;
  pointer-events:auto;
}

.coming_soon .coming-detail-backdrop {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  background:rgba(0,0,0,.32);
  cursor:default;
}

.coming_soon .coming-detail-glass {
  position:relative;
  z-index:2;
  width:min(610px,92vw);
  padding:28px 30px 24px;
  box-sizing:border-box;
  border:1px solid rgba(255,255,255,.17);
  border-radius:27px;
  background:linear-gradient(180deg,rgba(12,17,28,.72),rgba(3,6,12,.82));
  box-shadow:0 28px 100px rgba(0,0,0,.52),0 0 54px color-mix(in srgb,var(--coming-accent) 14%,transparent),inset 0 0 32px rgba(255,255,255,.02);
  backdrop-filter:blur(26px) saturate(1.2);
  -webkit-backdrop-filter:blur(26px) saturate(1.2);
  transform:translateY(14px) scale(.975);
  transition:transform .38s cubic-bezier(.16,1,.3,1);
}

.coming_soon .coming-detail-overlay.open .coming-detail-glass { transform:none; }

.coming_soon .coming-detail-kicker {
  margin:0 0 7px;
  color:var(--coming-accent);
  font:700 8px/1 var(--coming-mono);
  letter-spacing:.18em;
  text-transform:uppercase;
}

.coming_soon .coming-detail-title {
  margin:0;
  color:#fff;
  font:600 clamp(32px,5vw,48px)/.98 var(--coming-serif);
  letter-spacing:-.035em;
}

.coming_soon .coming-detail-copy {
  margin:14px 0 0;
  color:rgba(255,255,255,.68);
  font-size:13px;
  line-height:1.68;
}

.coming_soon .coming-detail-open {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:36px;
  margin-top:18px;
  padding:0 13px;
  border:1px solid color-mix(in srgb,var(--coming-accent) 48%,rgba(255,255,255,.18));
  border-radius:999px;
  background:color-mix(in srgb,var(--coming-accent) 9%,transparent);
  color:#fff;
  text-decoration:none;
  font:700 8px/1 var(--coming-mono);
  letter-spacing:.12em;
}

.coming_soon .coming-detail-dismiss {
  margin:15px 0 0;
  color:rgba(255,255,255,.30);
  font:600 7px/1 var(--coming-mono);
  letter-spacing:.14em;
}

.coming_soon.detail-open .coming-carousel-shell,
.coming_soon.detail-open .coming-active-title {
  filter:blur(11px) saturate(.66);
  opacity:.48;
  transform:scale(.985);
  pointer-events:none;
}


/* ============================================================
   NEWSLETTER
   ============================================================ */

.coming_soon .coming-newsletter {
  position:absolute;

  left:50%;
  bottom:18px;

  transform:translateX(-50%);

  z-index:10;

  white-space:nowrap;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width:760px) {
  .coming_soon {
    min-height:100dvh;
    padding:28px 7px 24px;
  }

  .coming_soon .coming-intro { margin-bottom:0; }
  .coming_soon .coming-lede { font-size:11px; }
  .coming_soon .coming-carousel-layer { min-height:335px;grid-template-rows:minmax(225px,1fr) auto; }
  .coming_soon .coming-carousel-shell { min-height:225px; }
  .coming_soon .coming-carousel-stage { height:225px; }

  .coming_soon .coming-card {
    width:188px;
    height:188px;
    margin:-94px 0 0 -94px;
    border-radius:31px;
  }

  .coming_soon .coming-card.prev { transform:translate3d(-154px,9px,-120px) rotateY(59deg) rotateX(2deg) scale(.62); }
  .coming_soon .coming-card.next { transform:translate3d(154px,-7px,-120px) rotateY(-59deg) rotateX(-2deg) scale(.62); }
  .coming_soon .coming-nebula { width:214px;height:214px; }
  .coming_soon .coming-orbit { inset:3px; }
  .coming_soon .coming-orbit.mid { inset:20px; }
  .coming_soon .coming-orbit.slow { inset:34px; }
  .coming_soon .coming-logo-wrap { width:150px;height:150px; }
  .coming_soon .coming-spark,
  .coming_soon .coming-golf-orb,
  .coming_soon .coming-cinema-chip { transform:scale(.78); }
  .coming_soon .a { left:90px; }
  .coming_soon .b { top:120px; }
  .coming_soon .f { right:62px; }
  .coming_soon .coming-active-title { min-height:72px;padding-bottom:4px; }
  .coming_soon .coming-active-heading { font-size:clamp(23px,6.8vw,33px); }
  .coming_soon .coming-detail-glass { padding:23px 21px 20px; }
}

@media (max-width:430px) {
  .coming_soon .coming-intro h1 { font-size:34px; }
  .coming_soon .coming-carousel-layer { min-height:305px;grid-template-rows:minmax(205px,1fr) auto; }
  .coming_soon .coming-carousel-shell { min-height:205px; }
  .coming_soon .coming-carousel-stage { height:205px; }

  .coming_soon .coming-card {
    width:164px;
    height:164px;
    margin:-82px 0 0 -82px;
  }

  .coming_soon .coming-card.prev { transform:translate3d(-132px,8px,-112px) rotateY(58deg) scale(.60); }
  .coming_soon .coming-card.next { transform:translate3d(132px,-6px,-112px) rotateY(-58deg) scale(.60); }
  .coming_soon .coming-nebula { width:188px;height:188px; }
  .coming_soon .coming-logo-wrap { width:132px;height:132px; }
  .coming_soon .coming-active-heading { font-size:clamp(21px,7.2vw,29px); }
  .coming_soon .coming-active-more { margin-top:5px;font-size:6.3px; }
}

@media (max-height:650px) {
  .coming_soon { padding-top:18px;padding-bottom:18px; }
  .coming_soon .coming-intro h1 { font-size:33px; }
  .coming_soon .coming-lede { display:none; }
  .coming_soon .coming-carousel-layer { min-height:285px;grid-template-rows:minmax(190px,1fr) auto; }
  .coming_soon .coming-carousel-stage { height:190px; }
  .coming_soon .coming-active-title { min-height:62px; }
  .coming_soon .coming-active-heading { font-size:24px; }
}

@media (prefers-reduced-motion:reduce) {
  .coming_soon .coming-carousel-layer,
  .coming_soon .coming-card,
  .coming_soon .coming-nebula,
  .coming_soon .coming-orbit,
  .coming_soon .coming-spark,
  .coming_soon .coming-golf-orb,
  .coming_soon .coming-cinema-chip,
  .coming_soon .coming-logo-wrap,
  .coming_soon .coming-active-title,
  .coming_soon .coming-detail-glass {
    animation:none!important;
    transition-duration:.01ms!important;
  }
}