/* Swing Signal — review concept
   Dark spatial motion inspired by distributed intelligence, expressed through
   Swing's own orange, warm neutrals, product screens and direct copy. */
:root{
  --signal-void:#050504;
  --signal-bone:#f4f1eb;
  --signal-ash:#9a9790;
  --signal-silver:#c7c3bb;
  --signal-orange:#db4a2b;
  --signal-spark:#f3a641;
  --signal-verdant:#4f8b70;
}
html{background:var(--signal-void)}
body{
  background:var(--signal-void);
  color:var(--signal-bone);
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-3;
  background:
    radial-gradient(60rem 45rem at 80% 8%,rgba(219,74,43,.075),transparent 67%),
    radial-gradient(40rem 40rem at 15% 72%,rgba(79,139,112,.045),transparent 70%),
    #050504;
}
.ambient{
  z-index:-2;opacity:.75;
  background:
    radial-gradient(ellipse at 76% 26%,rgba(219,74,43,.05),transparent 46%),
    radial-gradient(ellipse at 12% 78%,rgba(243,166,65,.025),transparent 42%);
  animation:signal-drift 18s ease-in-out infinite alternate;
}
.signal-field{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:.92}
.cursor-glow{
  --x:50vw;--y:30vh;position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(420px circle at var(--x) var(--y),rgba(219,74,43,.055),transparent 70%);
  opacity:0;transition:opacity .45s ease;
}
@media (hover:hover){body:hover .cursor-glow{opacity:1}}
.scroll-signal{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:30;width:1px;height:22vh;background:rgba(244,241,235,.12)}
.scroll-signal span{display:block;width:1px;height:0;background:var(--signal-orange);box-shadow:0 0 15px rgba(219,74,43,.7);transition:height .12s linear}

