/* ============ HERO ORBIT ============ */
.hero-orbit{ padding:64px 0 20px; }
.hero-orbit-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:40px;
  align-items:center;
  min-height:520px;
}
.hero-copy h1{ font-size:clamp(2.1rem, 4vw, 3.4rem); margin:.4em 0 .45em; }
.text-warp{
  background:linear-gradient(100deg, var(--mass-violet), var(--event-cyan));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-lede{ font-size:1.05rem; max-width:520px; color:var(--star-500); }
.hero-actions{ display:flex; gap:14px; margin:26px 0 40px; flex-wrap:wrap; }
.hero-metrics{ display:flex; gap:34px; flex-wrap:wrap; }
.hero-metrics div{ display:flex; flex-direction:column; }
.hero-metrics strong{ font-family:var(--font-display); font-size:1.5rem; color:var(--star-100); }
.hero-metrics span{ font-size:.78rem; color:var(--star-700); text-transform:uppercase; letter-spacing:.06em; }

.hero-well{ position:relative; height:480px; }
.hero-well canvas{ position:absolute; inset:0; width:100%; height:100%; }
.well-core{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:150px; height:150px; border-radius:50%;
  background:radial-gradient(circle at 38% 32%, #fff, var(--mass-violet) 45%, var(--mass-violet-2) 80%);
  box-shadow:0 0 70px rgba(143,124,255,.55);
  display:flex; align-items:center; justify-content:center;
  z-index:2;
}
.well-core-label{ font-family:var(--font-display); font-weight:700; color:#fff; text-align:center; font-size:1rem; line-height:1.2; }
.well-core-ring{ position:absolute; border-radius:50%; border:1px solid rgba(143,124,255,.35); }
.r1{ inset:-26px; animation:spin 18s linear infinite; }
.r2{ inset:-52px; border-color:rgba(82,232,214,.25); animation:spin 26s linear infinite reverse; }

.pod{
  position:absolute; z-index:3;
  background:var(--void-3); border:1px solid var(--line); border-radius:999px;
  padding:.55em 1.1em; font-size:.78rem; font-family:var(--font-mono); color:var(--star-300);
  box-shadow:0 10px 30px -10px rgba(0,0,0,.6);
  animation:float 6s ease-in-out infinite;
}
.pod-1{ top:6%; left:2%; animation-delay:0s; }
.pod-2{ top:14%; right:0%; animation-delay:1.2s; }
.pod-3{ bottom:12%; left:0%; animation-delay:2.1s; }
.pod-4{ bottom:2%; right:8%; animation-delay:.6s; }
@keyframes float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-10px);} }

@media (max-width:900px){
  .hero-orbit-grid{ grid-template-columns:1fr; }
  .hero-well{ height:340px; }
  .pod{ font-size:.68rem; padding:.45em .8em; }
}

/* ============ BENTO GRID (uniform card sizes) ============ */
.bento-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:20px;
  align-items:stretch;
}

.bento-home-grid{
  grid-auto-rows:1fr;
}

.bento-home-grid > .bento-ad{
  display:flex;
  flex-direction:column;
  position:relative;
  width:100%;
  height:100%;
  margin:0;
  padding:20px;
  border-radius:var(--radius-well);
  border:1px solid var(--line);
  background:linear-gradient(135deg, rgba(143,124,255,.18), rgba(82,232,214,.08), rgba(9,11,24,.7));
  box-shadow:0 20px 50px -22px rgba(143,124,255,.45);
  overflow:hidden;
}

.bento-home-grid > .bento-ad::before{
  content:"";
  position:absolute; inset:-25% -10% auto auto;
  width:260px; height:260px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(82,232,214,.28), transparent 68%);
  pointer-events:none;
}

.bento-home-grid > .bento-ad-badge{
  position:relative; z-index:1;
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--event-cyan);
  margin-bottom:10px;
}

.bento-home-grid > .bento-ad-badge::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--event-cyan); box-shadow:0 0 10px rgba(82,232,214,.8);
}

.bento-home-grid > .bento-ad-image-link{
  display:block;
  margin:-20px -20px 0;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:var(--radius-well) var(--radius-well) 0 0;
}

.bento-home-grid > .bento-ad img{
  width:100%; height:100%; object-fit:cover;
  display:block;
}

.bento-home-grid > .bento-ad-body{
  position:relative; z-index:1;
  display:flex; flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  gap:10px;
  margin-top:14px;
  text-align:left;
  line-height:1.3;
}

.bento-home-grid > .bento-ad-copy{
  flex:1 1 auto;
  min-width:0;
  display:flex; flex-direction:column; justify-content:flex-start;
  gap:4px;
}

.bento-home-grid > .bento-ad-title{
  font-size:1.15rem;
  font-family:var(--font-display); font-weight:700; color:var(--star-100);
}

