:root{
  --brand-primary:#2b3a67;
  --brand-primary-deep:#1d2a4d;
  --brand-accent:#f2c14e;
  --brand-coral:#e8745b;
  --brand-gradient:linear-gradient(135deg,#2b3a67 0%,#3f5a9e 45%,#e8745b 100%);
  --brand-gradient-soft:linear-gradient(135deg,rgba(43,58,103,.92),rgba(63,90,158,.85) 50%,rgba(232,116,91,.82));
  --bg-page:#f4f6fb;
  --bg-elevated:#ffffff;
  --bg-soft:#eef1f8;
  --bg-glass:rgba(255,255,255,.62);
  --bg-glass-strong:rgba(255,255,255,.82);
  --text-main:#1c2333;
  --text-sub:#4a5570;
  --text-muted:#7a839c;
  --text-invert:#f7f9ff;
  --border-soft:rgba(43,58,103,.12);
  --border-strong:rgba(43,58,103,.22);
  --shadow-sm:0 2px 8px rgba(28,35,51,.06);
  --shadow-md:0 10px 28px rgba(28,35,51,.10);
  --shadow-lg:0 22px 54px rgba(28,35,51,.16);
  --shadow-glow:0 12px 34px rgba(63,90,158,.28);
  --radius-sm:10px;
  --radius-md:16px;
  --radius-lg:24px;
  --radius-pill:999px;
  --header-h:72px;
  --maxw:1200px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:.32s;
}

html[data-theme="dark"]{
  --brand-primary:#7f9dff;
  --brand-primary-deep:#0e1526;
  --brand-accent:#ffd166;
  --brand-coral:#ff8a70;
  --brand-gradient:linear-gradient(135deg,#0e1526 0%,#22305c 45%,#7a3a2e 100%);
  --brand-gradient-soft:linear-gradient(135deg,rgba(14,21,38,.94),rgba(34,48,92,.88) 50%,rgba(122,58,46,.82));
  --bg-page:#0b0f1a;
  --bg-elevated:#141a29;
  --bg-soft:#1a2133;
  --bg-glass:rgba(24,31,48,.62);
  --bg-glass-strong:rgba(24,31,48,.86);
  --text-main:#e8ecf7;
  --text-sub:#b3bcd4;
  --text-muted:#8590ab;
  --text-invert:#0b0f1a;
  --border-soft:rgba(160,180,230,.14);
  --border-strong:rgba(160,180,230,.28);
  --shadow-sm:0 2px 8px rgba(0,0,0,.4);
  --shadow-md:0 10px 28px rgba(0,0,0,.5);
  --shadow-lg:0 22px 54px rgba(0,0,0,.6);
  --shadow-glow:0 12px 34px rgba(127,157,255,.28);
}

*,*::before,*::after{box-sizing:border-box;}

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  scroll-padding-top:calc(var(--header-h) + 16px);
}

body{
  margin:0;
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:16px;
  line-height:1.75;
  color:var(--text-main);
  background:var(--bg-page);
  background-image:
    radial-gradient(1100px 520px at 8% -8%,rgba(63,90,158,.16),transparent 62%),
    radial-gradient(900px 460px at 96% 4%,rgba(232,116,91,.14),transparent 60%),
    radial-gradient(760px 420px at 50% 108%,rgba(242,193,78,.12),transparent 64%);
  background-attachment:fixed;
  overflow-x:hidden;
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease);
}

