/* ============================================================
   SYNCORA V6 — clean cinematic homepage polish
   Goals: zero hero overlap, two-line headline, richer cosmic
   atmosphere, logo clearly separated into its own visual stage,
   and reliable portfolio hydration on the homepage.
   ============================================================ */
:root{
  --v6-gold:#e7c979;
  --v6-gold-hi:#fff4c8;
  --v6-silver:#dbe2ed;
  --v6-ink:#03050a;
  --v6-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- HERO COMPOSITION ---------- */
.hero--v5{
  min-height:clamp(700px,calc(100svh - 56px),860px);
  background:#02040a;
}
.hero--v5::before{
  background:
    radial-gradient(58% 76% at 78% 41%,rgba(82,105,176,.19),transparent 64%),
    radial-gradient(43% 56% at 63% 59%,rgba(231,201,121,.11),transparent 66%),
    radial-gradient(55% 65% at 4% 24%,rgba(30,55,122,.20),transparent 72%),
    linear-gradient(130deg,#010207 0%,#050914 45%,#02030a 100%);
}
.hero--v5::after{
  background:
    radial-gradient(55% 65% at 71% 45%,transparent 28%,rgba(0,0,0,.40) 88%),
    linear-gradient(90deg,rgba(0,0,0,.18),transparent 23%,transparent 77%,rgba(0,0,0,.30));
}
.hero-v5__space::after{
  background:
    radial-gradient(ellipse at 78% 26%,rgba(123,151,224,.20) 0 6%,transparent 30%),
    radial-gradient(ellipse at 67% 52%,rgba(231,201,121,.17) 0 9%,transparent 32%),
    radial-gradient(ellipse at 33% 72%,rgba(74,105,181,.17) 0 4%,transparent 28%),
    radial-gradient(ellipse at 52% 16%,rgba(189,204,239,.08) 0 3%,transparent 24%);
  filter:blur(32px);
  transform:rotate(-8deg) scale(1.18);
  animation:v6Nebula 24s ease-in-out infinite alternate;
}
@keyframes v6Nebula{
  0%{transform:rotate(-8deg) scale(1.18) translate3d(-1%,1%,0);opacity:.78}
  100%{transform:rotate(-3deg) scale(1.24) translate3d(2%,-2%,0);opacity:1}
}
.hero-v5__planet{
  right:-12%;bottom:-38%;width:min(60vw,920px);opacity:.9;
  background:
    radial-gradient(circle at 29% 22%,rgba(105,134,205,.28),transparent 18%),
    radial-gradient(circle at 63% 37%,rgba(231,201,121,.13),transparent 36%),
    radial-gradient(circle at 52% 56%,#0a1020 0%,#040914 46%,#010207 72%);
  box-shadow:inset 0 0 150px 58px rgba(0,0,0,.88),0 0 130px rgba(84,110,187,.16);
  animation:v6Planet 18s ease-in-out infinite alternate;
}
@keyframes v6Planet{to{transform:rotate(7deg) scale(1.04) translate3d(-1%,-1%,0)}}
.hero-v5__planet::before{
  inset:9%;
  border-color:rgba(214,221,236,.09);
  box-shadow:0 0 120px rgba(101,124,181,.08) inset;
}
.hero-v5__planet::after{
  left:2%;right:-8%;top:39%;height:3px;
  background:linear-gradient(90deg,transparent,rgba(231,201,121,.38),rgba(219,226,237,.12),transparent);
  box-shadow:0 0 28px rgba(231,201,121,.16);
}
.hero-v5__grid{opacity:.52;bottom:0;height:29%;filter:blur(.05px)}

.hero-v5__inner{
  width:min(1360px,calc(100% - 72px));
  grid-template-columns:minmax(0,1fr) minmax(480px,.86fr);
  gap:clamp(48px,5vw,92px);
  padding:66px 0 86px;
}
.hero-v5__copy{
  max-width:690px;
  padding-left:0;
  position:relative;
  z-index:7;
}
.hero-v5__eyebrow{margin-bottom:17px;color:#b8c1ce}
.hero--v5 h1{
  max-width:690px;
  font-size:clamp(3.05rem,3.55vw,4rem);
  line-height:1.01;
  letter-spacing:-.055em;
  text-wrap:normal;
}
.hero-v5__line{white-space:nowrap}
.hero-v5__line--mixed{
  margin-top:.09em;
  white-space:nowrap;
}
.hero-v5__business{
  color:#fbfbf8;
  font-family:var(--font-d);
  font-style:normal;
  font-weight:700;
  letter-spacing:-.055em;
}
.hero-v5__line--mixed .v5-word{
  display:inline-block;
  margin-left:.06em;
  font-family:var(--font-a);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.024em;
  background:linear-gradient(105deg,#fff3ca 8%,#e7c979 46%,#f4e2ac 76%,#cfd6e2 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  animation:v6Sheen 9s ease-in-out infinite;
  filter:drop-shadow(0 0 18px rgba(231,201,121,.06));
  position:relative;
}
@keyframes v6Sheen{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
.hero-v5__line--mixed .v5-word::after{
  content:"";
  position:absolute;
  left:-8%;right:-8%;bottom:2%;height:34%;
  background:radial-gradient(ellipse,rgba(231,201,121,.22),transparent 66%);
  filter:blur(13px);
  opacity:.34;
  z-index:-1;
  transform:scaleX(.78);
  animation:v6WordGlow 5.2s ease-in-out infinite;
}
@keyframes v6WordGlow{50%{opacity:.88;transform:scaleX(1)}}
.hero-v5__copy:hover .hero-v5__line--mixed .v5-word{filter:drop-shadow(0 0 26px rgba(231,201,121,.2))}
.hero-v5__lead{
  max-width:620px;
  margin-top:25px;
  color:#bac4d0;
  font-size:.98rem;
  line-height:1.75;
}
.hero-v5__ctas{margin-top:27px;gap:11px}
.hero-v5__ctas .btn{min-height:50px}
.hero-v5__primary{padding-inline:20px}
.hero-v5__secondary{padding-inline:20px}
.hero-v5__microproof{margin-top:16px;gap:9px 18px;font-size:.60rem}

/* ---------- LOGO STAGE: clearly separated from the copy ---------- */
.hero-v5__visual{
  min-height:535px;
  align-self:center;
  margin-right:-12px;
  isolation:isolate;
}
.hero-v5__visual::before{
  content:"";
  position:absolute;
  width:72%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(231,201,121,.14) 0,rgba(91,116,182,.10) 27%,transparent 68%);
  filter:blur(26px);
  opacity:.95;
  animation:v6VisualBreath 7s ease-in-out infinite;
}
@keyframes v6VisualBreath{50%{transform:scale(1.08);opacity:1}}
.hero-v5__aura{width:500px;height:500px;background:radial-gradient(circle,rgba(231,201,121,.18),rgba(86,113,184,.065) 38%,transparent 71%);filter:blur(22px)}
.hero-v5__orbit--1{width:525px;height:525px;border-color:rgba(231,201,121,.22)}
.hero-v5__orbit--2{width:450px;height:450px;border-color:rgba(213,222,239,.13)}
.hero-v5__orbit--3{width:365px;height:365px;border-color:rgba(231,201,121,.13)}
.hero-v5__ring-arc{width:455px;height:165px;opacity:.85}
.hero-v5__logo-shell{
  width:min(420px,78%);
  z-index:4;
}
.hero-v5__logo-backplate{
  inset:14%;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 44%,rgba(255,255,255,.065),rgba(255,255,255,.02) 42%,rgba(0,0,0,.2) 70%),
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.008));
  border-color:rgba(255,255,255,.10);
  box-shadow:0 32px 100px rgba(0,0,0,.50),inset 0 0 65px rgba(231,201,121,.045),0 0 80px rgba(231,201,121,.055);
  transform:none;
}
.hero-v5__logo-backplate::before{
  inset:8%;border-radius:50%;border:1px solid rgba(231,201,121,.11);box-shadow:0 0 70px rgba(231,201,121,.06) inset;
}
.hero-v5__logo-ring{inset:18%;box-shadow:0 0 70px rgba(231,237,247,.065) inset}
.hero-v5__logo-ring::before{inset:-12%;border-color:rgba(231,201,121,.14)}
.hero-v5__logo-ring::after{inset:10%;border-color:rgba(214,221,236,.11)}
.hero-v5__logo-halo{inset:5%;background:radial-gradient(circle,rgba(231,201,121,.14),transparent 62%);filter:blur(31px)}
.hero-v5__logo{
  width:82%;
  filter:drop-shadow(0 38px 66px rgba(0,0,0,.80)) drop-shadow(0 0 30px rgba(231,201,121,.35)) drop-shadow(0 0 80px rgba(205,215,232,.14));
}
.hero-v5__card{min-width:148px;padding:11px 13px;border-radius:13px;background:rgba(4,7,13,.70);box-shadow:0 22px 52px rgba(0,0,0,.40),0 0 0 1px rgba(255,255,255,.018) inset}
.hero-v5__card--one{left:2%;top:17%}
.hero-v5__card--two{right:-2%;top:9%}
.hero-v5__card--three{right:1%;bottom:15%}
.hero-v5__visual-note{bottom:3.5%}
.hero-v5__visual-note{font-size:.52rem;letter-spacing:.15em}
.hero-v5__bottom{bottom:18px;width:min(1360px,calc(100% - 72px))}

/* ---------- HOMEPAGE WORK: restore default projects and keep a clean stacked presentation ---------- */
#work .rp__grid{
  grid-template-columns:1fr !important;
  gap:30px;
  margin-top:42px;
}
#work .rp{
  grid-template-columns:minmax(0,1.72fr) minmax(300px,.78fr);
  align-items:center;
  gap:34px;
}
#work .rp__info h3{font-size:clamp(1.35rem,2vw,1.85rem)}
#work .rp__desk img{aspect-ratio:16/9.2;object-fit:cover}