.wrap{width:min(1280px,calc(100% - 112px))}
.site-header{height:120px;position:relative;z-index:40}
.site-header::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(244,241,235,.12),transparent);transform:scaleX(.72)}
.brand img{width:170px}
.desktop-nav{margin-left:auto;gap:34px}
.desktop-nav a{font-size:.75rem;text-transform:uppercase;letter-spacing:.09em;color:var(--signal-ash)}
.desktop-nav a:hover{color:var(--signal-bone)}
.header-cta{min-height:45px;padding:10px 18px;margin-left:4px;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;gap:16px}
.button{background:var(--signal-orange);border-color:var(--signal-orange);box-shadow:0 0 0 0 rgba(219,74,43,0);transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
.button:hover{background:#e45a3c;box-shadow:0 0 0 7px rgba(219,74,43,.09),0 16px 48px rgba(219,74,43,.16)}

.hero{
  min-height:calc(100svh - 120px);padding-block:70px 110px;gap:74px;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  position:relative;
}
.hero::before{
  content:"SWING / 01";position:absolute;left:-46px;top:48%;transform:rotate(-90deg);
  color:rgba(244,241,235,.22);font-size:.62rem;letter-spacing:.18em;
}
.hero-kicker,.eyebrow{
  display:flex;align-items:center;gap:10px;color:var(--signal-spark)!important;
  font-size:.72rem!important;font-weight:700!important;letter-spacing:.13em!important;text-transform:uppercase;
}
.hero-kicker{margin-bottom:26px}
.hero-kicker span{width:24px;height:1px;background:var(--signal-spark);box-shadow:0 0 10px rgba(243,166,65,.7)}
h1,h2{font-family:var(--sans);font-weight:400;letter-spacing:-.047em;color:var(--signal-bone)}
h1{font-size:clamp(4rem,6.5vw,6.6rem);line-height:.94}
h2{font-size:clamp(3.3rem,5.5vw,5.4rem);line-height:.98}
.intro,.feature-copy>p:not(.eyebrow),details p{font-weight:400;color:var(--signal-silver)}
.intro{max-width:540px;font-size:1.18rem;line-height:1.62;margin-top:32px}
.hero-actions{margin-top:38px}.hero-actions .button{padding-inline:24px}
.text-link{color:var(--signal-ash);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;text-decoration:none}
.text-link::after{content:"";height:1px;width:24px;background:currentColor;transition:width .25s ease}
.text-link:hover::after{width:42px}
.platforms{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:#77746e}

.hero-product{position:relative;perspective:1200px}
.hero-product .screen{
  transform:rotateY(-5deg) rotateX(1.5deg);transform-origin:50% 50%;
  border:1px solid rgba(244,241,235,.14);border-radius:22px;
  box-shadow:0 45px 120px rgba(0,0,0,.62),0 0 70px rgba(219,74,43,.07);
  animation:product-float 7s ease-in-out infinite;
}
.orbit{position:absolute;pointer-events:none;border:1px solid rgba(219,74,43,.15);border-radius:50%;z-index:-1}
.orbit::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--signal-orange);box-shadow:0 0 18px var(--signal-orange)}
.orbit-one{inset:-15% -10%;animation:orbit-spin 22s linear infinite}.orbit-one::after{left:17%;top:4%}
.orbit-two{inset:-7% -18%;transform:rotate(57deg);border-color:rgba(243,166,65,.1);animation:orbit-spin-reverse 30s linear infinite}.orbit-two::after{right:9%;bottom:22%;background:var(--signal-spark)}

.feature-nav{background:rgba(5,5,4,.86);border-color:rgba(244,241,235,.08);backdrop-filter:blur(18px)}
.feature-links a{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#77746e;padding-block:18px}
.feature-links a[aria-current="location"]{color:var(--signal-bone);border-color:var(--signal-orange)}

.feature{
  min-height:90svh;padding-block:120px;position:relative;border:0;
  align-items:center;
}
.feature::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(244,241,235,.1),transparent)}
.feature::before{position:absolute;top:104px;right:0;color:rgba(244,241,235,.05);font:400 clamp(5rem,12vw,10rem)/1 var(--sans);letter-spacing:-.06em}
#today::before{content:"01"}#tasks::before{content:"02"}#notes::before{content:"03"}#journal::before{content:"04"}#habits::before{content:"05"}#week::before{content:"06"}#zeus::before{content:"07"}
.split{gap:110px}
.feature-copy{position:relative;z-index:2}
.eyebrow{margin-bottom:24px}
.feature-copy>p:not(.eyebrow){font-size:1.12rem;line-height:1.65;max-width:500px;margin-top:28px}
.screen{border-color:rgba(244,241,235,.12);border-radius:22px;background:#11110f;box-shadow:0 35px 100px rgba(0,0,0,.5)}
.portrait-visual,.wide-visual,.chat-figure{position:relative}
.portrait-visual::before,.wide-visual::before,.chat-figure::before{
  content:"";position:absolute;inset:-12%;z-index:-1;
  background:radial-gradient(circle,rgba(219,74,43,.075),transparent 68%);filter:blur(20px);
}
#tasks,#notes,#week{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:90px}
#tasks .wide-visual,#notes .wide-visual,#week .wide-visual{margin:0}
#notes .feature-copy{grid-column:2;grid-row:1}
#notes .wide-visual{grid-column:1;grid-row:1}
#journal .feature-copy,#zeus .feature-copy{order:2}
#journal .portrait-visual,#zeus .chat-figure{justify-self:start}
.chat-shell{border-color:rgba(244,241,235,.13);background:#11110f;box-shadow:0 35px 100px rgba(0,0,0,.55)}
.chat-header{background:#181816}.incoming{background:#050504}.outgoing{background:var(--signal-orange)}
.z-icon{background:var(--signal-orange)}
.replay{color:var(--signal-spark);padding-inline:0}

.faq-close{padding-block:140px;gap:110px}
.faq-column h2{font-size:clamp(3.5rem,6vw,6rem)}
details{border-color:rgba(244,241,235,.12)}
summary{font-family:var(--sans);font-weight:400;letter-spacing:-.02em}
.signup-column{border-color:rgba(244,241,235,.12)}
.signup-column h2{font-family:var(--sans);font-weight:400;letter-spacing:-.04em;font-size:clamp(3rem,4vw,4.8rem)}
.waitlist-form input,.waitlist-form select{background:transparent;border:0;border-bottom:1px solid rgba(244,241,235,.22);border-radius:0;padding-inline:0}
.waitlist-form .button{border-radius:24px}
.site-footer{border-color:rgba(244,241,235,.1)}
.motion-button{border-color:rgba(244,241,235,.15);color:var(--signal-ash)}

.reveal{transition:opacity .8s ease,transform .9s cubic-bezier(.16,1,.3,1)}
.reveal:not(.animate-in){opacity:.2;transform:translateY(28px)}
.reveal.animate-in{animation:none;opacity:1;transform:none}

@keyframes product-float{0%,100%{transform:rotateY(-5deg) rotateX(1.5deg) translateY(0)}50%{transform:rotateY(-2deg) rotateX(0) translateY(-13px)}}
@keyframes orbit-spin{to{transform:rotate(360deg)}}@keyframes orbit-spin-reverse{to{transform:rotate(-303deg)}}
@keyframes signal-drift{to{transform:translate3d(-3%,4%,0) scale(1.04)}}

@media(max-width:1100px){
  .wrap{width:calc(100% - 72px)}h1{font-size:clamp(3.6rem,7vw,5.4rem)}
  #tasks,#notes,#week{gap:52px}.feature{min-height:auto}
}
@media(max-width:820px){
  .wrap{width:calc(100% - 48px)}.header-cta{display:none}.scroll-signal{display:none}
  .hero{min-height:auto;grid-template-columns:1fr;padding-block:60px 90px;gap:64px}
  .hero::before{display:none}.hero-kicker{margin-bottom:20px}
  h1{font-size:clamp(3.1rem,12.6vw,5rem);line-height:.96}
  h2{font-size:clamp(2.8rem,10vw,4rem)}
  .hero-product .screen{transform:none;animation:mobile-float 7s ease-in-out infinite}
  .orbit-one{inset:-10% -8%}.orbit-two{inset:-5% -12%}
  .feature{min-height:auto;padding-block:92px}
  #tasks,#notes,#week{display:grid;grid-template-columns:1fr;gap:44px}
  #notes .feature-copy,#notes .wide-visual{grid-column:1;grid-row:auto}
  #notes .feature-copy{grid-row:1}
  #journal .feature-copy,#zeus .feature-copy{order:0}
  #journal .portrait-visual,#zeus .chat-figure{justify-self:center}
  .feature::before{top:70px}
  .faq-close{padding-block:100px}
}
@media(max-width:480px){
  .site-header{height:96px}.brand img{width:154px}
  .hero{padding-block:45px 72px}.hero-kicker{font-size:.65rem!important}
  .intro{font-size:1.05rem;margin-top:26px}
  .hero-actions{margin-top:30px}.hero-actions .button{min-height:58px}
  .feature{padding-block:76px}.feature::before{top:52px}
  .screen,.hero-product .screen{border-radius:18px}
  .orbit{display:none}
  .faq-close{padding-block:78px}
}
@keyframes mobile-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(prefers-reduced-motion:reduce){
  .hero-product .screen,.orbit,.ambient{animation:none!important}.cursor-glow{display:none}.reveal{transition:none}
}
.paused .signal-field,.paused .cursor-glow{opacity:0}.paused .hero-product .screen,.paused .orbit,.paused .ambient{animation-play-state:paused}

/* Blend product previews into the black canvas without dimming their text. */
.screen img{filter:contrast(1.18) brightness(.94)}
.screen,.hero-product .screen{
  background:#080807;
  border-color:rgba(244,241,235,.055);
  box-shadow:0 28px 80px rgba(0,0,0,.48);
}
.task-preview{background:#080807}
.task-preview .tp-header,.task-preview .tp-list{background:#10100e;border-color:#20201d}
.task-preview .tp-filter{background:#10100e;border-color:#20201d}
.task-preview .tp-settings,.task-preview .tp-department span{background:#080807}
.task-preview .tp-task{border-color:#20201d}
.chat-shell{background:#0a0a09;border-color:rgba(244,241,235,.07)}
.chat-header{background:#10100e}