/* === Home Page: ChaoSheng FM === */

:root{
  --cs-ink:#101828;
  --cs-text:#253047;
  --cs-muted:#667085;
  --cs-line:#e6ebf0;
  --cs-bg:#f6f8fb;
  --cs-panel:#ffffff;
  --cs-teal:#2bbfb0;
  --cs-yellow:#ffd166;
  --cs-coral:#ff735c;
  --cs-blue:#3b6fed;
  --cs-shadow:0 18px 42px rgba(16,24,40,.08);
}

body{background:#fff;color:var(--cs-text)}
.section-header{max-width:760px;margin:0 auto 34px;text-align:center}
.section-title{letter-spacing:0}
.section-subtitle{color:var(--cs-muted)}
.section-more{color:var(--cs-coral);font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.section-more:hover{color:#d94e38}
.detail-btn{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 14px;border-radius:6px;background:var(--cs-ink);color:#fff;font-size:13px;text-decoration:none}
.detail-btn:hover{background:var(--cs-coral);color:#fff}

.home-hero{
  position:relative;
  padding:92px 0 76px;
  background:#111827;
  overflow:hidden;
}
.home-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,rgba(17,24,39,.98) 0%,rgba(17,24,39,.92) 52%,rgba(246,248,251,.96) 52.2%,rgba(246,248,251,.96) 100%);
  z-index:0;
}
.home-hero__inner{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);
  gap:58px;
  align-items:center;
}
.home-copy{max-width:650px}
.home-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:7px 14px;
  border:1px solid rgba(43,191,176,.45);
  border-radius:999px;
  background:rgba(43,191,176,.14);
  color:#8df4e7;
  font-size:13px;
}
.home-title{
  margin:22px 0 18px;
  color:#fff;
  font-size:46px;
  line-height:1.14;
  font-weight:800;
  letter-spacing:0;
}
.home-title span{color:var(--cs-yellow)}
.home-lead{
  max-width:620px;
  margin:0 0 28px;
  color:rgba(255,255,255,.78);
  font-size:17px;
  line-height:1.9;
}
.home-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:24px}
.home-actions .btn{
  min-height:46px;
  border-radius:8px;
  padding:12px 22px;
  font-weight:800;
}
.home-actions .btn-primary{
  background:var(--cs-coral);
  color:#fff;
  box-shadow:0 14px 30px rgba(255,115,92,.26);
}
.home-actions .btn-primary:hover{background:#ee624c;color:#fff}
.home-actions .btn-ghost{
  border:1px solid rgba(141,244,231,.6);
  background:rgba(141,244,231,.08);
  color:#8df4e7;
}
.home-actions .btn-ghost:hover{background:#8df4e7;color:#111827}
.home-trust{display:flex;flex-wrap:wrap;gap:10px}
.home-trust span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:34px;
  padding:6px 12px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.8);
  font-size:13px;
}
.home-trust strong{color:var(--cs-yellow)}

