.page-home{
  --home-bg:#0B1622;
  --home-card:rgba(19,33,58,.72);
  --home-line:rgba(180,220,255,.16);
  --home-ink:#E8EDF5;
  --home-muted:#A7BCD0;
  --home-accent:#FF5A36;
  --home-violet:#8B5CFF;
  --home-gold:#D9A441;
  position:relative;
  background-color:var(--home-bg);
  color:var(--home-ink);
  font-family:var(--font-body);
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
.page-home::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:linear-gradient(to right,rgba(130,190,255,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(130,190,255,.05) 1px,transparent 1px);
  background-size:44px 44px;
  transform:rotate(-.6deg) scale(1.04);
}
.page-home::after{
  content:"";
  position:absolute;
  top:120px;
  right:-8%;
  width:520px;
  height:520px;
  background:radial-gradient(circle,rgba(139,92,255,.14),transparent 62%);
  pointer-events:none;
  z-index:0;
}
.page-home .container{
  position:relative;
  z-index:1;
}
.page-home a:focus-visible,
.page-home .filter-btn:focus-visible,
.page-home .btn:focus-visible{
  outline:2px solid var(--home-accent);
  outline-offset:2px;
}
.page-home .section{
  border-top:1px solid var(--home-line);
}
.page-home .home-mast{
  border-top:0;
}
.page-home .section-head{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px 18px;
  margin-bottom:24px;
}
.page-home .section-head-text{
  flex:1 1 320px;
  min-width:260px;
}
.page-home .section-kicker{
  display:inline-block;
  margin-bottom:6px;
  font-size:12px;
  letter-spacing:.14em;
  color:var(--home-accent);
  text-transform:uppercase;
  font-weight:700;
}
.page-home .section-title{
  font-family:var(--font-display);
  font-size:28px;
  line-height:1.2;
  margin:0;
  color:var(--home-ink);
}
.page-home .section-subtitle{
  margin-top:8px;
  margin-bottom:0;
  color:var(--home-muted);
  font-size:14px;
  line-height:1.7;
  max-width:62ch;
}
.page-home .section-index{
  font-family:var(--font-display);
  font-size:16px;
  font-weight:700;
  color:var(--home-gold);
  border:1px solid var(--home-line);
  border-radius:999px;
  padding:8px 14px;
  white-space:nowrap;
}
.page-home .breadcrumb-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  margin:0 0 18px;
  padding:0;
  font-size:13px;
  color:var(--home-muted);
}
.page-home .breadcrumb-item + .breadcrumb-item::before{
  content:"/";
  margin-right:8px;
  color:var(--home-line);
}
.page-home .breadcrumb-link{
  color:var(--home-muted);
  text-decoration:none;
  transition:color .2s;
}
.page-home .breadcrumb-link:hover{
  color:var(--home-accent);
}
.page-home .home-mast{
  padding:40px 0 72px;
}
.page-home .home-mast-inner{
  display:grid;
  gap:38px;
}
.page-home .home-kicker{
  font-size:13px;
  font-weight:700;
  letter-spacing:.18em;
  color:var(--home-accent);
  text-transform:uppercase;
  margin:0 0 14px;
}
.page-home .home-title{
  margin:0 0 20px;
  font-family:var(--font-display);
  font-size:clamp(34px,7vw,60px);
  line-height:1.1;
  letter-spacing:.01em;
  max-width:12em;
}
.page-home .home-lead{
  max-width:58ch;
  color:var(--home-muted);
  font-size:16px;
  line-height:1.8;
  margin:0;
}
.page-home .home-mast-meta{
  display:flex;
  flex-wrap:wrap;
  gap:12px 22px;
  margin-top:26px;
  padding-top:18px;
  border-top:1px solid var(--home-line);
  font-size:13px;
  color:var(--home-muted);
}
.page-home .home-mast-meta a{
  color:var(--home-gold);
  text-decoration:none;
  font-weight:600;
  transition:color .2s;
}
.page-home .home-mast-meta a:hover{
  color:var(--home-accent);
}
.page-home .home-directory{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
  align-content:center;
}
.page-home .home-directory .filter-btn:first-child{
  grid-column:1 / -1;
}
.page-home .home-directory .filter-btn{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  padding:16px 14px;
  background:rgba(16,31,51,.72);
  border:1px solid var(--home-line);
  border-radius:14px;
  text-decoration:none;
  color:var(--home-ink);
  overflow:hidden;
  transition:border-color .3s,background-color .3s,transform .3s var(--ease);
}
.page-home .home-directory .filter-btn::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  height:100%;
  background:var(--home-accent);
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .3s var(--ease);
}
.page-home .home-directory .filter-btn:hover,
.page-home .home-directory .filter-btn.is-active{
  border-color:var(--home-accent);
  background:rgba(255,90,54,.14);
  transform:translateY(-2px);
}
.page-home .home-directory .filter-btn.is-active::before{
  transform:scaleY(1);
}
.page-home .fb-index{
  font-family:var(--font-display);
  color:var(--home-gold);
  font-size:20px;
}
.page-home .fb-text{
  font-weight:700;
  font-size:14px;
}
.page-home .fb-mark{
  font-size:10px;
  letter-spacing:.1em;
  color:var(--home-muted);
  text-transform:uppercase;
}
.page-home .btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 18px;
  border-radius:999px;
  font-size:14px;
  font-weight:600;
  text-decoration:none;
  border:1px solid transparent;
  transition:transform .3s var(--ease),background-color .3s,border-color .3s,box-shadow .3s;
}
.page-home .btn-primary{
  background:var(--home-accent);
  color:#1A1206;
  border-color:var(--home-accent);
}
.page-home .btn-primary:hover{
  background:#FF7844;
  transform:translateY(-2px);
}
.page-home .btn-outline{
  border-color:var(--home-line);
  color:var(--home-ink);
  background:transparent;
}
.page-home .btn-outline:hover{
  border-color:var(--home-accent);
  color:var(--home-accent);
  transform:translateX(4px);
}
.page-home .tag{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  color:var(--home-ink);
  background:rgba(168,220,255,.1);
  border:1px solid var(--home-line);
}
.page-home .tag-accent{
  color:#1C100A;
  background:var(--home-accent);
  border-color:var(--home-accent);
}
.page-home .tag-violet{
  color:var(--home-ink);
  background:rgba(139,92,255,.18);
  border-color:rgba(139,92,255,.5);
}
.page-home .home-news{
  padding:72px 0;
}
.page-home .home-news-layout{
  display:grid;
  gap:18px;
  margin-top:28px;
}
.page-home .home-news-feature{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  background:var(--home-card);
  border:1px solid var(--home-line);
  border-radius:18px;
  padding:16px;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.page-home .home-news-feature:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.26);
}
.page-home .home-news-img{
  width:100%;
  height:auto;
  border-radius:12px;
  object-fit:cover;
}
.page-home .news-card{
  padding:6px 2px;
}
.page-home .news-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}
.page-home .news-card h3{
  font-family:var(--font-display);
  font-size:22px;
  line-height:1.35;
  margin:0 0 12px;
}
.page-home .news-card p{
  color:var(--home-muted);
  font-size:15px;
  line-height:1.7;
  margin:0 0 14px;
}
.page-home .news-more{
  color:var(--home-accent);
  text-decoration:none;
  font-weight:700;
  font-size:14px;
}
.page-home .news-more:hover{
  text-decoration:underline;
}
.page-home .home-news-list{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
.page-home .news-mini{
  padding:16px;
  background:rgba(19,33,58,.55);
  border:1px solid var(--home-line);
  border-left:3px solid var(--home-violet);
  border-radius:12px;
  transition:transform .3s var(--ease),border-color .3s,background-color .3s;
}
.page-home .news-mini:hover{
  transform:translateX(4px);
  border-color:var(--home-violet);
  background:rgba(19,33,58,.85);
}
.page-home .news-mini h3{
  font-size:16px;
  line-height:1.5;
  margin:8px 0;
  color:var(--home-ink);
}
.page-home .news-mini a{
  color:inherit;
  text-decoration:none;
  transition:color .2s;
}
.page-home .news-mini a:hover{
  color:var(--home-accent);
}
.page-home .news-mini p{
  color:var(--home-muted);
  font-size:13px;
  line-height:1.6;
  margin:0;
}
.page-home .home-notice{
  padding:72px 0;
}
.page-home .home-notice-panel{
  position:relative;
  display:grid;
  gap:26px;
  padding:28px 22px;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,122,71,.2),rgba(255,90,54,.94)),var(--home-accent);
  color:#1C100A;
  border:1px solid rgba(255,190,150,.3);
  overflow:hidden;
}
.page-home .home-notice-panel::after{
  content:"02";
  position:absolute;
  right:-14px;
  bottom:-44px;
  font-family:var(--font-display);
  font-size:160px;
  line-height:1;
  color:rgba(28,16,10,.08);
  pointer-events:none;
}
.page-home .home-notice-head{
  margin-bottom:0;
}
.page-home .home-notice-panel .section-kicker,
.page-home .home-notice-panel .section-title{
  color:#1C100A;
}
.page-home .home-notice-panel .section-index{
  border-color:rgba(28,16,10,.4);
  color:#1C100A;
}
.page-home .home-notice-desc{
  max-width:62ch;
  font-size:15px;
  line-height:1.8;
  margin-top:14px;
  margin-bottom:0;
  color:rgba(28,16,10,.85);
}
.page-home .home-steps{
  list-style:none;
  margin:18px 0 20px;
  padding:0;
  display:grid;
  gap:12px;
  grid-template-columns:1fr;
}
.page-home .home-steps li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  background:rgba(28,16,10,.08);
  border-radius:12px;
  padding:12px 14px;
}
.page-home .step-no{
  font-family:var(--font-display);
  font-size:20px;
  color:#1C100A;
  opacity:.6;
}
.page-home .home-steps strong{
  display:block;
  margin-bottom:4px;
  font-weight:800;
  font-size:14px;
}
.page-home .home-steps p{
  margin:0;
  font-size:13px;
  line-height:1.6;
  color:rgba(28,16,10,.8);
}
.page-home .home-notice-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:6px;
}
.page-home .home-notice .btn{
  background:#1C100A;
  color:#FFF4E8;
  border-color:#1C100A;
}
.page-home .home-notice .btn:hover{
  background:#2E2016;
  transform:translateY(-2px);
}
.page-home .home-notice-visual{
  display:grid;
  grid-template-columns:120px 1fr;
  align-items:center;
  gap:16px;
  padding:14px;
  border-radius:14px;
  background:rgba(28,16,10,.08);
}
.page-home .home-notice-visual img{
  width:120px;
  height:120px;
  border-radius:12px;
  object-fit:cover;
}
.page-home .home-notice-visual p{
  margin:0 0 10px;
  color:rgba(28,16,10,.75);
  font-size:13px;
  line-height:1.6;
}
.page-home .home-notice-visual p:last-child{
  margin-bottom:0;
}
.page-home .home-rank{
  padding:72px 0;
}
.page-home .rank-pulse{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  align-items:end;
  margin:22px 0 14px;
  padding:12px;
  border:1px solid var(--home-line);
  border-radius:14px;
  background:rgba(19,33,58,.4);
}
.page-home .rank-pulse img{
  width:100%;
  height:auto;
  border-radius:8px;
  object-fit:cover;
}
.page-home .rank-pulse-tag{
  font-size:11px;
  letter-spacing:.1em;
  color:var(--home-gold);
  white-space:nowrap;
}
.page-home .rank-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.page-home .rank-item{
  position:relative;
  display:grid;
  grid-template-columns:44px 1fr auto;
  gap:12px;
  align-items:center;
  padding:13px 14px;
  border-radius:12px;
  background:rgba(19,33,58,.55);
  border:1px solid var(--home-line);
  overflow:hidden;
  transition:transform .3s var(--ease),border-color .3s,background-color .3s;
}
.page-home .rank-item:hover{
  transform:translateX(5px);
  border-color:var(--home-gold);
  background:rgba(19,33,58,.9);
}
.page-home .rank-index{
  font-family:var(--font-display);
  font-size:20px;
  color:var(--home-gold);
}
.page-home .rank-item:nth-child(1) .rank-index,
.page-home .rank-item:nth-child(2) .rank-index,
.page-home .rank-item:nth-child(3) .rank-index{
  color:var(--home-accent);
}
.page-home .rank-main{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:8px;
  min-width:0;
}
.page-home .rank-main strong{
  font-size:16px;
  font-weight:800;
  color:var(--home-ink);
}
.page-home .rank-main span{
  color:var(--home-muted);
  font-size:12px;
}
.page-home .rank-score{
  font-size:20px;
  font-weight:800;
  font-family:var(--font-display);
  color:var(--home-ink);
}
.page-home .rank-reason{
  grid-column:2 / -1;
  color:var(--home-muted);
  font-size:13px;
  line-height:1.4;
}
.page-home .rank-bar{
  position:absolute;
  left:0;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg,var(--home-violet),var(--home-accent));
}
.page-home .rank-item:nth-child(1) .rank-bar{width:97%}
.page-home .rank-item:nth-child(2) .rank-bar{width:95%}
.page-home .rank-item:nth-child(3) .rank-bar{width:93%}
.page-home .rank-item:nth-child(4) .rank-bar{width:90%}
.page-home .rank-item:nth-child(5) .rank-bar{width:88%}
.page-home .rank-item:nth-child(6) .rank-bar{width:86%}
.page-home .rank-item:nth-child(7) .rank-bar{width:84%}
.page-home .rank-item:nth-child(8) .rank-bar{width:82%}
.page-home .rank-item:nth-child(9) .rank-bar{width:80%}
.page-home .rank-item:nth-child(10) .rank-bar{width:78%}
.page-home .home-guides{
  padding:72px 0;
}
.page-home .home-guides-grid{
  display:grid;
  gap:16px;
  margin-top:28px;
}
.page-home .guide-card{
  display:flex;
  flex-direction:column;
  background:var(--home-card);
  border:1px solid var(--home-line);
  border-radius:16px;
  overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;
}
.page-home .guide-card:hover{
  transform:translateY(-5px);
  border-color:var(--home-violet);
  box-shadow:0 20px 44px rgba(0,0,0,.26);
}
.page-home .guide-cover{
  width:100%;
  height:auto;
  object-fit:cover;
  border-bottom:1px solid var(--home-line);
}
.page-home .guide-body{
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1;
}
.page-home .guide-body h3{
  font-family:var(--font-display);
  font-size:18px;
  line-height:1.4;
  margin:0;
  color:var(--home-ink);
}
.page-home .guide-body p{
  color:var(--home-muted);
  font-size:14px;
  line-height:1.7;
  margin:0;
  flex:1;
}
.page-home .guide-more{
  color:var(--home-accent);
  font-weight:700;
  text-decoration:none;
  font-size:14px;
}
.page-home .guide-more:hover{
  text-decoration:underline;
}
.page-home .home-data{
  padding:48px 0;
}
.page-home .home-data-label{
  display:block;
  font-size:12px;
  letter-spacing:.16em;
  color:var(--home-muted);
  margin-bottom:18px;
  text-transform:uppercase;
}
.page-home .home-data-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}
.page-home .home-stat{
  padding:18px;
  border-radius:14px;
  background:rgba(19,33,58,.5);
  border:1px solid var(--home-line);
}
.page-home .home-stat strong{
  display:block;
  font-family:var(--font-display);
  font-size:30px;
  color:var(--home-gold);
}
.page-home .home-stat span{
  display:block;
  margin-top:8px;
  color:var(--home-muted);
  font-size:13px;
  line-height:1.6;
}
.page-home .home-bottom{
  padding:0 0 72px;
}
.page-home .home-bottom-inner{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:26px 28px;
  border-radius:16px;
  border:1px solid var(--home-line);
  background:linear-gradient(120deg,rgba(139,92,255,.16),rgba(255,90,54,.12));
}
.page-home .home-bottom-inner p{
  margin:0;
  color:var(--home-muted);
  font-size:14px;
  line-height:1.7;
}
.page-home .home-bottom-inner a{
  color:var(--home-gold);
  text-decoration:none;
}
.page-home .home-bottom-inner a:hover{
  color:var(--home-accent);
  text-decoration:underline;
}
.page-home .home-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 22px;
}
.page-home .home-bottom-links a{
  color:var(--home-ink);
  text-decoration:none;
  font-size:14px;
  font-weight:600;
}
.page-home .home-bottom-links a:hover{
  color:var(--home-accent);
}

