/* =========================================================
   AcilYanDal Home Elite V4
   Scope: index.php only. Does not touch DB or app logic.
   ========================================================= */
:root{
  --elite-ink:#0b1020;
  --elite-ink-2:#111827;
  --elite-soft:#f6f8fc;
  --elite-card:#ffffff;
  --elite-line:rgba(15,23,42,.09);
  --elite-red:#ef3b2d;
  --elite-orange:#ff7a2f;
  --elite-cyan:#18d6cf;
  --elite-blue:#2563eb;
  --elite-violet:#6d5dfc;
  --elite-muted:#64748b;
  --elite-radius:28px;
  --elite-shadow:0 24px 70px rgba(15,23,42,.12);
  --elite-shadow-soft:0 16px 44px rgba(15,23,42,.08);
}
body{
  background:
    radial-gradient(circle at 18% 0%,rgba(239,59,45,.065),transparent 28rem),
    radial-gradient(circle at 86% 10%,rgba(37,99,235,.06),transparent 26rem),
    #f6f8fc;
}
/* Hero: darker, cleaner, command-center feel */
.ayd-hero{
  padding: clamp(4.8rem,7vw,7.2rem) 0 clamp(4.1rem,5vw,5.8rem) !important;
  background:
    radial-gradient(circle at 12% 28%,rgba(255,122,47,.22),transparent 24rem),
    radial-gradient(circle at 74% 18%,rgba(24,214,207,.14),transparent 24rem),
    linear-gradient(135deg,#10102c 0%,#302b63 52%,#1a1b3d 100%) !important;
  isolation:isolate;
}
.ayd-hero:before{
  inset:0 auto auto 0 !important;
  width:100% !important;
  height:100% !important;
  background:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
  background-size: 48px 48px !important;
  opacity:.22 !important;
  animation:none !important;
  transform:none !important;
  z-index:-2;
}
.ayd-hero:after{
  content:"" !important;
  position:absolute !important;
  right:-6rem !important;
  top:8rem !important;
  left:auto !important;
  bottom:auto !important;
  width:48rem !important;
  height:16rem !important;
  background:linear-gradient(90deg,transparent,rgba(239,59,45,.45),transparent) !important;
  opacity:.28 !important;
  filter:blur(22px) !important;
  animation:none !important;
  transform:rotate(-3deg) !important;
  z-index:-1;
}
.ayd-hero h1{
  font-size: clamp(2.65rem,5vw,5rem) !important;
  letter-spacing:-.065em;
  max-width: 850px;
  text-wrap:balance;
}
.ayd-hero .lead{
  max-width: 780px;
  font-size: clamp(1.02rem,1.35vw,1.22rem) !important;
  line-height:1.75;
  color:rgba(255,255,255,.78) !important;
}
.home-elite-proof{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  margin-top:1.15rem;
}
.home-elite-proof span{
  display:inline-flex;
  align-items:center;
  gap:.48rem;
  padding:.52rem .82rem;
  border-radius:999px;
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.82);
  font-size:.82rem;
  font-weight:800;
  backdrop-filter: blur(12px);
}
.home-elite-proof i{color:var(--elite-cyan)}
.home-elite-actions .btn{
  border-radius:16px !important;
  padding:.86rem 1.22rem !important;
  font-weight:900 !important;
  letter-spacing:-.01em;
}
.ayd-hero .btn-ayd{
  box-shadow:0 18px 42px rgba(239,59,45,.32), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
.ayd-hero .btn-ayd-outline{
  color:#fff !important;
  border-color:rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.06) !important;
  backdrop-filter: blur(14px);
}
.ayd-hero .btn-ayd-outline:hover{
  border-color:rgba(255,122,47,.8) !important;
  background:rgba(239,59,45,.18) !important;
}
.hero-stats{
  gap:1rem !important;
  margin-top:2rem !important;
}
.hero-stat{
  min-width:110px;
  text-align:left !important;
  padding:1rem 1.05rem !important;
  border-radius:20px !important;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
}
.hero-stat .number{font-size:1.72rem !important;color:#ff9c44 !important;letter-spacing:-.04em}
.hero-stat .label{font-weight:900;color:rgba(255,255,255,.62) !important}
/* Hero visual */
.home-yandal-visual{
  padding:1.25rem !important;
  border-radius:32px !important;
  background:
    radial-gradient(circle at 50% 0%,rgba(24,214,207,.16),transparent 17rem),
    linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.055)) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 28px 84px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.1) !important;
}
.home-yandal-grid{gap:.9rem !important}
.home-yandal-item{
  min-height:126px !important;
  border-radius:22px !important;
  background:linear-gradient(180deg,rgba(11,16,32,.48),rgba(11,16,32,.26)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
}
.home-yandal-item:hover{transform:translateY(-2px);border-color:rgba(24,214,207,.25) !important}
.home-yandal-tags span{background:rgba(255,255,255,.13) !important;border-color:rgba(255,255,255,.14) !important}
/* Personal panel */
.home-user-section{
  margin-top:-46px !important;
}
.home-command-card{
  border-radius:34px !important;
  border:1px solid rgba(255,255,255,.92) !important;
  background:rgba(255,255,255,.93) !important;
  box-shadow:0 30px 90px rgba(15,23,42,.16) !important;
}
.home-command-card .command-hero{
  padding:1.65rem !important;
  background:
    radial-gradient(circle at 0% 0%,rgba(239,59,45,.08),transparent 18rem),
    radial-gradient(circle at 100% 25%,rgba(24,214,207,.08),transparent 20rem),
    linear-gradient(135deg,#fff 0%,#f8fafc 48%,#fff5f0 100%) !important;
}
.home-pill{
  background:#eef4ff !important;
  color:#1e3a8a !important;
  border:1px solid rgba(37,99,235,.08);
}
.home-kpi-card{
  border-radius:22px !important;
  background:linear-gradient(180deg,#fff,#fbfdff) !important;
  box-shadow:0 12px 28px rgba(15,23,42,.055);
  position:relative;
  overflow:hidden;
}
.home-kpi-card:before{
  content:"";
  position:absolute;
  left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--elite-red),var(--elite-orange));
}
.home-kpi-card .kpi-number{font-size:1.85rem !important;color:#f0642d !important;letter-spacing:-.045em}
.home-smart-row{
  margin-top:1.25rem !important;
  display:grid !important;
  gap:1rem !important;
  align-items:stretch;
}
.home-smart-row.has-survey{grid-template-columns:minmax(0,1fr) minmax(360px,520px) !important}
.home-smart-row.no-survey{grid-template-columns:minmax(0,1fr) minmax(340px,420px) !important}
.home-smart-column{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:1rem !important}
.home-smart-card{
  min-height:174px !important;
  border-radius:24px !important;
  box-shadow:0 16px 42px rgba(15,23,42,.075) !important;
  overflow:hidden;
  position:relative;
}
.home-smart-card:after{
  content:"";
  position:absolute;right:-35px;top:-35px;width:96px;height:96px;border-radius:999px;background:rgba(37,99,235,.07);
}
.home-smart-card.smart-success:after{background:rgba(22,163,74,.08)}
.home-command-side-card{
  height:100%;
  border-radius:24px;
  padding:1rem;
  color:#fff;
  background:
    radial-gradient(circle at 85% 0%,rgba(24,214,207,.25),transparent 12rem),
    linear-gradient(135deg,#121735 0%,#191d49 55%,#2e1740 100%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 16px 42px rgba(15,23,42,.14);
}
.home-command-side-card .side-kicker{
  display:inline-flex;gap:.45rem;align-items:center;border-radius:999px;padding:.38rem .7rem;background:rgba(255,255,255,.1);font-weight:900;font-size:.75rem;color:#bffefa;border:1px solid rgba(255,255,255,.1);
}
.home-command-side-card h5{font-weight:900;margin:.85rem 0 1rem;letter-spacing:-.02em;color:#fff}
.side-step{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:.75rem;align-items:center;padding:.68rem 0;border-top:1px solid rgba(255,255,255,.09)}
.side-step span{grid-row:1/3;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:rgba(24,214,207,.12);color:#58fff3;font-weight:900;font-size:.78rem}
.side-step strong{color:#fff;line-height:1.2}
.side-step small{color:rgba(255,255,255,.64);line-height:1.3}
/* Roadmap / How it works */
.home-content-band{
  background:linear-gradient(180deg,#f6f8fc 0%,#fff 100%) !important;
}
.home-roadmap-card,
.home-simple-card,
.home-latest-column{
  border-radius:26px !important;
  border:1px solid var(--elite-line) !important;
  box-shadow:var(--elite-shadow-soft) !important;
}
.home-roadmap-card{padding:1.35rem !important}
.home-roadmap-card h6,.home-simple-card h6{font-size:1.05rem}
.home-roadmap-icon{background:linear-gradient(135deg,#fff4f0,#ffe7dc) !important;color:#ef4b31 !important}
.home-section-heading h2,
.home-section-title,
.section-title{
  color:var(--elite-ink) !important;
  letter-spacing:-.045em !important;
}
.section-badge{
  padding:.43rem .9rem !important;
  background:#fff1f2 !important;
  color:#e11d48 !important;
  border:1px solid rgba(225,29,72,.08);
  font-weight:900 !important;
}
/* Latest content: less plain, more premium */
.home-latest-grid{gap:1.15rem !important}
.home-latest-column{
  padding:1rem !important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
  min-height:auto !important;
}
.home-latest-head{
  padding:.15rem .15rem .8rem;
  border-bottom:1px solid rgba(15,23,42,.07);
}
.home-latest-head h5{font-size:1.02rem !important;letter-spacing:-.02em}
.home-latest-head .btn{
  border-radius:12px !important;
  font-size:.8rem;
  font-weight:900;
}
.home-latest-item{
  margin-top:.75rem !important;
  margin-bottom:0 !important;
  padding:.9rem .95rem !important;
  border-radius:18px !important;
  background:#f8fafc !important;
  border:1px solid rgba(15,23,42,.065) !important;
  transition:.18s ease;
}
.home-latest-item:hover{
  transform:translateY(-2px);
  background:#fff !important;
  border-color:rgba(239,59,45,.22) !important;
  box-shadow:0 14px 32px rgba(15,23,42,.08);
}
.home-latest-item strong{font-size:.96rem !important;color:#0f172a !important}
.home-latest-item small{font-size:.84rem !important;color:#64748b !important}
/* Spots */
.spot-card{
  height:100%;
  min-height:300px;
  display:flex;
  flex-direction:column;
  padding:1.45rem !important;
  border-radius:26px !important;
  background:
    radial-gradient(circle at 85% 12%,rgba(255,122,47,.14),transparent 10rem),
    linear-gradient(145deg,#121735 0%,#171b3c 56%,#0d1228 100%) !important;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 22px 62px rgba(15,23,42,.18);
}
.spot-card:before{font-size:8rem !important;top:-2.2rem !important;right:1rem !important;opacity:.045 !important}
.spot-card .spot-title{
  line-height:1.25;
  letter-spacing:-.02em;
  min-height:3.05rem;
}
.spot-card .spot-content{
  font-size:.95rem !important;
  line-height:1.68;
  color:rgba(255,255,255,.78) !important;
  display:-webkit-box;
  -webkit-line-clamp:5;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.spot-card .mt-3{margin-top:auto !important}
.spot-card .spot-tag{
  background:rgba(255,255,255,.11) !important;
  border:1px solid rgba(255,255,255,.06);
  padding:.28rem .65rem !important;
  font-weight:800;
}
/* Bottom CTA */
section[style*="--ayd-gradient-dark"]{
  background:
    radial-gradient(circle at 25% 0%,rgba(255,122,47,.18),transparent 18rem),
    radial-gradient(circle at 80% 30%,rgba(24,214,207,.12),transparent 18rem),
    linear-gradient(135deg,#0b1020,#171b3c 58%,#27124b) !important;
  margin-top:0 !important;
  border-top:1px solid rgba(255,255,255,.08);
}
section[style*="--ayd-gradient-dark"] h2{letter-spacing:-.035em}
/* spacing refinements */
section.py-5{padding-top:4.5rem !important;padding-bottom:4.5rem !important}
section.bg-white{background:#fff !important}
.text-muted{color:#667085 !important}
@media(max-width:1199.98px){
  .home-smart-row.has-survey,.home-smart-row.no-survey{grid-template-columns:1fr !important}
  .home-smart-column{grid-template-columns:1fr !important}
}
@media(max-width:991.98px){
  .ayd-hero{padding-top:4.2rem !important}
  .hero-stat{min-width:calc(50% - .5rem)}
  .home-user-section{margin-top:0 !important;padding-top:1rem}
  .home-command-card{border-radius:24px !important}
  .home-latest-grid{grid-template-columns:1fr !important}
}
@media(max-width:575.98px){
  .ayd-hero h1{font-size:2.55rem !important}
  .hero-stats{gap:.75rem !important}
  .hero-stat{min-width:100%;}
  .home-elite-actions{flex-direction:column}
  .home-elite-actions .btn{width:100%}
  section.py-5{padding-top:3.25rem !important;padding-bottom:3.25rem !important}
}