.studio-player{
  border-radius:8px;
  background:#fff;
  border:1px solid rgba(16,24,40,.08);
  box-shadow:0 26px 76px rgba(16,24,40,.2);
  padding:24px;
}
.studio-player__top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding-bottom:16px;
  border-bottom:1px solid var(--cs-line);
}
.studio-player__top span{font-size:13px;color:var(--cs-muted)}
.studio-player__top strong{font-size:14px;color:var(--cs-ink);white-space:nowrap}
.studio-player__body{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:20px;
  padding:22px 0;
}
.studio-cover{
  position:relative;
  min-height:174px;
  border-radius:8px;
  background:linear-gradient(160deg,#101828 0%,#263449 56%,#2bbfb0 100%);
  overflow:hidden;
}
.studio-cover::before{
  content:"";
  position:absolute;
  inset:22px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:50%;
}
.studio-disc{
  position:absolute;
  left:50%;
  top:50%;
  width:76px;
  height:76px;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--cs-yellow);
  color:var(--cs-ink);
  font-size:25px;
  box-shadow:0 0 0 14px rgba(255,209,102,.2);
}
.studio-track{min-width:0}
.studio-track p{margin:0 0 5px;color:var(--cs-muted);font-size:14px}
.studio-track h2{margin:0;color:var(--cs-ink);font-size:24px;line-height:1.3;letter-spacing:0}
.studio-wave{
  height:62px;
  display:flex;
  align-items:end;
  gap:5px;
  margin:22px 0 16px;
}
.studio-wave i{
  flex:1;
  min-width:5px;
  border-radius:5px 5px 0 0;
  background:linear-gradient(180deg,var(--cs-teal),var(--cs-coral));
}
.studio-wave i:nth-child(1){height:18px}.studio-wave i:nth-child(2){height:38px}.studio-wave i:nth-child(3){height:50px}.studio-wave i:nth-child(4){height:28px}.studio-wave i:nth-child(5){height:56px}.studio-wave i:nth-child(6){height:32px}.studio-wave i:nth-child(7){height:46px}.studio-wave i:nth-child(8){height:22px}.studio-wave i:nth-child(9){height:58px}.studio-wave i:nth-child(10){height:34px}.studio-wave i:nth-child(11){height:42px}.studio-wave i:nth-child(12){height:26px}
.studio-progress{height:6px;border-radius:999px;background:#e9edf2;overflow:hidden}
.studio-progress span{display:block;width:64%;height:100%;border-radius:inherit;background:var(--cs-ink)}
.studio-controls{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:18px}
.studio-controls button{
  width:38px;
  height:38px;
  border:1px solid var(--cs-line);
  border-radius:50%;
  background:#fff;
  color:var(--cs-ink);
  cursor:pointer;
}
.studio-controls .is-main{
  width:50px;
  height:50px;
  border:none;
  background:var(--cs-coral);
  color:#fff;
  box-shadow:0 10px 20px rgba(255,115,92,.25);
}
.studio-queue{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.studio-queue a{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  min-height:48px;
  padding:11px 12px;
  border-radius:8px;
  background:#f6f8fb;
  border:1px solid #edf1f5;
  color:#344054;
  text-decoration:none;
}
.studio-queue a:hover{border-color:var(--cs-teal);color:var(--cs-ink)}
.studio-queue em{font-style:normal;font-size:12px;font-weight:800;color:var(--cs-coral)}
.studio-queue span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}

.listen-path-section{padding:78px 0 70px;background:#fff}
.listen-path-layout{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  align-items:stretch;
}
.path-step,.path-side-note{
  position:relative;
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  padding:24px;
  box-shadow:none;
}
.path-step::before{
  content:"";
  position:absolute;
  left:24px;
  top:0;
  width:44px;
  height:4px;
  background:var(--cs-teal);
}
.path-step:nth-child(2)::before{background:var(--cs-yellow)}
.path-step:nth-child(3)::before{background:var(--cs-coral)}
.path-index{display:block;color:var(--cs-muted);font-size:13px;font-weight:800;margin-bottom:18px}
.path-step h3{margin:0 0 10px;color:var(--cs-ink);font-size:21px;letter-spacing:0}
.path-step p,.path-side-note p{margin:0;color:var(--cs-muted);line-height:1.75}
.path-side-note{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:190px 1fr;
  gap:18px;
  background:#101828;
  border-color:#101828;
  color:#fff;
}
.path-side-note strong{font-size:22px;letter-spacing:0}
.path-side-note p{color:rgba(255,255,255,.78)}

.editor-shelf-section{padding:78px 0;background:var(--cs-bg)}
.shelf-layout{
  display:grid;
  grid-template-columns:310px 1fr;
  gap:28px;
  align-items:start;
}
.shelf-intro{
  position:sticky;
  top:92px;
  border-radius:8px;
  background:#101828;
  color:#fff;
  padding:28px;
}
.shelf-intro span{display:inline-block;margin-bottom:12px;color:var(--cs-yellow);font-weight:800;font-size:13px}
.shelf-intro h2{margin:0 0 14px;font-size:28px;line-height:1.25;letter-spacing:0}
.shelf-intro p{margin:0 0 20px;color:rgba(255,255,255,.78);line-height:1.75}
.shelf-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.shelf-card{
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  overflow:hidden;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.shelf-card:hover{transform:translateY(-4px);box-shadow:var(--cs-shadow);border-color:rgba(43,191,176,.42)}
.shelf-cover{
  position:relative;
  display:block;
  aspect-ratio:3/4;
  background:#d9dee7;
  overflow:hidden;
}
.shelf-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .28s ease}
.shelf-card:hover .shelf-cover img{transform:scale(1.04)}
.shelf-cover::after{content:"";position:absolute;inset:42% 0 0;background:linear-gradient(180deg,transparent,rgba(16,24,40,.7))}
.shelf-cover i{
  position:absolute;
  right:12px;
  bottom:12px;
  z-index:1;
  width:38px;
  height:38px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--cs-yellow);
  color:var(--cs-ink);
}
.shelf-meta{padding:14px 14px 16px}
.shelf-meta h3{margin:0 0 8px;font-size:16px;line-height:1.42;letter-spacing:0}
.shelf-meta h3 a{color:var(--cs-ink);text-decoration:none}
.shelf-meta h3 a:hover{color:var(--cs-coral)}
.shelf-meta p{margin:0;color:var(--cs-muted);font-size:13px}
.shelf-meta i{color:var(--cs-coral)}

.listening-map-section{padding:78px 0;background:#fff}
.section-header-flex{display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left;max-width:none}
.map-grid{display:grid;grid-template-columns:1.15fr .92fr .92fr;gap:18px}
.map-card{
  position:relative;
  min-height:318px;
  border-radius:8px;
  overflow:hidden;
  background:#111827;
}
.map-card img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88}
.map-card div{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:24px;
  color:#fff;
  background:linear-gradient(180deg,transparent,rgba(16,24,40,.86));
}
.map-card span{display:block;margin-bottom:8px;color:var(--cs-yellow);font-weight:800;font-size:13px}
.map-card h3{margin:0 0 8px;font-size:22px;letter-spacing:0}
.map-card p{margin:0;color:rgba(255,255,255,.78);line-height:1.65}

.sound-lab-section{padding:78px 0;background:#101828;color:#fff}
.sound-lab-section .section-title{color:#fff}
.sound-lab-section .section-subtitle{color:rgba(255,255,255,.72)}
.sound-lab-layout{display:grid;grid-template-columns:.96fr 1.04fr;gap:44px;align-items:center}
.sound-console{
  border-radius:8px;
  border:1px solid rgba(255,255,255,.12);
  background:#0b1220;
  padding:28px;
}
.console-header{display:flex;align-items:center;gap:10px;margin-bottom:28px}
.console-header span{width:10px;height:10px;border-radius:50%;background:var(--cs-teal);box-shadow:0 0 0 7px rgba(43,191,176,.16)}
.console-header strong{font-size:17px;color:#fff}
.console-header em{margin-left:auto;color:var(--cs-yellow);font-style:normal;font-size:13px}
.console-spectrum{height:150px;display:grid;grid-template-columns:repeat(10,1fr);gap:8px;align-items:end;margin-bottom:24px}
.console-spectrum i{display:block;border-radius:6px 6px 0 0;background:linear-gradient(180deg,#8df4e7,var(--cs-teal))}
.console-spectrum i:nth-child(1){height:30%}.console-spectrum i:nth-child(2){height:72%}.console-spectrum i:nth-child(3){height:46%}.console-spectrum i:nth-child(4){height:92%}.console-spectrum i:nth-child(5){height:58%}.console-spectrum i:nth-child(6){height:76%}.console-spectrum i:nth-child(7){height:38%}.console-spectrum i:nth-child(8){height:84%}.console-spectrum i:nth-child(9){height:52%}.console-spectrum i:nth-child(10){height:66%}
.console-list{display:grid;gap:10px}
.console-list p{
  display:flex;
  gap:10px;
  align-items:center;
  margin:0;
  padding:12px;
  border-radius:8px;
  color:rgba(255,255,255,.82);
  background:rgba(255,255,255,.06);
}
.console-list b{color:var(--cs-yellow)}
.lab-copy{display:grid;gap:20px}
.lab-copy article{
  padding:0 0 20px 22px;
  border-left:2px solid rgba(141,244,231,.35);
}
.lab-copy h3{margin:0 0 8px;color:#fff;font-size:20px;letter-spacing:0}
.lab-copy p{margin:0;color:rgba(255,255,255,.72);line-height:1.78}

.proof-board-section{padding:66px 0;background:var(--cs-yellow)}
.proof-board{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:26px;
  align-items:center;
}
.proof-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.proof-metrics div{
  min-height:112px;
  padding:18px;
  border-radius:8px;
  background:rgba(255,255,255,.48);
  border:1px solid rgba(16,24,40,.1);
}
.proof-metrics strong{display:block;color:var(--cs-ink);font-size:30px;line-height:1;letter-spacing:0}
.proof-metrics span{display:block;margin-top:10px;color:rgba(16,24,40,.68);font-size:13px}
.listener-notes{
  border-radius:8px;
  background:#101828;
  color:#fff;
  padding:24px;
}
.listener-notes h2{margin:0 0 14px;font-size:24px;letter-spacing:0}
.listener-notes p{margin:0;padding:12px 0;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.78);line-height:1.65}

.customer-review-section{padding:78px 0;background:#fff}
.customer-review-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.customer-review-card{
  position:relative;
  min-height:294px;
  display:flex;
  flex-direction:column;
  padding:22px;
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  box-shadow:0 14px 34px rgba(16,24,40,.06);
}
.customer-review-card::before{
  content:"";
  position:absolute;
  left:22px;
  top:0;
  width:42px;
  height:4px;
  background:var(--cs-teal);
}
.customer-review-card:nth-child(2)::before{background:var(--cs-yellow)}
.customer-review-card:nth-child(3)::before{background:var(--cs-coral)}
.customer-review-card:nth-child(4)::before{background:var(--cs-blue)}
.review-card-top{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}
.review-avatar{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#101828;
  color:#fff;
  font-weight:800;
}
.review-card-top h3{
  margin:0 0 4px;
  color:var(--cs-ink);
  font-size:17px;
  line-height:1.3;
  letter-spacing:0;
}
.review-card-top p{margin:0;color:var(--cs-muted);font-size:13px}
.customer-review-card .review-stars{
  display:flex;
  gap:3px;
  margin-bottom:14px;
  color:#ffb020;
}
.review-comment{
  flex:1;
  margin:0 0 18px;
  color:#475467;
  line-height:1.78;
  font-size:14px;
}
.review-tag{
  display:inline-flex;
  align-items:center;
  gap:7px;
  align-self:flex-start;
  min-height:32px;
  padding:6px 11px;
  border-radius:999px;
  background:#f6f8fb;
  color:var(--cs-ink);
  font-size:13px;
  font-weight:700;
}
.review-tag i{color:var(--cs-coral)}

.dispatch-section{padding:78px 0;background:var(--cs-bg)}
.dispatch-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:24px;align-items:stretch}
.dispatch-news,.dispatch-updates{
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  padding:22px;
}
.dispatch-title{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}
.dispatch-title h3{margin:0;color:var(--cs-ink);font-size:22px;letter-spacing:0}
.dispatch-card{
  display:grid;
  grid-template-columns:174px 1fr;
  gap:16px;
  padding:16px 0;
  border-top:1px solid var(--cs-line);
}
.dispatch-thumb{
  display:block;
  aspect-ratio:11/7;
  border-radius:8px;
  overflow:hidden;
  background:#d9dee7;
}
.dispatch-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.dispatch-card span{display:block;margin-bottom:6px;color:var(--cs-muted);font-size:12px}
.dispatch-card h4,.update-row h4{margin:0 0 7px;font-size:17px;line-height:1.42;letter-spacing:0}
.dispatch-card h4 a,.update-row h4 a{color:var(--cs-ink);text-decoration:none}
.dispatch-card h4 a:hover,.update-row h4 a:hover{color:var(--cs-coral)}
.dispatch-card p,.update-row p{margin:0;color:var(--cs-muted);line-height:1.65}
.update-row{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:16px;
  padding:17px 0;
  border-top:1px solid var(--cs-line);
}
.update-row time{font-weight:800;color:var(--cs-coral)}

.help-desk-section{padding:78px 0;background:#fff}
.help-list{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.help-item{
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  padding:22px;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.help-item:hover{transform:translateY(-3px);box-shadow:var(--cs-shadow);border-color:rgba(255,115,92,.42)}
.help-item h3{margin:0 0 10px;color:var(--cs-ink);font-size:18px;line-height:1.42;letter-spacing:0}
.help-item p{margin:0 0 16px;color:var(--cs-muted);line-height:1.7}

@media (max-width:1180px){
  .home-hero__inner{grid-template-columns:1fr;gap:34px}
  .home-hero::before{background:linear-gradient(105deg,rgba(17,24,39,.98),rgba(17,24,39,.9))}
  .studio-player{max-width:720px}
  .shelf-layout{grid-template-columns:1fr}
  .shelf-intro{position:relative;top:auto}
  .proof-board,.dispatch-grid{grid-template-columns:1fr}
  .customer-review-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:900px){
  .listen-path-layout,.shelf-grid,.help-list{grid-template-columns:repeat(2,1fr)}
  .path-side-note{grid-template-columns:1fr}
  .map-grid{grid-template-columns:1fr}
  .sound-lab-layout{grid-template-columns:1fr}
  .proof-metrics{grid-template-columns:repeat(2,1fr)}
  .section-header-flex{display:block;text-align:center}
}

@media (max-width:680px){
  .home-hero{padding:58px 0}
  .home-title{font-size:32px}
  .home-lead{font-size:16px}
  .home-actions{flex-direction:column}
  .home-actions .btn{width:100%;justify-content:center}
  .studio-player{padding:18px}
  .studio-player__top{align-items:flex-start;flex-direction:column}
  .studio-player__body{grid-template-columns:1fr}
  .studio-cover{min-height:156px}
  .studio-queue{grid-template-columns:1fr}
  .listen-path-layout,.shelf-grid,.help-list,.proof-metrics,.customer-review-grid{grid-template-columns:1fr}
  .dispatch-card{grid-template-columns:1fr}
  .update-row{grid-template-columns:1fr}
  .map-card{min-height:280px}
}

@media (max-width:420px){
  .home-title{font-size:28px}
  .section-title{font-size:24px}
  .proof-metrics strong{font-size:26px}
}

/* === Brand Single Pages === */

.single-hero{
  padding:70px 0 58px;
  background:linear-gradient(115deg,#101828 0%,#18243a 58%,#244458 100%);
}
.single-hero::before{display:none}
.single-hero .header-content{max-width:780px;margin:0 auto;text-align:center}
.single-hero .header-content h1{font-size:38px;line-height:1.22;letter-spacing:0;margin:12px 0 14px}
.single-hero .header-content p{max-width:720px;font-size:17px;line-height:1.85;color:rgba(255,255,255,.82)}
.single-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:32px;
  padding:6px 13px;
  border:1px solid rgba(141,244,231,.45);
  border-radius:999px;
  background:rgba(43,191,176,.14);
  color:#8df4e7;
  font-size:13px;
  font-weight:800;
}

.single-page{
  background:#fff;
  padding:18px 0 72px;
}
.single-intro-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:24px;
  align-items:stretch;
  margin:26px 0 54px;
}
.single-copy-card,.single-side-card{
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  box-shadow:0 16px 40px rgba(16,24,40,.06);
}
.single-copy-card{padding:30px}
.single-label{
  display:inline-block;
  margin-bottom:12px;
  color:var(--cs-coral);
  font-size:13px;
  font-weight:800;
}
.single-copy-card h2{
  margin:0 0 16px;
  color:var(--cs-ink);
  font-size:28px;
  line-height:1.34;
  letter-spacing:0;
}
.single-copy-card p,.single-essay p{
  margin:0 0 16px;
  color:#475467;
  font-size:16px;
  line-height:1.95;
}
.single-side-card{
  padding:24px;
  background:#101828;
  color:#fff;
}
.single-side-card h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
  color:#fff;
  font-size:20px;
  line-height:1.35;
  letter-spacing:0;
}
.single-side-card h3 i{color:var(--cs-yellow)}
.rank-list{
  display:grid;
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}
.rank-list li{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:12px;
  align-items:start;
  padding:12px;
  border-radius:8px;
  background:rgba(255,255,255,.07);
}
.rank-list b{color:var(--cs-yellow)}
.rank-list span{color:rgba(255,255,255,.78);line-height:1.65}

.icon-grid-section{margin:0 0 58px}
.single-icon-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}
.single-icon-grid article{
  min-height:196px;
  padding:22px;
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.single-icon-grid article:hover{
  transform:translateY(-3px);
  box-shadow:var(--cs-shadow);
  border-color:rgba(43,191,176,.45);
}
.single-icon-grid i{
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  border-radius:8px;
  background:#effaf8;
  color:var(--cs-teal);
  font-size:22px;
}
.single-icon-grid article:nth-child(2n) i{background:#fff7df;color:#b88100}
.single-icon-grid article:nth-child(3n) i{background:#fff0ed;color:var(--cs-coral)}
.single-icon-grid h3{
  margin:0 0 9px;
  color:var(--cs-ink);
  font-size:18px;
  line-height:1.35;
  letter-spacing:0;
}
.single-icon-grid p{
  margin:0;
  color:var(--cs-muted);
  line-height:1.7;
  font-size:14px;
}

.process-section{
  margin:0 0 58px;
  padding:30px;
  border-radius:8px;
  background:var(--cs-bg);
  border:1px solid var(--cs-line);
}
.process-head{
  display:grid;
  grid-template-columns:170px 1fr;
  gap:12px 26px;
  align-items:start;
  margin-bottom:24px;
}
.process-head span{
  color:var(--cs-coral);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
}
.process-head h2{
  margin:0;
  color:var(--cs-ink);
  font-size:28px;
  line-height:1.25;
  letter-spacing:0;
}
.process-head p{
  grid-column:2;
  margin:0;
  color:var(--cs-muted);
  line-height:1.75;
}
.process-rail{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:12px;
}
.process-rail article,.flow-columns article{
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  padding:18px;
}
.process-rail b{
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  margin-bottom:14px;
  border-radius:50%;
  background:var(--cs-ink);
  color:#fff;
}
.process-rail h3,.flow-columns h3{
  margin:0 0 8px;
  color:var(--cs-ink);
  font-size:17px;
  letter-spacing:0;
}
.process-rail p,.flow-columns p{
  margin:0;
  color:var(--cs-muted);
  line-height:1.7;
  font-size:14px;
}

.single-content-list{
  display:grid;
  gap:16px;
}
.single-list-card{
  display:grid;
  grid-template-columns:190px 1fr;
  gap:18px;
  padding:16px;
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
}
.single-list-thumb{
  display:block;
  aspect-ratio:4/3;
  border-radius:8px;
  overflow:hidden;
  background:#d9dee7;
}
.single-list-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.single-list-body h3{margin:0 0 8px;font-size:20px;line-height:1.38;letter-spacing:0}
.single-list-body h3 a{color:var(--cs-ink);text-decoration:none}
.single-list-body h3 a:hover{color:var(--cs-coral)}
.single-list-body p{margin:0 0 12px;color:var(--cs-muted);line-height:1.75}
.single-list-meta{display:flex;flex-wrap:wrap;gap:10px 16px;color:#667085;font-size:13px}
.single-list-meta a{color:#667085}
.single-list-meta i{color:var(--cs-coral)}
.curated-list-section{margin-bottom:58px}

.single-essay{
  max-width:980px;
  margin:0 auto;
  padding:30px;
  border-radius:8px;
  border:1px solid var(--cs-line);
  background:#fff;
  box-shadow:0 16px 40px rgba(16,24,40,.05);
}
.single-essay h2{
  margin:0 0 16px;
  color:var(--cs-ink);
  font-size:28px;
  line-height:1.3;
  letter-spacing:0;
}
.single-essay a{color:var(--cs-coral);font-weight:700}

.feature-score-card .score-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:44px;
  padding:10px 0;
  border-top:1px solid rgba(255,255,255,.12);
}
.feature-score-card .score-row span{color:rgba(255,255,255,.74)}
.feature-score-card .score-row b{color:var(--cs-yellow);font-size:20px}
.flow-columns{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.flow-columns i{
  color:var(--cs-coral);
  font-size:24px;
  margin-bottom:14px;
}

.download-landing{
  display:grid;
  grid-template-columns:300px 1fr;
  gap:34px;
  align-items:center;
  margin:26px 0 58px;
  padding:30px;
  border-radius:8px;
  background:#101828;
  color:#fff;
}
.download-phone{
  width:244px;
  min-height:420px;
  justify-self:center;
  border-radius:30px;
  background:#0b1220;
  border:8px solid #263449;
  padding:18px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
}
.phone-top{
  width:72px;
  height:6px;
  margin:0 auto 26px;
  border-radius:999px;
  background:#475467;
}
.phone-screen{
  min-height:330px;
  border-radius:18px;
  padding:28px 18px;
  background:linear-gradient(160deg,#162033,#2bbfb0);
}
.phone-screen span{font-size:13px;color:#8df4e7;font-weight:800}
.phone-screen h2{margin:20px 0 18px;color:#fff;font-size:26px;line-height:1.22;letter-spacing:0}
.phone-screen p{margin:18px 0 0;color:rgba(255,255,255,.78)}
.mini-wave{display:flex;align-items:end;gap:7px;height:84px}
.mini-wave i{flex:1;border-radius:6px 6px 0 0;background:var(--cs-yellow)}
.mini-wave i:nth-child(1){height:30%}.mini-wave i:nth-child(2){height:74%}.mini-wave i:nth-child(3){height:48%}.mini-wave i:nth-child(4){height:90%}.mini-wave i:nth-child(5){height:55%}.mini-wave i:nth-child(6){height:68%}
.download-copy h2{margin:0 0 14px;color:#fff;font-size:32px;line-height:1.28;letter-spacing:0}
.download-copy p{margin:0 0 22px;color:rgba(255,255,255,.78);line-height:1.9}
.download-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.download-actions .btn{border-radius:8px;min-height:46px;font-weight:800}
.download-actions .btn-primary{background:var(--cs-coral);color:#fff}
.download-actions .btn-ghost{border:1px solid rgba(141,244,231,.55);color:#8df4e7;background:rgba(141,244,231,.08)}
.download-badges{display:flex;flex-wrap:wrap;gap:10px}
.download-badges span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.82);
  font-size:13px;
}
.install-rail{grid-template-columns:repeat(4,1fr)}

.about-values div{
  display:grid;
  gap:3px;
  padding:14px 0;
  border-top:1px solid rgba(255,255,255,.12);
}
.about-values b{color:var(--cs-yellow);font-size:18px}
.about-values span{color:rgba(255,255,255,.76);line-height:1.6}
.about-rail{grid-template-columns:repeat(4,1fr)}

@media (max-width:1100px){
  .single-icon-grid{grid-template-columns:repeat(2,1fr)}
  .process-rail{grid-template-columns:repeat(3,1fr)}
  .flow-columns{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:860px){
  .single-hero .header-content h1{font-size:30px}
  .single-intro-grid,.download-landing{grid-template-columns:1fr}
  .single-side-card{order:2}
  .process-head{grid-template-columns:1fr}
  .process-head p{grid-column:auto}
  .single-list-card{grid-template-columns:1fr}
  .download-phone{width:230px}
}

@media (max-width:640px){
  .single-page{padding-bottom:48px}
  .single-copy-card,.single-side-card,.process-section,.single-essay,.download-landing{padding:20px}
  .single-copy-card h2,.process-head h2,.single-essay h2,.download-copy h2{font-size:24px}
  .single-icon-grid,.process-rail,.flow-columns,.install-rail,.about-rail{grid-template-columns:1fr}
  .single-icon-grid article{min-height:auto}
  .download-actions{flex-direction:column}
  .download-actions .btn{width:100%;justify-content:center}
}