/* Jupiter Planet — homepage */

/* HERO */
.hero{ padding-block:clamp(2.5rem,1.5rem+5vw,5rem) clamp(1rem,0.5rem+2vw,2rem); position:relative; }
.hero__in{ display:grid; gap:var(--gap); align-items:center; grid-template-columns:1fr; }
@media (min-width:900px){ .hero__in{ grid-template-columns:1.15fr .85fr; } }
.hero h1{ margin-bottom:.3em; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem; }
.hero__pills{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:1.8rem 0 0; }
.hero__pills li{ font-size:var(--step--1); font-weight:600; color:var(--muted); padding:.4rem .8rem; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.02); }
.hero__pills li::before{ content:"✦ "; color:var(--gold); }

.hero__visual{ position:relative; min-height:280px; display:grid; place-items:center; }
.hero__planet{
  width:min(78%,360px); aspect-ratio:1; border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%, #f4cd6a, #c9952a 38%, #8a6418 70%, #5c4310 100%);
  box-shadow:0 0 90px var(--gold-glow), inset -30px -24px 60px rgba(0,0,0,.5);
  position:relative;
}
.hero__planet::before{
  content:""; position:absolute; inset:-22% -8%; border-radius:50%;
  border:14px solid rgba(232,178,58,.35); transform:rotate(-20deg) scaleY(.32);
  box-shadow:0 0 30px var(--gold-glow);
}
.hero__planet::after{
  content:""; position:absolute; inset:0; border-radius:50%; overflow:hidden;
  background:
    repeating-linear-gradient(0deg, transparent 0 18px, rgba(0,0,0,.10) 18px 24px, transparent 24px 40px);
  mask:radial-gradient(circle at 35% 30%, #000 70%, transparent 100%);
}
@media (prefers-reduced-motion:no-preference){
  .hero__planet{ animation:floaty 8s ease-in-out infinite; }
}
@keyframes floaty{ 50%{ transform:translateY(-14px); } }

/* CFG section bg */
.cfg-section{ background:linear-gradient(180deg, transparent, rgba(232,178,58,.03), transparent); }

/* SERVICES */
.svc{ position:relative; transition:transform .25s var(--ease), border-color .25s; }
.svc:hover{ transform:translateY(-4px); border-color:rgba(232,178,58,.4); }
.svc__ico{ font-size:1.8rem; display:block; margin-bottom:.6rem; }
.svc h3{ font-size:1.12rem; }
.svc p{ margin:0; font-size:.95rem; }

/* WHY */
.why__list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:.85rem; }
.why__list li{ padding-left:2rem; position:relative; color:var(--muted); }
.why__list li::before{ content:"✦"; position:absolute; left:0; top:.05em; color:var(--gold); }

/* GALLERY */
.gallery{ display:grid; gap:.8rem; grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
@media (min-width:760px){ .gallery{ grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; } }
.gallery__item{ margin:0; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); }
.gallery__ph{ width:100%; height:100%; background:
  linear-gradient(135deg, var(--surface-2), var(--bg-1));
  position:relative; }
.gallery__ph::after{ content:"JUPITER PLANET"; position:absolute; inset:0; display:grid; place-items:center; font-family:var(--font-display); font-weight:700; letter-spacing:.12em; font-size:.62rem; color:rgba(232,178,58,.35); }
@media (min-width:760px){
  .gallery__item.g-1{ grid-column:span 2; grid-row:span 2; }
  .gallery__item.g-4{ grid-row:span 2; }
}

/* PROCES */
.steps{ list-style:none; padding:0; margin:0; display:grid; gap:1rem; grid-template-columns:1fr; counter-reset:s; }
@media (min-width:760px){ .steps{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1040px){ .steps{ grid-template-columns:repeat(4,1fr); } }
.steps__item{ display:flex; gap:1rem; align-items:flex-start; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:1.4rem; }
.steps__n{ flex:0 0 auto; width:44px; height:44px; border-radius:12px; display:grid; place-items:center; font-family:var(--font-display); font-weight:700; font-size:1.2rem; color:#1a1405; background:linear-gradient(135deg,var(--gold-soft),var(--gold)); }
.steps__item h3{ font-size:1.05rem; margin-bottom:.25rem; }
.steps__item p{ margin:0; font-size:.9rem; }

/* CTA */
.cta{ text-align:center; background:
  radial-gradient(120% 120% at 50% 0%, rgba(232,178,58,.12), transparent 60%),
  linear-gradient(180deg, var(--surface), var(--bg-1));
  border:1px solid var(--line); border-radius:var(--radius-l); padding:clamp(2rem,1rem+5vw,4rem); }

/* FAQ */
.faq__item{ border-bottom:1px solid var(--line); }
.faq__q{ width:100%; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.2rem 0; background:none; border:0; text-align:left; font-family:var(--font-display); font-weight:600; font-size:1.05rem; color:var(--text); }
.faq__q i{ font-style:normal; font-size:1.5rem; color:var(--gold); transition:transform .25s var(--ease); flex:0 0 auto; }
.faq__item.open .faq__q i{ transform:rotate(45deg); }
.faq__a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s var(--ease); }
.faq__item.open .faq__a{ grid-template-rows:1fr; }
.faq__a > p{ overflow:hidden; margin:0; padding:0 0 1.2rem; color:var(--muted); }
