*,*::before,*::after{box-sizing:border-box}
body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img{max-width:100%;display:block}
input,button,textarea,select{font:inherit}
address{font-style:normal}

:root{
--color-primary:#1a4b8c;
--color-primary-dark:#123a6b;
--color-white:#f7f9fc;
--color-glacier:#b8d4e8;
--color-accent:#e25730;
--color-accent-dark:#b34828;
--color-deep:#0b1f33;
--color-gray:#e9edf2;
--color-gold:#d4a017;
--color-muted:#5a6b7a;
--color-text:#1e2a36;
--font-heading:'Noto Sans SC','Microsoft YaHei','WenQuanYi Micro Hei',sans-serif;
--font-body:'Noto Serif SC','Songti SC','Times New Roman',serif;
--shadow-float:0 10px 32px rgba(11,31,51,.10);
--shadow-card:0 2px 12px rgba(11,31,51,.06);
--radius-pill:56px;
--radius-card:16px;
--radius-tag:999px;
--site-width:1200px;
--transition:.25s ease
}

html{scroll-behavior:smooth}
body{
font-family:var(--font-body);
font-size:16px;
line-height:1.8;
color:var(--color-text);
background-color:var(--color-white);
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility
}

h1,h2,h3,h4,h5,h6{
font-family:var(--font-heading);
font-weight:700;
letter-spacing:.02em;
line-height:1.3;
color:var(--color-deep)
}
h1{font-size:clamp(30px,5vw,44px)}
h2{font-size:clamp(24px,3.5vw,34px)}
h3{font-size:clamp(18px,2.5vw,24px)}

a{color:var(--color-primary);text-decoration:none;transition:color var(--transition)}
a:hover{color:var(--color-accent)}

:focus-visible{
outline:3px solid var(--color-accent);
outline-offset:3px;
border-radius:4px
}

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