img,svg{max-width:100%;display:block;}
a{color:var(--brand-primary);text-decoration:none;transition:color var(--dur) var(--ease),opacity var(--dur) var(--ease);}
a:hover{color:var(--brand-coral);}
ul,ol{padding-left:1.35em;margin:.6em 0;}
li{margin:.35em 0;}
h1,h2,h3,h4{line-height:1.35;color:var(--text-main);margin:1.1em 0 .55em;font-weight:800;letter-spacing:.2px;}
h1{font-size:clamp(1.6rem,3.4vw,2.5rem);}
h2{font-size:clamp(1.35rem,2.6vw,1.95rem);}
h3{font-size:clamp(1.08rem,1.8vw,1.32rem);}
p{margin:.75em 0;color:var(--text-sub);}
blockquote{margin:1em 0;padding:1em 1.25em;border-left:4px solid var(--brand-accent);background:var(--bg-glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:0 var(--radius-md) var(--radius-md) 0;box-shadow:var(--shadow-sm);}
blockquote p{margin:.35em 0;color:var(--text-main);}
blockquote cite{display:block;margin-top:.5em;font-style:normal;font-size:.9rem;color:var(--text-muted);}
::selection{background:var(--brand-accent);color:#1c2333;}

.visually-hidden,.visually-hidden:focus:not(:active){
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

main{display:block;max-width:var(--maxw);margin:0 auto;padding:0 20px 64px;}

section{
  position:relative;
  margin:28px 0;
  padding:clamp(20px,3.4vw,40px);
  background:var(--bg-glass);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-md);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease),background-color var(--dur) var(--ease);
  opacity:0;
  transform:translateY(26px);
}
section.is-visible{opacity:1;transform:translateY(0);}
section:hover{border-color:var(--border-strong);box-shadow:var(--shadow-lg);}

#site-header{
  position:sticky;
  top:0;
  z-index:120;
  background:var(--bg-glass-strong);
  backdrop-filter:blur(18px) saturate(160%);
  -webkit-backdrop-filter:blur(18px) saturate(160%);
  border-bottom:1px solid var(--border-soft);
  transition:box-shadow var(--dur) var(--ease),background-color var(--dur) var(--ease);
}
#site-header.is-scrolled{box-shadow:var(--shadow-md);}
.header-inner{
  max-width:var(--maxw);
  margin:0 auto;
  padding:10px 20px;
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap;
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--text-main);
  font-weight:800;
  flex-shrink:0;
}
.brand:hover{color:var(--text-main);}
.brand-logo{flex-shrink:0;border-radius:12px;box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease);}
.brand:hover .brand-logo{transform:rotate(-6deg) scale(1.06);}
.brand-name{font-size:1.12rem;letter-spacing:.5px;}
.brand-sub{
  font-size:.72rem;
  font-weight:600;
  color:var(--text-muted);
  padding:2px 9px;
  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);
  background:var(--bg-soft);
  white-space:nowrap;
}

#main-nav{margin-left:auto;}
#main-nav ul{
  list-style:none;
  display:flex;
  align-items:center;
  gap:4px;
  margin:0;
  padding:0;
  flex-wrap:wrap;
}
#main-nav a{
  display:inline-block;
  padding:8px 12px;
  font-size:.92rem;
  font-weight:600;
  color:var(--text-sub);
  border-radius:var(--radius-pill);
  position:relative;
  transition:color var(--dur) var(--ease),background-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
#main-nav a::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:3px;
  width:0;
  height:2px;
  background:var(--brand-gradient);
  border-radius:2px;
  transform:translateX(-50%);
  transition:width var(--dur) var(--ease);
}
#main-nav a:hover{
  color:var(--brand-primary);
  background:var(--bg-soft);
  transform:translateY(-2px);
}
#main-nav a:hover::after{width:60%;}

.header-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.site-search{display:flex;align-items:center;gap:6px;}
.site-search input[type="search"]{
  width:180px;
  padding:9px 14px;
  font-size:.9rem;
  color:var(--text-main);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-pill);
  outline:none;
  transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),width var(--dur) var(--ease),background-color var(--dur) var(--ease);
}
.site-search input[type="search"]::placeholder{color:var(--text-muted);}
.site-search input[type="search"]:focus{
  border-color:var(--brand-primary);
  box-shadow:0 0 0 4px rgba(63,90,158,.16);
  width:220px;
}
.site-search button,
#theme-toggle,
#menu-toggle{
  cursor:pointer;
  font-family:inherit;
  font-size:.86rem;
  font-weight:700;
  color:var(--text-invert);
  background:var(--brand-gradient);
  border:none;
  border-radius:var(--radius-pill);
  padding:9px 16px;
  white-space:nowrap;
  box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),filter var(--dur) var(--ease);
}
.site-search button:hover,
#theme-toggle:hover,
#menu-toggle:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-glow);
  filter:brightness(1.06);
}
.site-search button:active,
#theme-toggle:active,
#menu-toggle:active{transform:translateY(0) scale(.97);}
#theme-toggle{background:linear-gradient(135deg,var(--brand-primary),var(--brand-coral));}
#menu-toggle{display:none;}