.bento-home-grid > .bento-ad-text{
  color:var(--star-300); font-size:.9rem;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

.bento-home-grid > .bento-ad-action{
  flex:0 0 auto;
  align-self:flex-start;
  margin-top:auto;
  min-width:148px;
  padding:.72em 1.1em;
  font-size:.76rem;
}

.bento-card{
  background:var(--grad-panel); border:1px solid var(--line); border-radius:var(--radius-well);
  padding:20px; display:flex; flex-direction:column; gap:10px; justify-content:flex-start;
  height:100%;
  transition:border-color .4s, box-shadow .4s;
  overflow:hidden;
}
.bento-card:hover{ border-color:rgba(143,124,255,.5); box-shadow:0 20px 50px -20px rgba(143,124,255,.4); }
.bento-card h3{
  font-size:1.1rem; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  min-height:2.6em;
}
.bento-card p{
  color:var(--star-500); font-size:.9rem; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.card-meta{ font-family:var(--font-mono); font-size:.72rem; color:var(--star-700); margin-top:auto; padding-top:4px; }
.bento-photo{ aspect-ratio:16/9; margin:-20px -20px 0; border-radius:var(--radius-well) var(--radius-well) 0 0; }

@media (max-width:980px){
  .bento-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:600px){
  .bento-grid{ grid-template-columns:1fr; }
}

/* ============ CATEGORY ORBIT RING ============ */
.orbit-ring{
  position:relative;
  width:100%; max-width:560px; aspect-ratio:1; margin:0 auto;
}
.orbit-ring::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:1px dashed var(--line);
}
.orbit-center{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:130px; height:130px; border-radius:50%;
  background:var(--grad-panel); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-family:var(--font-display); color:var(--star-100); font-size:.95rem;
  box-shadow:0 0 50px rgba(143,124,255,.25) inset;
  z-index:2;
}
.orbit-track{ position:absolute; inset:0; animation:spin 50s linear infinite; }
.orbit-track a{ position:absolute; animation:spin 50s linear infinite reverse; }
.t1{ animation-duration:50s; } .t1 a{ top:0; left:50%; transform:translate(-50%,-50%); }
.t2{ animation-duration:50s; transform:rotate(60deg); } .t2 a{ top:0; left:50%; transform:translate(-50%,-50%) rotate(-60deg); }
.t3{ animation-duration:50s; transform:rotate(120deg); } .t3 a{ top:0; left:50%; transform:translate(-50%,-50%) rotate(-120deg); }
.t4{ animation-duration:50s; transform:rotate(180deg); } .t4 a{ top:0; left:50%; transform:translate(-50%,-50%) rotate(-180deg); }
.t5{ animation-duration:50s; transform:rotate(240deg); } .t5 a{ top:0; left:50%; transform:translate(-50%,-50%) rotate(-240deg); }
.t6{ animation-duration:50s; transform:rotate(300deg); } .t6 a{ top:0; left:50%; transform:translate(-50%,-50%) rotate(-300deg); }
.orbit-chip{
  display:inline-block; white-space:nowrap;
  background:var(--void-3); border:1px solid var(--line); border-radius:999px;
  padding:.6em 1.1em; font-size:.82rem; color:var(--star-300);
}
.orbit-chip:hover{ color:var(--void-0); background:var(--event-cyan); border-color:var(--event-cyan); }
@media (max-width:640px){
  .orbit-ring{ display:none; }
  .orbit-ring-section .container::after{
    content:"✉️ Writing · 🗓 Productivity · 🏠 Home Life · 💸 Finance · 🧠 Learning · 💆 Wellness";
    display:block; text-align:center; color:var(--star-500); font-size:.85rem; margin-top:10px;
  }
}

/* ============ AD BINARY PAIR ============ */
.ad-binary{ display:flex; gap:24px; justify-content:center; flex-wrap:wrap; margin:56px 0; }

/* ============ NEWSLETTER WELL ============ */
.newsletter-well{
  position:relative; overflow:hidden;
  text-align:center; padding:70px 40px; border-radius:32px;
  border:1px solid var(--line);
}
.well-glow{ position:absolute; inset:-40%; background:var(--grad-well); z-index:0; animation:pulse 8s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ opacity:.7; transform:scale(1);} 50%{ opacity:1; transform:scale(1.08);} }
.newsletter-well > *{ position:relative; z-index:1; }
.newsletter-well h2{ font-size:clamp(1.6rem,3vw,2.3rem); max-width:600px; margin:.3em auto .3em; }
.newsletter-well p{ max-width:480px; margin:0 auto 28px; color:var(--star-500); }
.newsletter-form{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.newsletter-form input{
  background:var(--void-2); border:1px solid var(--line); border-radius:999px;
  padding:.9em 1.4em; color:var(--star-100); min-width:280px; font-size:.95rem;
}
.newsletter-form input:focus{ outline:none; border-color:var(--mass-violet); }

/* ============ FEED + RAIL ============ */
.feed-layout{ display:grid; grid-template-columns:1fr 300px; gap:50px; align-items:start; }
.feed-row{
  display:grid; grid-template-columns:64px 1fr; gap:20px; align-items:center;
  padding:18px 4px; border-bottom:1px solid var(--line-soft);
}
.feed-photo{ width:64px; height:64px; border-radius:14px; flex:none; }
.feed-row h3{ font-size:1.05rem; margin:.3em 0; }
.feed-more{ margin-top:24px; width:100%; text-align:center; }
.trending-panel{ padding:22px; }
.trending-panel ol{ counter-reset:trend; margin-top:14px; }
.trending-panel li{ counter-increment:trend; padding:8px 0; font-size:.85rem; color:var(--star-300); border-bottom:1px solid var(--line-soft); position:relative; padding-left:26px; }
.trending-panel li::before{ content:counter(trend); position:absolute; left:0; color:var(--event-cyan); font-family:var(--font-mono); }

@media (max-width:900px){
  .feed-layout{ grid-template-columns:1fr; }
  .feed-rail{ order:-1; }
  .ad-sticky{ position:static; }
}