@media (min-width:640px){
  .page-home .home-steps{
    grid-template-columns:1fr 1fr;
  }
  .page-home .home-data-grid{
    grid-template-columns:repeat(4,1fr);
  }
}

@media (min-width:760px){
  .page-home .home-guides-grid{
    grid-template-columns:1fr 1fr;
  }
  .page-home .guide-card:first-child{
    grid-column:1 / -1;
  }
  .page-home .guide-card:first-child .guide-body{
    max-width:62ch;
  }
}

@media (min-width:880px){
  .page-home .home-mast-inner{
    grid-template-columns:1.35fr .9fr;
    align-items:end;
  }
  .page-home .home-news-layout{
    grid-template-columns:1.08fr .92fr;
  }
  .page-home .home-notice-panel{
    grid-template-columns:1.2fr .8fr;
    align-items:center;
  }
  .page-home .home-notice-visual{
    grid-template-columns:1fr;
    text-align:left;
  }
  .page-home .home-notice-visual img{
    width:200px;
    height:200px;
  }
  .page-home .rank-pulse{
    grid-template-columns:1fr auto;
  }
  .page-home .rank-item{
    grid-template-columns:46px 1fr auto 1fr;
  }
  .page-home .rank-reason{
    grid-column:auto;
    text-align:right;
  }
}

@media (min-width:1080px){
  .page-home .home-directory{
    grid-template-columns:1fr 1fr;
  }
  .page-home .home-guides-grid{
    grid-template-columns:1.05fr .95fr .95fr;
  }
  .page-home .guide-card:first-child{
    grid-column:auto;
  }
}
