.nextcloud-page{
  width:min(1180px,100%);
  margin:0 auto;
  padding:24px 16px 52px;
}

.nextcloud-page .card{
  grid-column:auto;
}

.nextcloud-hero{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:18px;
  align-items:stretch;
  margin-bottom:18px;
}

.nextcloud-hero__intro,
.nextcloud-panel,
.nextcloud-step,
.nextcloud-tip{
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(10,28,56,.72);
  box-shadow:0 16px 38px rgba(0,0,0,.24);
}

.nextcloud-hero__intro{
  padding:24px;
}

.nextcloud-eyebrow{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin-bottom:10px;
  padding:5px 11px;
  border-radius:999px;
  color:#ffd896;
  font-size:12px;
  font-weight:800;
  background:rgba(230,195,127,.12);
  border:1px solid rgba(230,195,127,.24);
}

.nextcloud-hero h1{
  margin:0 0 12px;
  font-size:clamp(28px,4vw,46px);
  line-height:1.08;
  letter-spacing:0;
}

.nextcloud-hero p,
.nextcloud-panel p,
.nextcloud-step p,
.nextcloud-tip p{
  color:rgba(226,238,255,.82);
  line-height:1.65;
}

.nextcloud-hero p{
  max-width:760px;
  margin:0 0 18px;
}

.nextcloud-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.nextcloud-panel{
  padding:18px;
}

.nextcloud-panel h2,
.nextcloud-step h2,
.nextcloud-tip h2{
  margin:0 0 10px;
  letter-spacing:0;
}

.nextcloud-status-chip{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:14px;
  padding:12px;
  border-radius:12px;
  background:rgba(8,18,36,.36);
  border:1px solid rgba(255,255,255,.12);
}

.nextcloud-status-chip__dot{
  width:12px;
  height:12px;
  flex:0 0 12px;
  border-radius:999px;
  background:#f59e0b;
  box-shadow:0 0 0 5px rgba(245,158,11,.16),0 0 16px rgba(245,158,11,.42);
}

.nextcloud-status-chip[data-state="ok"] .nextcloud-status-chip__dot{
  background:#22c55e;
  box-shadow:0 0 0 5px rgba(34,197,94,.18),0 0 18px rgba(34,197,94,.48);
}

.nextcloud-status-chip[data-state="error"] .nextcloud-status-chip__dot{
  background:#ef4444;
  box-shadow:0 0 0 5px rgba(239,68,68,.18),0 0 18px rgba(239,68,68,.46);
}

.nextcloud-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.nextcloud-step,
.nextcloud-tip{
  padding:18px;
}

.nextcloud-step__num{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:14px;
  border-radius:12px;
  color:#06111f;
  font-weight:900;
  background:linear-gradient(135deg,#ffe08a,#ffae1a);
  box-shadow:0 0 22px rgba(255,176,32,.30);
}

.nextcloud-list{
  margin:0;
  padding-left:18px;
  color:rgba(226,238,255,.84);
  line-height:1.7;
}

.nextcloud-list li+li{
  margin-top:6px;
}

.nextcloud-wide{
  grid-column:span 2;
}

.nextcloud-support{
  margin-top:16px;
}

@media(max-width:900px){
  .nextcloud-hero,
  .nextcloud-grid{
    grid-template-columns:1fr;
  }

  .nextcloud-wide{
    grid-column:auto;
  }
}

@media(max-width:560px){
  .nextcloud-page{
    padding:16px 14px 42px;
  }

  .nextcloud-hero__intro,
  .nextcloud-panel,
  .nextcloud-step,
  .nextcloud-tip{
    padding:16px;
  }

  .nextcloud-actions .btn{
    width:100%;
  }
}