@charset "utf-8";
/* ==========================================================================
   囧次元 · jcydmgw.com.cn
   视觉方向 B8「热血国漫」：正红底 + 明黄 / 玄墨
   渲染语言「刻度尺与速度折带」第 36 种
   ========================================================================== */

:root{
  --red:#C4151B;
  --red-d:#9A0E16;
  --ink:#16110D;
  --ink-2:#221A14;
  --gold:#FFD233;
  --gold-d:#E0A800;
  --gold-l:#FFE793;
  --cyan:#34D2C4;
  --bone:#FFF8EC;
  --bone-d:rgba(255,248,236,.80);
  --bone-m:rgba(255,248,236,.62);
  --line:rgba(255,210,51,.30);
  --line-s:rgba(255,210,51,.16);
  --font:'Microsoft YaHei','PingFang SC','Hiragino Sans GB','Source Han Sans SC',
         'Noto Sans CJK SC',sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  font-family:var(--font);
  font-size:16px;
  line-height:1.78;
  color:var(--bone);
  background-color:var(--red);
  background-image:linear-gradient(168deg,#C4151B 0%,#AE1119 44%,#8C0C13 100%);
  background-attachment:fixed;
}

img{display:block;width:100%;height:auto;max-width:100%}

a{color:var(--gold);text-decoration:none}
a:hover{color:var(--gold-l)}

h1,h2,h3,h4{margin:0;line-height:1.28;font-weight:800;letter-spacing:.2px}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
table{border-collapse:collapse;width:100%}
button{font-family:inherit;font-size:inherit}

/* ---------- 容器：左右内边距一律长写 ---------- */
.wrap{
  width:100%;
  max-width:1140px;
  margin-left:auto;
  margin-right:auto;
  padding-left:22px;
  padding-right:22px;
}

/* ---------- 顶栏 ---------- */
.top{
  position:sticky;
  top:0;
  z-index:60;
  background:var(--ink);
  border-bottom:1px solid var(--line-s);
}
.top__in{
  display:flex;
  align-items:center;
  gap:16px;
  padding-top:10px;
  padding-bottom:10px;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  color:var(--bone);
}
.brand:hover{color:var(--bone)}
.brand img{width:44px;height:44px;flex:0 0 auto}
.brand b{font-size:20px;font-weight:800;letter-spacing:1px}
.brand span{display:block;font-size:11px;line-height:1.4;color:var(--bone-m);letter-spacing:.6px}
.nav{
  display:flex;
  flex:1 1 auto;
  justify-content:center;
  gap:4px;
}
.nav a{
  display:block;
  padding:8px 14px;
  border-radius:2px;
  border-bottom:2px solid transparent;
  color:var(--bone-d);
  font-size:15px;
}
.nav a:hover{color:var(--gold);background:rgba(255,210,51,.10)}
.nav a[aria-current="page"]{
  color:var(--gold);
  border-bottom-color:var(--gold);
  background:rgba(255,210,51,.10);
}
.top__cta{flex:0 0 auto}
.burger{
  display:none;
  flex:0 0 auto;
  padding:9px 14px;
  background:transparent;
  color:var(--gold);
  border:1px solid var(--line);
  border-radius:2px;
  cursor:pointer;
}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-block;
  padding:13px 30px;
  font-size:16px;
  font-weight:800;
  letter-spacing:1px;
  color:#16110D;
  background:linear-gradient(135deg,#FFD233 0%,#F2B90F 52%,#E0A800 100%);
  border-radius:2px;
  clip-path:polygon(11px 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%,0 11px);
  transition:transform .16s ease;
}
.btn:hover{color:#16110D;transform:translate(-1px,-1px)}
.top .btn,.aside__box .btn,.foot .btn{color:#16110D}
.top .btn:hover,.aside__box .btn:hover,.foot .btn:hover{color:#16110D}
.btn--wide{padding:15px 46px}

/* ---------- 区块通用 ---------- */
.sec{padding-top:64px;padding-bottom:64px}
.sec--ink{
  background:var(--ink);
  border-top:1px solid var(--line-s);
  border-bottom:1px solid var(--line-s);
}
.sec--deep{
  background:#100C09;
  border-top:1px solid var(--line-s);
  border-bottom:1px solid var(--line-s);
}
.sec--tight{padding-top:44px;padding-bottom:44px}

/* 区块之间的玄墨折角带 */
.chev{
  height:12px;
  background-image:
    linear-gradient(135deg,var(--ink) 25%,rgba(22,17,13,0) 25%),
    linear-gradient(225deg,var(--ink) 25%,rgba(22,17,13,0) 25%);
  background-size:26px 12px,26px 12px;
  background-repeat:repeat-x,repeat-x;
}

.kicker{
  display:inline-block;
  margin-bottom:8px;
  padding-left:12px;
  border-left:3px solid var(--gold);
  font-size:12.5px;
  letter-spacing:2px;
  color:var(--gold);
}
.h2{
  position:relative;
  padding-left:44px;
  font-size:28px;
  color:var(--bone);
}
/* 斜切平行四边形明黄徽记，内含两条玄墨短斜杠 */
.h2::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  width:30px;
  height:30px;
  background-image:
    linear-gradient(135deg,rgba(0,0,0,0) 0 30%,#16110D 30% 44%,rgba(0,0,0,0) 44% 58%,#16110D 58% 72%,rgba(0,0,0,0) 72% 100%),
    linear-gradient(135deg,#FFD233,#E0A800);
  transform:skewX(-12deg);
}
/* H2 下方由左向右渐隐的明黄速度线组 */
.h2::after{
  content:"";
  display:block;
  width:164px;
  height:10px;
  margin-top:11px;
  background-image:repeating-linear-gradient(180deg,var(--gold) 0 2px,rgba(255,210,51,0) 2px 5px);
  -webkit-mask-image:linear-gradient(90deg,#000 0 56%,rgba(0,0,0,0) 94%);
  mask-image:linear-gradient(90deg,#000 0 56%,rgba(0,0,0,0) 94%);
}
.sub{margin-top:14px;max-width:860px;font-size:15.5px;color:var(--bone-d)}

.bd p{margin-top:14px;color:var(--bone-d)}
.bd p:first-child{margin-top:0}
.bd b{color:var(--gold)}
.bd ul{margin-top:14px}
.bd li{
  position:relative;
  margin-top:9px;
  padding-left:20px;
  color:var(--bone-d);
  font-size:15px;
}
.bd li::before{
  content:"";
  position:absolute;
  left:0;
  top:11px;
  width:9px;
  height:9px;
  background:var(--gold);
  transform:skewX(-12deg);
}
.hl{
  background:linear-gradient(180deg,rgba(255,210,51,0) 56%,rgba(255,210,51,.28) 56%);
  font-weight:700;
  color:var(--bone);
}

/* ---------- Hero ---------- */
.hero{
  position:relative;
  overflow:hidden;
  background-image:linear-gradient(168deg,#C4151B 0%,#B01219 40%,#8C0C13 100%);
}
/* 右下墨黑斜切大三角 */
.hero::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:60%;
  height:56%;
  background:var(--ink);
  opacity:.88;
  clip-path:polygon(100% 0,100% 100%,0 100%);
  z-index:0;
  pointer-events:none;
}
/* 左上明黄对角速度线群，向右下渐隐 */
.hero::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:54%;
  height:280px;
  background-image:repeating-linear-gradient(115deg,rgba(255,210,51,.26) 0 4px,rgba(255,210,51,0) 4px 23px);
  -webkit-mask-image:linear-gradient(163deg,#000 0 36%,rgba(0,0,0,0) 84%);
  mask-image:linear-gradient(163deg,#000 0 36%,rgba(0,0,0,0) 84%);
  z-index:0;
  pointer-events:none;
}
.hero__in{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:44px;
  padding-top:56px;
  padding-bottom:58px;
}
.hero__copy{flex:1 1 auto;min-width:0}
.hero h1{
  font-size:44px;
  letter-spacing:1px;
  color:#FFFDF6;
  text-shadow:3px 3px 0 rgba(22,17,13,.44);
}
.hero__lead{
  margin-top:16px;
  max-width:580px;
  font-size:16.5px;
  color:rgba(255,248,236,.93);
}
.hero__cta{margin-top:26px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hero__note{margin-top:14px;font-size:13.5px;letter-spacing:.4px;color:rgba(255,248,236,.74)}
.hero__shot{flex:0 0 320px;width:320px;max-width:320px;margin:0}
.hero__shot img{
  width:100%;
  max-width:320px;
  margin-left:auto;
  margin-right:auto;
  border-radius:3px;
  box-shadow:0 0 0 5px #FFF8EC,0 20px 40px rgba(20,2,4,.55);
}
.hero__shot figcaption{
  margin-top:16px;
  text-align:center;
  font-size:13px;
  letter-spacing:.4px;
  color:rgba(255,248,236,.80);
}

/* ---------- 四格资源数据条 ---------- */
.data4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:34px}
.data4__i{
  position:relative;
  padding:26px 20px 22px;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
  overflow:hidden;
}
.data4__i::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:7px;
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 3px,rgba(255,210,51,.22) 3px 12px);
}
.data4__i::after{
  content:"";
  position:absolute;
  right:0;top:0;
  width:22px;height:22px;
  background:var(--gold);
  clip-path:polygon(100% 0,0 0,100% 100%);
}
.data4__k{display:block;font-size:19px;font-weight:800;color:var(--gold)}
.data4__v{display:block;margin-top:4px;font-size:12.5px;letter-spacing:1.4px;color:rgba(255,210,51,.74)}
.data4__i p{margin-top:12px;font-size:14.5px;line-height:1.72;color:var(--bone-d)}

/* ---------- 数据表 ---------- */
.tbl-cap{margin-top:30px;font-size:13.5px;line-height:1.7;color:var(--bone-m)}
.tbl-cap+.tblwrap{margin-top:10px}
.tblwrap{
  margin-top:32px;
  overflow-x:auto;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
}
table.dt{min-width:660px;font-size:14.5px}
table.dt th,table.dt td{
  padding:14px 18px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line-s);
}
table.dt thead th{
  background:var(--ink-2);
  color:var(--gold);
  font-size:13.5px;
  letter-spacing:1.2px;
  white-space:nowrap;
}
table.dt tbody th{width:22%;color:var(--bone);font-weight:700;background:rgba(255,210,51,.05)}
table.dt td{color:var(--bone-d)}
table.dt tr:last-child th,table.dt tr:last-child td{border-bottom:0}
table.dt td b{color:var(--gold)}

/* ---------- 八格题材矩阵 ---------- */
.matrix{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:32px}
.matrix__i{
  padding:20px 18px;
  background:linear-gradient(170deg,rgba(255,210,51,.10),rgba(255,210,51,.02));
  border:1px solid var(--line-s);
  border-left:3px solid var(--gold);
  border-radius:2px;
}
.matrix__i b{display:block;font-size:17px;color:var(--bone)}
.matrix__i p{margin-top:8px;font-size:14px;line-height:1.7;color:var(--bone-d)}
.matrix__i span{display:block;margin-top:10px;font-size:12.5px;letter-spacing:.6px;color:rgba(255,210,51,.82)}

/* ---------- 三格卡 ---------- */
.three{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.card{
  position:relative;
  padding:28px 22px 24px;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
}
.card::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:7px;
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 3px,rgba(255,210,51,.22) 3px 12px);
}
.card h3{font-size:19px;color:var(--gold)}
.card p{margin-top:12px;font-size:14.5px;line-height:1.74;color:var(--bone-d)}
.card__tag{
  display:inline-block;
  margin-top:14px;
  padding:3px 10px;
  font-size:12px;
  letter-spacing:1px;
  color:var(--ink);
  background:var(--gold);
  border-radius:2px;
}

/* ---------- 双栏图文 ---------- */
.two{display:flex;align-items:flex-start;gap:36px;margin-top:32px}
.two__txt{flex:1 1 auto;min-width:0}
.two__fig{flex:0 0 auto;width:236px;margin:0}
.two__fig img{
  width:100%;
  border-radius:3px;
  box-shadow:0 0 0 4px rgba(255,248,236,.92),0 16px 32px rgba(20,2,4,.44);
}
.two__fig figcaption{margin-top:12px;font-size:12.5px;line-height:1.66;color:var(--bone-m)}
.two--flip .two__fig{order:-1}

/* ---------- 截图画廊：按比例分行，行内等宽等高 ---------- */
.shots{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.shots--r1{margin-top:32px}
.shots--r2{margin-top:18px}
.shots figure{margin:0}
.shots img{
  width:100%;
  border-radius:3px;
  box-shadow:0 0 0 4px rgba(255,248,236,.92),0 14px 26px rgba(20,2,4,.42);
}
.shots figcaption{margin-top:10px;font-size:12.5px;letter-spacing:.3px;color:var(--bone-m);text-align:center}

/* ---------- 更新节奏表 ---------- */
table.pace{
  margin-top:30px;
  font-size:14.5px;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
}
table.pace th,table.pace td{
  padding:13px 16px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line-s);
}
table.pace thead th{background:var(--ink-2);color:var(--gold);font-size:13px;letter-spacing:1.2px}
table.pace tbody th{width:24%;color:var(--bone);font-weight:700}
table.pace td{color:var(--bone-d)}
table.pace tr:last-child th,table.pace tr:last-child td{border-bottom:0}
.pace__bar{
  display:block;
  height:7px;
  margin-top:9px;
  border-radius:2px;
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 4px,rgba(255,210,51,.20) 4px 9px);
}

/* ---------- 评价 ---------- */
.voice{
  position:relative;
  padding:26px 22px 22px;
  background:var(--ink);
  border:1px solid var(--line);
  border-top:3px solid var(--gold);
  border-radius:2px;
}
.voice__who{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
  color:var(--bone-m);
}
.voice__stars{display:flex;gap:3px}
.voice__stars i{
  width:11px;
  height:11px;
  background:var(--cyan);
  clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
.voice p{margin-top:14px;font-size:15px;line-height:1.78;color:var(--bone-d)}
.voice b{color:var(--gold)}

/* ---------- 入口卡 ---------- */
.entries{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.entry{
  display:block;
  padding:26px 22px 24px;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
  color:var(--bone);
}
.entry:hover{color:var(--bone);border-color:var(--gold)}
.entry em{display:block;font-style:normal;font-size:12px;letter-spacing:2px;color:var(--cyan)}
.entry b{display:block;margin-top:8px;font-size:19px;color:var(--gold)}
.entry p{margin-top:10px;font-size:14.5px;color:var(--bone-d)}
.entry span{display:block;margin-top:16px;font-size:13.5px;letter-spacing:.5px;color:var(--gold)}

/* ---------- FAQ ---------- */
.faq{margin-top:30px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.faq details{
  background:var(--ink);
  border:1px solid var(--line-s);
  border-left:3px solid var(--gold-d);
  border-radius:2px;
}
.faq details[open]{background:var(--ink-2);border-left-color:var(--gold)}
.faq summary{
  padding:16px 18px;
  font-size:15.5px;
  font-weight:700;
  color:var(--bone);
  cursor:pointer;
  list-style:none;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--gold);font-weight:800}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 18px 18px;font-size:14.5px;line-height:1.76;color:var(--bone-d)}

/* ---------- 正文 + 侧栏 双列 ---------- */
.cols{display:flex;gap:34px;align-items:flex-start}
.cols__main{flex:1 1 auto;min-width:0}
.cols__side{flex:0 0 292px}

/* ---------- 内页头部 ---------- */
.page{background:var(--ink);border-bottom:1px solid var(--line-s)}
.page__in{padding-top:34px;padding-bottom:36px}
.crumb{font-size:13px;letter-spacing:.4px;color:var(--bone-m)}
.crumb a{color:var(--bone-m)}
.crumb a:hover{color:var(--gold)}
.page h1{margin-top:14px;font-size:34px;color:var(--bone)}
.page__lead{margin-top:14px;max-width:900px;font-size:16px;color:var(--bone-d)}
.page__tags{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px}
.page__tags span{
  padding:4px 11px;
  font-size:12.5px;
  letter-spacing:.6px;
  color:var(--gold);
  border:1px solid var(--line);
  border-radius:2px;
}

/* ---------- 侧栏 ---------- */
.aside__box{
  position:relative;
  padding:28px 24px 24px;
  background:var(--ink);
  border:1px solid var(--line);
  border-radius:2px;
}
.aside__box::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:7px;
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 3px,rgba(255,210,51,.22) 3px 12px);
}
.aside__box h3{font-size:18px;color:var(--gold)}
.aside__box ul{margin-top:14px}
.aside__box li{
  padding:10px 0;
  border-bottom:1px solid var(--line-s);
  font-size:14.5px;
  color:var(--bone-d);
}
.aside__box li:last-child{border-bottom:0}
.aside__box li a{color:var(--bone)}
.aside__box li a:hover{color:var(--gold)}
.aside__box .btn{margin-top:18px}
.aside__fig{width:100%;margin:20px 0 0}
.aside__fig img{
  width:100%;
  border-radius:3px;
  box-shadow:0 0 0 4px rgba(255,248,236,.92),0 14px 26px rgba(20,2,4,.42);
}
.aside__fig figcaption{margin-top:10px;font-size:12.5px;line-height:1.64;color:var(--bone-m)}

/* ---------- 通栏 CTA ---------- */
.cta{background:var(--ink);border-top:4px solid var(--gold);border-bottom:4px solid var(--gold)}
.cta__in{padding-top:52px;padding-bottom:52px;text-align:center}
.cta__in .h2{display:inline-block;padding-left:0;text-align:left}
.cta__in .h2::before{position:static;display:inline-block;margin-right:12px;vertical-align:-6px}
.cta__in .h2::after{margin-left:auto;margin-right:auto}
.cta__in .sub{margin-left:auto;margin-right:auto;text-align:center}
.cta__btns{margin-top:28px;display:flex;justify-content:center;gap:16px;flex-wrap:wrap}

/* ---------- 页脚 ---------- */
.foot{background:#100C09;border-top:1px solid var(--line-s)}
.foot__in{padding-top:42px;padding-bottom:34px}
.foot__top{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.foot__top img{width:40px;height:40px;flex:0 0 auto}
.foot__top b{font-size:18px;letter-spacing:1px;color:var(--bone)}
.foot__top em{font-style:normal;font-size:13px;color:var(--bone-m)}
.foot__nav{margin-top:20px;display:flex;flex-wrap:wrap;gap:8px 22px}
.foot__nav a{font-size:14.5px;color:var(--bone-d)}
.foot__nav a:hover{color:var(--gold)}
.foot__note{
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid var(--line-s);
  font-size:13.5px;
  line-height:1.8;
  color:var(--bone-m);
}
.foot__cr{margin-top:12px;font-size:13px;letter-spacing:.4px;color:rgba(255,248,236,.48)}

/* ---------- 入场动效：只改位移，绝不动透明度 ---------- */
@keyframes dashIn{
  from{transform:translateX(-12px)}
  to{transform:none}
}
.fx{will-change:transform}
.fx[data-in]{animation:dashIn .52s cubic-bezier(.22,.72,.28,1) both}
.fx.d2[data-in]{animation-delay:.09s}

/* ---------- 断点 ≤980 ---------- */
@media (max-width:980px){
  .top__in{flex-wrap:wrap;gap:8px;padding-top:9px;padding-bottom:9px}
  .brand{order:1}
  .top__cta{order:2;margin-left:auto}
  .burger{order:3;display:block}
  .nav{
    order:4;
    flex:1 1 100%;
    display:none;
    flex-direction:column;
    gap:0;
    margin-top:8px;
    border-top:1px solid var(--line-s);
  }
  .burger[aria-expanded="true"]+.nav{display:flex}
  .nav a{padding:12px 4px;border-bottom:1px solid var(--line-s);border-left:0}
  .nav a[aria-current="page"]{border-bottom-color:var(--line-s);border-left:3px solid var(--gold)}

  .hero__in{flex-direction:column;gap:34px;padding-top:40px;padding-bottom:44px}
  .hero::after{width:100%;height:44%}
  .hero::before{width:84%;height:230px}
  .hero h1{font-size:33px}
  .hero__lead{font-size:15.5px}
  .hero__shot{flex:0 0 auto;width:100%;max-width:300px;margin-left:auto;margin-right:auto}
  .hero__shot img{max-width:300px}

  .data4{grid-template-columns:repeat(2,1fr)}
  .matrix{grid-template-columns:repeat(2,1fr)}
  .three{grid-template-columns:1fr}
  .entries{grid-template-columns:1fr}
  .faq{grid-template-columns:1fr}
  .two{flex-direction:column;gap:24px}
  .two__fig{width:100%;max-width:300px;margin-left:auto;margin-right:auto}
  .two--flip .two__fig{order:2}
  .shots{gap:12px}
  .h2{font-size:24px;padding-left:40px}
  .page h1{font-size:28px}
  .aside__fig{max-width:300px;margin-left:auto;margin-right:auto}
  .cols{flex-direction:column;gap:26px}
  .cols__side{flex:1 1 auto;width:100%;max-width:340px;margin-left:auto;margin-right:auto}
}

/* ---------- 断点 ≤620 ---------- */
@media (max-width:620px){
  body{font-size:15px}
  .wrap{padding-left:16px;padding-right:16px}
  .sec{padding-top:44px;padding-bottom:44px}
  .sec--tight{padding-top:34px;padding-bottom:34px}

  .brand img{width:36px;height:36px}
  .brand b{font-size:17px}
  .brand span{display:none}
  .top__cta{padding:10px 16px;font-size:14px}
  .burger{padding:7px 11px;font-size:13px}

  .hero__in{padding-top:30px;padding-bottom:34px;gap:26px}
  .hero h1{font-size:26px;text-shadow:2px 2px 0 rgba(22,17,13,.44)}
  .hero__lead{font-size:14.5px}
  .hero__shot{max-width:234px}
  .hero__shot img{max-width:234px;box-shadow:0 0 0 4px #FFF8EC,0 14px 26px rgba(20,2,4,.5)}
  .hero::before{width:100%;height:190px}

  .data4{grid-template-columns:1fr}
  .matrix{grid-template-columns:1fr}
  .h2{font-size:21px;padding-left:36px}
  .h2::before{width:24px;height:24px;top:4px}
  .shots{grid-template-columns:repeat(2,1fr);gap:10px}
  .page h1{font-size:24px}
  .page__in{padding-top:26px;padding-bottom:28px}
  .btn{padding:12px 22px;font-size:15px}
  .btn--wide{padding:14px 30px}
  table.dt{min-width:520px}
  table.dt th,table.dt td{padding:12px 14px}
  table.pace th,table.pace td{padding:12px 13px}
  .two__fig{max-width:234px}
  .aside__fig{max-width:234px}
}