.skip-link{
position:fixed;
top:-120px;left:16px;
z-index:9999;
padding:12px 24px;
font-family:var(--font-heading);
font-size:14px;
font-weight:700;
text-decoration:none;
color:#fff;
background:var(--color-accent);
border-radius:var(--radius-tag);
box-shadow:var(--shadow-float);
transition:top .25s ease
}
.skip-link:focus{top:16px;color:#fff}

.site-container{
max-width:var(--site-width);
margin:0 auto;
padding:0 24px
}

.page-main{min-height:70vh}

.site-header{
position:sticky;
top:0;
z-index:200;
padding:6px 0 0
}

.site-header__inner{
position:relative;
max-width:var(--site-width);
margin:0 auto;
padding:0 24px
}

.batch-badge{
position:absolute;
top:8px;
right:24px;
z-index:3;
display:inline-flex;
align-items:center;
gap:6px;
font-family:var(--font-heading);
font-size:11px;
font-weight:700;
line-height:1;
letter-spacing:.1em;
color:#fff;
background:linear-gradient(135deg,var(--color-accent),var(--color-accent-dark));
padding:6px 16px;
border-radius:var(--radius-tag);
box-shadow:0 4px 14px rgba(226,87,48,.35);
transform:rotate(1.2deg);
white-space:nowrap
}
.batch-badge::before{
content:"";
display:inline-block;
width:5px;height:5px;
border-radius:50%;
background:var(--color-white)
}

.site-header__capsule{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
margin-top:34px;
padding:8px 8px 8px 20px;
background:rgba(255,255,255,.97);
border:1px solid rgba(184,212,232,.7);
border-radius:var(--radius-pill);
box-shadow:var(--shadow-float)
}

.site-brand{
display:inline-flex;
align-items:center;
gap:12px;
text-decoration:none
}
.site-brand:hover{color:var(--color-deep)}

.site-brand__mark{
--mark-base:var(--color-primary);
--mark-snow:var(--color-white);
display:block;
width:38px;height:26px;
background:linear-gradient(180deg,var(--mark-snow) 0,var(--mark-snow) 5px,var(--mark-base) 5px);
clip-path:polygon(0% 100%,2% 55%,12% 30%,24% 68%,38% 10%,52% 62%,68% 4%,86% 34%,100% 16%,100% 100%)
}

.site-brand__name{
font-family:var(--font-heading);
font-size:22px;
font-weight:700;
letter-spacing:.06em;
color:var(--color-deep)
}

.site-nav{display:block}

.site-nav__list{
display:flex;
align-items:center;
gap:2px
}

.site-nav__item{margin:0}

.site-nav__link{
display:inline-block;
padding:10px 18px;
font-family:var(--font-heading);
font-size:15px;
font-weight:500;
line-height:1.4;
color:var(--color-deep);
text-decoration:none;
border-radius:var(--radius-tag);
transition:background var(--transition),color var(--transition),box-shadow var(--transition)
}
.site-nav__link:hover{
background:var(--color-glacier);
color:var(--color-primary)
}
.site-nav__link[aria-current="page"]{
background:var(--color-primary);
color:#fff;
box-shadow:0 4px 12px rgba(26,75,140,.28)
}

.nav-toggle{
display:none;
align-items:center;
justify-content:center;
width:46px;height:46px;
border:none;
background:var(--color-gray);
border-radius:50%;
cursor:pointer;
padding:0;
transition:background var(--transition)
}
.nav-toggle:hover{background:var(--color-glacier)}

.nav-toggle__icon{
display:flex;
flex-direction:column;
gap:5px;
width:20px;
align-items:center;
justify-content:center
}

.nav-toggle__bar{
display:block;
width:20px;height:2px;
background:var(--color-deep);
border-radius:2px;
transition:transform .25s ease,opacity .25s ease
}
.nav-toggle[data-open] .nav-toggle__bar:nth-child(1){
transform:translateY(7px) rotate(45deg)
}
.nav-toggle[data-open] .nav-toggle__bar:nth-child(2){
opacity:0
}
.nav-toggle[data-open] .nav-toggle__bar:nth-child(3){
transform:translateY(-7px) rotate(-45deg)
}

.site-footer{
position:relative;
margin-top:96px;
background:var(--color-deep);
color:rgba(247,249,252,.9);
overflow:hidden;
--mark-base:var(--color-glacier);
--mark-snow:var(--color-deep)
}
.site-footer::before{
content:"";
position:absolute;
top:0;left:0;
right:0;
height:52px;
background:var(--color-white);
border-radius:0 0 75% 0;
z-index:0
}

.site-footer__inner{
position:relative;
z-index:1;
max-width:var(--site-width);
margin:0 auto;
padding:84px 24px 36px
}

.site-footer__top{
display:flex;
flex-direction:column;
gap:16px;
padding-bottom:32px;
border-bottom:1px solid rgba(184,212,232,.18)
}

.site-footer__brand{
display:flex;
align-items:center;
gap:12px
}

.site-footer__name{
font-family:var(--font-heading);
font-size:24px;
font-weight:700;
letter-spacing:.08em;
color:var(--color-white)
}

.site-footer__trust{
max-width:680px;
font-size:14px;
line-height:1.7;
color:var(--color-glacier)
}

.site-footer__columns{
display:grid;
grid-template-columns:1.3fr 1fr;
gap:48px;
padding:36px 0 32px
}

.site-footer__col{min-width:0}

.site-footer__heading{
font-family:var(--font-heading);
font-size:14px;
font-weight:700;
letter-spacing:.1em;
color:var(--color-gold);
margin-bottom:12px
}

.site-footer__contact{
display:flex;
flex-direction:column;
gap:8px;
font-size:14px;
line-height:1.7;
color:rgba(247,249,252,.85)
}

.site-footer__links{
display:flex;
flex-direction:column;
gap:8px
}
.site-footer__links a{
color:rgba(247,249,252,.85);
font-size:14px;
transition:color var(--transition),margin-left var(--transition)
}
.site-footer__links a:hover{
color:var(--color-white);
margin-left:4px
}

.site-footer__bottom{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:8px 24px;
padding-top:24px;
border-top:1px solid rgba(184,212,232,.18);
font-size:13px;
color:rgba(247,249,252,.65)
}

.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
padding:12px 28px;
font-family:var(--font-heading);
font-size:15px;
font-weight:700;
line-height:1.4;
letter-spacing:.04em;
text-decoration:none;
border:none;
border-radius:var(--radius-tag);
cursor:pointer;
transition:transform var(--transition),box-shadow var(--transition),background var(--transition)
}
.btn--primary{
background:var(--color-primary);
color:#fff
}
.btn--primary:hover{
background:var(--color-primary-dark);
color:#fff;
transform:translateY(-2px);
box-shadow:0 8px 20px rgba(26,75,140,.3)
}
.btn--accent{
background:var(--color-accent);
color:#fff
}
.btn--accent:hover{
background:var(--color-accent-dark);
color:#fff;
transform:translateY(-2px);
box-shadow:0 8px 20px rgba(226,87,48,.3)
}
.btn--small{
padding:8px 18px;
font-size:13px
}