.breadcrumb{
  max-width:var(--maxw);
  margin:0 auto;
  padding:16px 20px 0;
}
.breadcrumb ol{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
  font-size:.84rem;
  color:var(--text-muted);
}
.breadcrumb li+li::before{
  content:"›";
  margin-right:8px;
  color:var(--text-muted);
  opacity:.7;
}
.breadcrumb a{color:var(--text-sub);font-weight:600;}
.breadcrumb a:hover{color:var(--brand-coral);}
.breadcrumb [aria-current="page"]{color:var(--brand-primary);font-weight:700;}

#hero{
  margin-top:20px;
  padding:0;
  overflow:hidden;
  background:var(--brand-gradient);
  color:var(--text-invert);
  border:none;
  box-shadow:var(--shadow-lg);
}
#hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(600px 300px at 85% 12%,rgba(255,255,255,.22),transparent 60%),
    radial-gradient(520px 280px at 8% 90%,rgba(242,193,78,.24),transparent 62%);
  pointer-events:none;
}
#hero h1,#hero h2,#hero p,#hero li{color:var(--text-invert);}
#hero h1{position:relative;text-shadow:0 4px 24px rgba(0,0,0,.28);}
#hero p{color:rgba(255,255,255,.9);}

.hero-slider{
  position:relative;
  padding:clamp(20px,3vw,34px);
  margin-bottom:8px;
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.22);
  overflow:hidden;
  min-height:170px;
}
.hero-slider .slide{
  display:none;
  animation:slideFade .6s var(--ease) both;
}
.hero-slider .slide.is-active{display:block;}
.hero-slider .slide h2{margin-top:0;font-size:clamp(1.15rem,2.2vw,1.5rem);}
.hero-slider .slide p{margin-bottom:0;}
@keyframes slideFade{
  from{opacity:0;transform:translateX(24px);}
  to{opacity:1;transform:translateX(0);}
}
.slider-controls{
  position:absolute;
  right:clamp(16px,3vw,30px);
  bottom:clamp(14px,2.4vw,22px);
  display:flex;
  gap:8px;
}
.slider-controls button{
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.4);
  background:rgba(255,255,255,.16);
  color:#fff;
  font-size:.82rem;
  font-weight:700;
  cursor:pointer;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.slider-controls button:hover{
  background:rgba(255,255,255,.34);
  transform:translateY(-3px) scale(1.06);
  box-shadow:0 8px 20px rgba(0,0,0,.24);
}

