/* stylesheet_sll_home.css — 首页海报(hero)  (生成物, 勿手改)
   生成器: 18a-admin/docs/prototype/home_v3/hf/extract_home_css.py
   文字内容不在这里, 在 includes/languages/english/extra_definitions/sll_home_hero.php
   .hero 只在首页出现, 所以本文件对其它页面是零开销。 */
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.wrap.narrow{max-width:960px}
.sllhf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:var(--rb);font-family:var(--f);font-size:15.5px;font-weight:600;border:1.5px solid transparent;cursor:pointer;transition:.15s}
.sllhf-btn:hover{transform:translateY(-1px);box-shadow:var(--sh)}
.sllhf-btn-p{background:var(--brand);color:#fff}
.sllhf-btn-p:hover{background:var(--brand-d)}
.sllhf-btn-g{background:rgba(255,255,255,.10);color:#fff;border-color:rgba(255,255,255,.4)}
.hero{position:relative;min-height:560px;display:flex;align-items:center;padding:56px 0;overflow:hidden;background:#101C26}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(9,17,26,.62) 0%,rgba(9,17,26,.28) 45%,rgba(9,17,26,.05) 70%)}
.hero-in{position:relative;z-index:2;display:grid;grid-template-columns:6.4fr 5.6fr;gap:40px;align-items:center}
.glass{background:rgba(13,27,42,.40);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:32px 34px}
@supports not (backdrop-filter:blur(2px)){
  .glass{background:rgba(10,20,32,.86)}
}
.hero h1{color:#fff;font-size:40px;font-weight:800;line-height:1.1;letter-spacing:-.03em;margin-bottom:16px;text-shadow:0 2px 16px rgba(0,0,0,.5)}
.hero h1 .g{color:#8FD0FF}
.hero .lead{font-size:16.5px;color:#D4DDE6;margin:0 0 20px;max-width:600px;text-shadow:0 1px 6px rgba(0,0,0,.55)}
.hero .lead b{color:#fff;font-weight:600}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.ticks{display:flex;gap:18px;flex-wrap:wrap;font-size:14px;color:#E6EDF5;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.plan{background:rgba(255,255,255,.68);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border:1px solid rgba(255,255,255,.55);border-radius:16px;box-shadow:0 18px 50px rgba(0,0,0,.35);padding:22px 24px}
.plan .sllhf-k{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brand)}
.plan h2{font-size:22px;font-weight:700;margin:6px 0 4px}
.plan p{font-size:13.5px;color:var(--ink2);margin:0 0 14px}
.scenes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.scenes a{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:8px 6px;border:1.5px solid var(--line);border-radius:10px;font-size:13.5px;font-weight:600;color:var(--ink);transition:.15s;line-height:1.25}
.scenes a:hover{border-color:var(--brand);color:var(--brand);background:var(--brand-l)}
.plan .sllhf-note{margin:12px 0 0;font-size:12.5px;color:var(--ink3)}
.plan .sllhf-note a{color:var(--blue);font-weight:600}
@media(max-width:992px){
  .hero-in{grid-template-columns:1fr}
  .hero{padding:40px 0;min-height:0}
  .hero h1{font-size:32px}
}
@media(max-width:600px){
  .wrap{padding:0 16px}
  .scenes{grid-template-columns:repeat(2,1fr)}
  .hero h1{font-size:27px}
  .hero-cta .sllhf-btn{width:100%}
}

/* ===== 接入老站的适配层 ===== */
.hero,.hero *{box-sizing:border-box}
/* 海报全屏通栏。
   ★别用 width:100vw + 负 margin 那套★ —— 100vw【含滚动条】而可视区不含,
   实测左右各溢出 7px 被 html{overflow-x:clip} 悄悄裁掉。
   .hero 的父级 .main_bg 本来就没有宽度限制(定宽的是里面的 .w1020/.mainWrapper),
   所以 section 作为 block 元素默认就是全宽, 什么都不用写。 */
.hero{width:auto;max-width:none;margin-left:0;margin-right:0}

/* ☠★ 老表 stylesheet.css 里 h1{font:26px/45px Oswald} / h2{font:bold 1.473em tahoma}
      是【font 简写】—— 简写里带 font-family, 而草稿的 .hero h1 只写了 size/weight/line-height,
      没写 font-family -> 标题的字体被老表接管成 Oswald(站上没加载, 退化成默认衬线体),
      业务反馈「这里H1字体和设计稿也不一样」就是这个。
      ★字号/行高/字重轮不到老表★(.hero h1 是 0,1,1 压得住 h1 的 0,0,1), 唯独 font-family 是空的。
      同族见 CLAUDE.md §6.27「反向版: 老表的裸标签砸新组件」。 */
.hero h1,.hero h2,.hero h3,.hero h4{font-family:var(--f,'Radio Canada Big','Open Sans',Arial,sans-serif)}