.breadcrumb{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:8px;
font-family:var(--font-heading);
font-size:14px;
line-height:1.6;
padding:8px 0 20px
}
.breadcrumb a{
color:var(--color-muted);
text-decoration:none
}
.breadcrumb a:hover{color:var(--color-primary)}
.breadcrumb__sep{color:var(--color-glacier)}

.tag{
display:inline-flex;
align-items:center;
gap:6px;
padding:4px 14px;
font-family:var(--font-heading);
font-size:12px;
font-weight:600;
letter-spacing:.08em;
background:var(--color-glacier);
color:var(--color-primary);
border-radius:var(--radius-tag)
}
.tag--gold{
background:var(--color-gold);
color:var(--color-deep)
}

.card{
background:#fff;
border:1px solid var(--color-gray);
border-radius:var(--radius-card);
padding:24px;
box-shadow:var(--shadow-card)
}

.section-label{
display:inline-flex;
align-items:center;
gap:6px;
font-family:var(--font-heading);
font-size:12px;
font-weight:700;
letter-spacing:.14em;
color:var(--color-primary);
background:var(--color-glacier);
padding:6px 16px;
border-radius:var(--radius-tag)
}

.section-heading{
margin:8px 0 8px;
font-size:clamp(26px,4vw,38px)
}

.meta-note{
font-family:var(--font-heading);
font-size:12px;
line-height:1.6;
letter-spacing:.12em;
color:var(--color-muted);
writing-mode:vertical-rl;
max-height:120px;
opacity:.8
}

.grid-basic{
display:grid;
grid-template-columns:repeat(12,1fr);
gap:24px
}

.media-frame{
display:block;
position:relative;
width:100%;
aspect-ratio:16/10;
background:var(--color-gray);
border-radius:var(--radius-card);
overflow:hidden
}
.media-frame img{
width:100%;
height:100%;
object-fit:cover;
display:block
}
.media-frame--hero{
aspect-ratio:21/9;
border-radius:24px
}
.media-frame--fill{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover
}

[data-reveal]{
opacity:0;
transform:translateY(24px);
transition:opacity .6s ease,transform .6s ease;
will-change:opacity,transform
}
[data-reveal].is-visible{
opacity:1;
transform:translateY(0)
}

@keyframes navOpen{
from{opacity:0;transform:translateY(-8px)}
to{opacity:1;transform:translateY(0)}
}

@media (max-width:999px){
.site-container,
.site-header__inner{
padding-left:16px;
padding-right:16px
}
.batch-badge{right:16px}
.site-footer__inner{
padding-left:20px;
padding-right:20px
}
}

@media (max-width:767px){
.site-header{
padding-top:2px
}
.site-header__inner{
padding:0 12px
}
.batch-badge{
top:4px;
right:12px;
font-size:10px;
padding:4px 12px
}
.site-header__capsule{
flex-wrap:wrap;
margin-top:22px;
padding:8px 8px 8px 12px;
border-radius:20px;
gap:0
}
.site-brand{
flex:1 1 auto
}
.site-brand__name{
font-size:19px
}
.nav-toggle{
display:flex;
flex:0 0 auto
}
.site-nav{
display:none;
flex-basis:100%;
width:100%;
padding-top:10px
}
.site-nav[data-open]{
display:block;
animation:navOpen .3s ease
}
.site-nav__list{
flex-direction:column;
align-items:stretch;
gap:4px
}
.site-nav__link{
display:block;
padding:12px 20px;
border-radius:12px;
font-size:16px
}
.site-footer{
margin-top:48px
}
.site-footer__inner{
padding:64px 20px 28px
}
.site-footer__columns{
grid-template-columns:1fr;
gap:28px
}
.site-footer__bottom{
flex-direction:column;
align-items:flex-start
}
}

@media (prefers-reduced-motion:reduce){
*,*::before,*::after{
animation-duration:.01ms!important;
animation-iteration-count:1!important;
transition-duration:.01ms!important;
scroll-behavior:auto!important
}
[data-reveal]{
opacity:1;
transform:none
}
.site-nav{
animation:none!important
}
}