.hero-content{position:relative;padding:clamp(4px,1.4vw,14px) clamp(2px,1vw,10px);}
.hero-lead{max-width:76ch;font-size:1.02rem;}
.hero-points{
  list-style:none;
  padding:0;
  margin:18px 0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:10px;
}
.hero-points li{
  position:relative;
  padding:12px 16px 12px 42px;
  margin:0;
  font-size:.92rem;
  font-weight:600;
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.hero-points li::before{
  content:"";
  position:absolute;
  left:16px;
  top:50%;
  width:14px;
  height:14px;
  margin-top:-7px;
  border-radius:50%;
  background:var(--brand-accent);
  box-shadow:0 0 0 4px rgba(242,193,78,.24);
}
.hero-points li:hover{
  transform:translateY(-4px);
  background:rgba(255,255,255,.24);
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}

.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:22px 0 6px;}
.btn-primary,.btn-secondary{
  display:inline-block;
  padding:13px 30px;
  font-size:.95rem;
  font-weight:800;
  border-radius:var(--radius-pill);
  letter-spacing:.4px;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),background-color var(--dur) var(--ease),color var(--dur) var(--ease);
}
.btn-primary{
  background:var(--brand-accent);
  color:#20283c;
  box-shadow:0 10px 26px rgba(242,193,78,.4);
}
.btn-primary:hover{
  color:#20283c;
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 18px 38px rgba(242,193,78,.52);
}
.btn-secondary{
  background:rgba(255,255,255,.16);
  color:#fff;
  border:1px solid rgba(255,255,255,.5);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.btn-secondary:hover{
  color:#fff;
  background:rgba(255,255,255,.28);
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 16px 34px rgba(0,0,0,.24);
}

.hero-stats{
  position:relative;
  margin-top:26px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:14px;
}
.hero-stats .stat{
  padding:18px 16px;
  text-align:center;
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.24);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  transition:transform var(--dur) var(--ease),background-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
.hero-stats .stat:hover{
  transform:translateY(-6px);
  background:rgba(255,255,255,.24);
  box-shadow:0 16px 36px rgba(0,0,0,.26);
}
.stat-num{
  display:block;
  font-size:clamp(1.5rem,3vw,2.1rem);
  font-weight:900;
  color:var(--brand-accent);
  letter-spacing:1px;
  line-height:1.2;
  font-variant-numeric:tabular-nums;
}
.stat-label{display:block;margin-top:4px;font-size:.82rem;font-weight:600;color:rgba(255,255,255,.88);}

#products ul,#solutions ul,#howto ul,#howto ol,#contact ul,#sitemap ul,#links ul,#site-footer ul{
  list-style:none;
  padding-left:0;
}

#products ul li{
  position:relative;
  padding:12px 16px 12px 44px;
  margin:8px 0;
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  color:var(--text-sub);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
#products ul li::before{
  content:"";
  position:absolute;
  left:18px;
  top:50%;
  width:12px;
  height:12px;
  margin-top:-6px;
  border-radius:4px;
  background:var(--brand-gradient);
  transform:rotate(45deg);
  transition:transform var(--dur) var(--ease);
}
#products ul li:hover{
  transform:translateX(6px);
  border-color:var(--brand-primary);
  box-shadow:var(--shadow-md);
}
#products ul li:hover::before{transform:rotate(135deg) scale(1.15);}

#cases blockquote{
  background:var(--bg-elevated);
  border-left-color:var(--brand-coral);
}
#cases blockquote:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);}

.post{
  position:relative;
  margin:18px 0;
  padding:22px 24px;
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
  overflow:hidden;
}
.post::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--brand-gradient);
  transform:scaleY(0);
  transform-origin:top;
  transition:transform var(--dur) var(--ease);
}
.post:hover{
  transform:translateY(-6px);
  box-shadow:var(--shadow-lg);
  border-color:var(--brand-primary);
}
.post:hover::before{transform:scaleY(1);}
.post h3{margin-top:0;}
.post h3 a{color:var(--text-main);}
.post h3 a:hover{color:var(--brand-coral);}
.post-meta{
  font-size:.82rem;
  color:var(--text-muted);
  margin:.2em 0 .6em;
  letter-spacing:.3px;
}
.post a[href]{
  display:inline-block;
  margin-top:6px;
  font-weight:700;
  font-size:.9rem;
  color:var(--brand-primary);
  transition:transform var(--dur) var(--ease),color var(--dur) var(--ease);
}
.post a[href]::after{content:" →";transition:margin var(--dur) var(--ease);}
.post a[href]:hover{color:var(--brand-coral);transform:translateX(4px);}