/* ---------- COOKIE: stay out of the main visual ---------- */
.cookie-bar{
  width:min(700px,calc(100% - 24px));
  bottom:13px;
  padding:10px 12px;
  border-radius:14px;
  gap:12px;
  background:rgba(4,7,11,.72);
}
.cookie-bar__copy{max-width:490px}
.cookie-bar p{font-size:.64rem;line-height:1.38}
.cookie-bar__actions .btn{min-height:36px;font-size:.56rem;padding-inline:11px}

/* ---------- RESPONSIVE ---------- */
@media(max-width:1180px){
  .hero-v5__inner{grid-template-columns:minmax(0,1fr) minmax(410px,.85fr);gap:44px;width:min(1250px,calc(100% - 56px))}
  .hero--v5 h1{font-size:clamp(2.8rem,3.75vw,3.6rem)}
  .hero-v5__visual{min-height:500px}
  .hero-v5__logo-shell{width:min(390px,78%)}
  .hero-v5__orbit--1{width:490px;height:490px}.hero-v5__orbit--2{width:420px;height:420px}.hero-v5__orbit--3{width:340px;height:340px}
}
@media(max-width:980px){
  .hero-v5__inner{grid-template-columns:1fr;gap:10px;width:min(900px,calc(100% - 40px));padding:64px 0 92px}
  .hero-v5__copy{text-align:center;max-width:760px;margin-inline:auto}
  .hero-v5__eyebrow{justify-content:center}
  .hero--v5 h1{max-width:760px;margin-inline:auto;font-size:clamp(3rem,7vw,4.4rem)}
  .hero-v5__lead{margin-inline:auto}
  .hero-v5__ctas,.hero-v5__microproof{justify-content:center}
  .hero-v5__visual{min-height:500px;margin:4px auto 0;width:min(680px,100%)}
  #work .rp{grid-template-columns:1fr;gap:18px}
}
@media(max-width:700px){
  .hero-v5__inner{width:min(100% - 28px,640px);padding:43px 0 86px;gap:12px}
  .hero-v5__eyebrow{font-size:.53rem;letter-spacing:.15em;margin-bottom:15px}
  .hero--v5 h1{font-size:clamp(2.15rem,9.4vw,3.05rem);line-height:1.02;letter-spacing:-.048em}
  .hero-v5__line,.hero-v5__line--mixed{white-space:normal}
  .hero-v5__line--mixed{margin-top:.08em}
  .hero-v5__line--mixed .v5-word{margin-left:.035em}
  .hero-v5__lead{max-width:540px;font-size:.87rem;line-height:1.70;margin-top:18px}
  .hero-v5__ctas{display:grid;grid-template-columns:1fr;gap:9px;margin-top:22px}
  .hero-v5__ctas .btn{width:100%;justify-content:center}
  .hero-v5__microproof{gap:8px 12px;margin-top:14px;font-size:.50rem}
  .hero-v5__visual{min-height:385px;width:100%;margin-top:6px}
  .hero-v5__aura{width:340px;height:340px}.hero-v5__orbit--1{width:340px;height:340px}.hero-v5__orbit--2{width:285px;height:285px}.hero-v5__orbit--3{width:232px;height:232px}
  .hero-v5__ring-arc{width:295px;height:118px}
  .hero-v5__logo-shell{width:min(300px,84vw)}
  .hero-v5__logo{width:84%}
  .hero-v5__card{min-width:auto;padding:8px 10px;border-radius:11px}.hero-v5__card small{font-size:.41rem}.hero-v5__card strong{font-size:.59rem}
  .hero-v5__card--one{left:0;top:10%}.hero-v5__card--two{right:0;top:3%}.hero-v5__card--three{right:1%;bottom:8%}
  .hero-v5__visual-note{font-size:.45rem;bottom:1%}
  .hero-v5__bottom{position:relative;left:auto;bottom:auto;transform:none;width:min(100% - 28px,640px);margin:-49px auto 12px;font-size:.45rem;letter-spacing:.11em}
  .hero-v5__bottom .line{max-width:64px}
  .hero-v5__planet{width:118vw;right:-46%;bottom:-47%}
  .hero-v5__grid{height:26%;background-size:58px 58px}
  .cookie-bar{bottom:7px;padding:9px;border-radius:12px}
  .cookie-bar__copy{max-width:none}.cookie-bar p{font-size:.61rem}
  .cookie-bar__actions{width:100%}.cookie-bar__actions .btn{flex:1}
}
@media(max-width:430px){
  .hero-v5__inner{padding-top:36px;padding-bottom:78px}
  .hero--v5 h1{font-size:clamp(2rem,10vw,2.55rem)}
  .hero-v5__visual{min-height:330px}
  .hero-v5__logo-shell{width:min(280px,86vw)}
  .hero-v5__orbit--1{width:300px;height:300px}.hero-v5__orbit--2{width:250px;height:250px}.hero-v5__orbit--3{width:205px;height:205px}
  .hero-v5__card--one{left:-2%}.hero-v5__card--two{right:-2%}.hero-v5__card--three{right:-1%}
  .hero-v5__visual-note{display:none}
}
@media(prefers-reduced-motion:reduce){
  .hero-v5__space::after,.hero-v5__planet,.hero-v5__visual::before,.hero-v5__line--mixed .v5-word,.hero-v5__line--mixed .v5-word::after{animation:none!important}
}