.faq-item{
  margin:14px 0;
  padding:20px 22px;
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.faq-item:hover{
  transform:translateY(-4px);
  border-color:var(--brand-accent);
  box-shadow:var(--shadow-md);
}
.faq-item h3{
  margin:0 0 8px;
  padding-left:30px;
  position:relative;
  font-size:1.02rem;
}
.faq-item h3::before{
  content:"Q";
  position:absolute;
  left:0;
  top:0;
  width:22px;
  height:22px;
  line-height:22px;
  text-align:center;
  font-size:.72rem;
  font-weight:900;
  color:#20283c;
  background:var(--brand-accent);
  border-radius:50%;
  box-shadow:0 4px 10px rgba(242,193,78,.36);
}
.faq-item p{margin:0;font-size:.94rem;}

#howto ol{
  counter-reset:howto;
  list-style:none;
  padding-left:0;
}
#howto ol li{
  position:relative;
  counter-increment:howto;
  padding:14px 18px 14px 56px;
  margin:10px 0;
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  color:var(--text-sub);
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
#howto ol li::before{
  content:counter(howto);
  position:absolute;
  left:16px;
  top:50%;
  width:28px;
  height:28px;
  margin-top:-14px;
  line-height:28px;
  text-align:center;
  font-size:.84rem;
  font-weight:900;
  color:#fff;
  background:var(--brand-gradient);
  border-radius:50%;
  box-shadow:var(--shadow-glow);
}
#howto ol li:hover{
  transform:translateX(6px);
  border-color:var(--brand-primary);
  box-shadow:var(--shadow-md);
}

#howto ul li{
  position:relative;
  padding:10px 16px 10px 40px;
  margin:8px 0;
  border-radius:var(--radius-md);
  background:var(--bg-soft);
  border:1px dashed var(--border-strong);
  color:var(--text-sub);
  transition:background-color var(--dur) var(--ease),transform var(--dur) var(--ease);
}
#howto ul li::before{
  content:"✓";
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:.9rem;
  font-weight:900;
  color:var(--brand-coral);
}
#howto ul li:hover{background:var(--bg-elevated);transform:translateX(4px);}

.contact-list li{
  position:relative;
  padding:12px 16px 12px 42px;
  margin:8px 0;
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  color:var(--text-sub);
  font-size:.94rem;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.contact-list li::before{
  content:"◆";
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  font-size:.7rem;
  color:var(--brand-primary);
}
.contact-list li:hover{
  transform:translateX(6px);
  border-color:var(--brand-primary);
  box-shadow:var(--shadow-md);
}

.sitemap-list,.friend-links{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:12px;
}
.sitemap-list li,.friend-links li{margin:0;}
.sitemap-list a,.friend-links a{
  display:block;
  padding:14px 18px;
  font-weight:700;
  font-size:.94rem;
  color:var(--text-main);
  border-radius:var(--radius-md);
  background:var(--bg-elevated);
  border:1px solid var(--border-soft);
  box-shadow:var(--shadow-sm);
  position:relative;
  overflow:hidden;
  transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),color var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.sitemap-list a::after,.friend-links a::after{
  content:"";
  position:absolute;
  inset:0;
  background:var(--brand-gradient);
  opacity:0;
  transition:opacity var(--dur) var(--ease);
}
.sitemap-list a span,.friend-links a span{position:relative;z-index:1;}
.sitemap-list a:hover,.friend-links a:hover{
  color:#fff;
  transform:translateY(-4px);
  border-color:transparent;
  box-shadow:var(--shadow-glow);
}
.sitemap-list a:hover::after,.friend-links a:hover::after{opacity:1;}
.sitemap-list a,.friend-links a{--x:0;}

#site-footer{
  margin-top:40px;
  padding:48px 20px 24px;
  background:var(--brand-gradient);
  color:rgba(255,255,255,.88);
  border-top:1px solid var(--border-soft);
  position:relative;
  overflow:hidden;
}
#site-footer::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 320px at 12% 0%,rgba(255,255,255,.16),transparent 62%),
    radial-gradient(600px 300px at 92% 100%,rgba(242,193,78,.18),transparent 64%);
  pointer-events:none;
}
.footer-inner{
  position:relative;
  max-width:var(--maxw);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:28px;
}
#site-footer h2{
  font-size:1.02rem;
  margin:0 0 12px;
  color:#fff;
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.24);
}
#site-footer p,#site-footer li{
  font-size:.88rem;
  color:rgba(255,255,255,.84);
  margin:.35em 0;
}
#site-footer ul{padding-left:0;}
#site-footer a{color:rgba(255,255,255,.9);font-weight:600;}
#site-footer a:hover{color:var(--brand-accent);}
#site-footer section{
  margin:0;
  padding:0;
  background:none;
  border:none;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  opacity:1;
  transform:none;
}
#site-footer section:hover{box-shadow:none;border:none;}
.footer-bottom{
  position:relative;
  max-width:var(--maxw);
  margin:32px auto 0;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.2);
  text-align:center;
  font-size:.82rem;
  color:rgba(255,255,255,.7);
}

#back-to-top{
  position:fixed;
  right:22px;
  bottom:26px;
  z-index:130;
  width:52px;
  height:52px;
  padding:0;
  font-size:.72rem;
  font-weight:800;
  line-height:1.15;
  color:#fff;
  background:var(--brand-gradient);
  border:none;
  border-radius:50%;
  cursor:pointer;
  box-shadow:var(--shadow-glow);
  opacity:0;
  visibility:hidden;
  transform:translateY(18px) scale(.9);
  transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),visibility var(--dur) var(--ease);
}
#back-to-top.is-show{opacity:1;visibility:visible;transform:translateY(0) scale(1);}
#back-to-top:hover{transform:translateY(-5px) scale(1.06);box-shadow:0 18px 40px rgba(63,90,158,.42);}
#back-to-top:active{transform:translateY(-2px) scale(.98);}

@media (max-width:1024px){
  .site-search input[type="search"]{width:150px;}
  .site-search input[type="search"]:focus{width:180px;}
  .brand-sub{display:none;}
}

@media (max-width:860px){
  #menu-toggle{display:inline-block;}
  #main-nav{
    order:3;
    width:100%;
    margin-left:0;
    max-height:0;
    overflow:hidden;
    transition:max-height .42s var(--ease),opacity var(--dur) var(--ease);
    opacity:0;
  }
  #main-nav.is-open{max-height:620px;opacity:1;}
  #main-nav ul{
    flex-direction:column;
    align-items:stretch;
    gap:2px;
    padding:8px 0 12px;
  }
  #main-nav a{
    display:block;
    padding:12px 16px;
    border-radius:var(--radius-sm);
    font-size:.95rem;
  }
  #main-nav a::after{display:none;}
  #main-nav a:hover{transform:translateX(6px);}
  .header-inner{gap:12px;}
  .header-tools{margin-left:auto;}
}

@media (max-width:640px){
  body{font-size:15px;}
  main{padding:0 14px 48px;}
  section{
    margin:18px 0;
    padding:20px 16px;
    border-radius:var(--radius-md);
  }
  .breadcrumb{padding:12px 14px 0;}
  .header-inner{padding:10px 14px;}
  .brand-name{font-size:1rem;}
  .site-search{width:100%;order:4;}
  .site-search input[type="search"],
  .site-search input[type="search"]:focus{width:100%;flex:1;}
  .header-tools{width:100%;justify-content:space-between;}
  .hero-slider{padding:18px 16px 56px;min-height:auto;}
  .slider-controls{right:14px;bottom:12px;}
  .hero-points{grid-template-columns:1fr;}
  .hero-actions{flex-direction:column;align-items:stretch;}
  .btn-primary,.btn-secondary{text-align:center;padding:13px 20px;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .post{padding:18px 16px;}
  .faq-item{padding:16px 16px;}
  .sitemap-list,.friend-links{grid-template-columns:1fr;}
  .footer-inner{grid-template-columns:1fr;gap:22px;}
  #back-to-top{right:14px;bottom:16px;width:46px;height:46px;font-size:.66rem;}
}

@media (max-width:380px){
  .hero-stats{grid-template-columns:1fr;}
  .brand-sub{display:none;}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
  section{opacity:1;transform:none;}
}

@media print{
  #site-header,#back-to-top,.hero-actions,.slider-controls,.header-tools{display:none!important;}
  body{background:#fff;color:#000;}
  section{box-shadow:none;border:1px solid #ddd;opacity:1;transform:none;}
  #hero,#site-footer{background:#fff;color:#000;}
  #hero h1,#hero h2,#hero p,#hero li{color:#000;}
}