:root {
  --navy: #082f5f;
  --navy-deep: #05264c;
  --blue: #15589a;
  --blue-light: #a9c8e6;
  --ink: #1f2f3f;
  --muted: #607080;
  --surface: #f3f6f8;
  --line: #d8e1e8;
  --white: #ffffff;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:"Arial Nova","Aptos Display","Helvetica Neue",Arial,sans-serif; line-height:1.55; }
h1,h2,h3,h4,h5,h6,button,input,textarea,select { font-family:inherit; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }

.site-header { background:var(--white); }
.header-inner { width:min(1180px,calc(100% - 48px)); min-height:112px; margin:auto; display:flex; align-items:center; justify-content:space-between; }
.zhifa-logo img { width:190px; height:auto; }
.header-contact { display:flex; align-items:center; gap:28px; }
.whatsapp-link { display:flex; align-items:center; gap:9px; color:#147a45; }
.whatsapp-link span { width:25px; height:25px; border:2px solid #20a862; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#147a45; font-size:13px; font-weight:900; }
.whatsapp-link small { color:#607080; font-size:14px; }
.whatsapp-link b { font-size:17px; font-weight:700; }
.whatsapp-link:hover { color:#20a862; }
.hotline { display:flex; align-items:center; gap:10px; color:var(--navy); }
.hotline span { font-size:22px; }
.hotline small { color:var(--muted); font-size:14px; }
.hotline b { font-size:21px; font-weight:650; }
.main-nav { min-height:66px; padding:0 max(24px,calc((100% - 1180px)/2)); display:flex; align-items:center; justify-content:space-between; gap:28px; background:var(--navy); color:var(--white); }
.main-nav a { font-size:15px; font-weight:600; white-space:nowrap; }
.main-nav a:hover { color:var(--blue-light); }

.hero { min-height:650px; padding:72px max(34px,calc((100% - 1180px)/2)); display:grid; grid-template-columns:.88fr 1.12fr; gap:44px; align-items:center; overflow:hidden; background:linear-gradient(125deg,var(--navy-deep),var(--navy) 62%,#0d447c); color:var(--white); }
.hero-copy { position:relative; z-index:2; }
.hero-overline { margin:0 0 22px; color:var(--blue-light); font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.hero h1 { margin:0; color:var(--white); font-size:clamp(44px,4.5vw,70px); font-weight:700; line-height:1.08; letter-spacing:-.02em; }
.hero h1 span { color:#d9eafa; }
.hero-sub { max-width:610px; margin:28px 0 0; color:#d4e1ee; font-size:18px; }
.hero-actions { display:flex; gap:14px; margin-top:34px; }
.hero-actions a { min-width:176px; padding:14px 22px; border:1px solid var(--white); border-radius:3px; background:var(--white); color:var(--navy); text-align:center; font-weight:700; }
.hero-actions .outline { background:transparent; color:var(--white); }
.finish-notes { display:flex; flex-wrap:wrap; gap:22px; margin-top:34px; color:#c5d8e9; font-size:13px; }
.finish-notes span::before { content:"✓"; margin-right:7px; color:#7fb3e2; font-weight:800; }
.hero-product { width:100%; min-width:0; display:flex; align-items:center; justify-content:center; }
.hero-product-frame { width:min(118%,760px); overflow:visible; border-radius:0; box-shadow:none; background:transparent; }
.hero-product-frame img { display:block; width:114%; max-width:none; height:auto; margin-left:-7%; filter:drop-shadow(0 22px 24px rgba(0,0,0,.22)); }

.section-tag { color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.16em; }
.section-tag.light { color:var(--blue-light); }
.about {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:470px;
  padding:92px max(34px,calc((100% - 1180px)/2));
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  align-items:center;
  gap:90px;
  background:#dce8f2;
}
.about-background {
  position:absolute;
  inset:0;
  z-index:-2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.about-background-panel {
  min-width:0;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.about-background-panel + .about-background-panel {
  box-shadow:-1px 0 0 rgba(255,255,255,.42);
}
.about-overlay {
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(220,235,246,.38) 0%,rgba(211,229,243,.25) 52%,rgba(205,225,241,.18) 100%);
}
.about-heading,.about-copy { position:relative; z-index:1; }
.about-heading::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:-54px -80px -54px -90px;
  background:radial-gradient(ellipse at 42% 50%,rgba(242,248,252,.86) 0%,rgba(231,242,250,.68) 46%,rgba(225,238,248,0) 76%);
  pointer-events:none;
}
.about-copy {
  max-width:680px;
  padding:26px 30px;
  border-left:2px solid rgba(8,47,95,.18);
  background:linear-gradient(90deg,rgba(245,250,253,.78),rgba(236,246,252,.56));
  box-shadow:0 12px 34px rgba(8,47,95,.07);
  backdrop-filter:blur(3px);
}
.about h2,.quality h2,.news h2,.message h1 { margin:14px 0 0; font-size:clamp(32px,3.2vw,48px); line-height:1.15; letter-spacing:-.025em; }
.about p { margin:0 0 16px; color:#354b60; }
.about .section-tag { color:#b66565; font-size:clamp(16px,1.25vw,20px); font-weight:800; }
.about-company-name { color:var(--navy); font-weight:800; }
.about a { color:var(--blue); font-weight:700; }

.product-center { padding:88px max(34px,calc((100% - 1280px)/2)) 100px; background:var(--surface); }
.section-title { display:grid; grid-template-columns:1fr auto 1fr; gap:28px; align-items:center; text-align:center; }
.section-title>span { height:1px; background:var(--line); }
.section-title small { color:var(--blue); font-weight:800; letter-spacing:.16em; }
.section-title h2 { margin:5px 0 3px; color:var(--navy); font-size:clamp(38px,4vw,56px); line-height:1.1; }
.section-title p { margin:0; color:var(--muted); }
.product-grid { margin-top:54px; display:grid; grid-template-columns:repeat(4,1fr); gap:48px 28px; }
.product-item { margin:0; min-width:0; }
.product-item img { display:block; width:100%; height:auto; object-fit:contain; }
.product-item figcaption { padding-top:16px; color:var(--navy); font-size:17px; font-weight:650; text-align:center; line-height:1.35; }

.quality { padding:92px max(34px,calc((100% - 1180px)/2)); background:var(--navy); color:var(--white); }
.quality-copy { max-width:760px; }
.quality-copy p { color:#c8d7e6; }
.quality-grid { margin-top:45px; display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.quality-grid>div { padding:28px 24px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.045); }
.quality-grid b { color:#78aede; font-size:28px; }
.quality-grid h3 { margin:18px 0 8px; }
.quality-grid p { margin:0; color:#c8d7e6; font-size:14px; }

.news { padding:92px max(34px,calc((100% - 1180px)/2)); background:var(--white); }
.news-cards { margin-top:42px; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.news-cards article { padding:30px; border-top:3px solid var(--blue); background:var(--surface); }
.news-cards small { color:var(--blue); font-weight:800; letter-spacing:.12em; }
.news-cards h3 { margin:15px 0 10px; color:var(--navy); }
.news-cards p { margin:0; color:var(--muted); }

.message { padding:92px max(34px,calc((100% - 1180px)/2)); display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; background:var(--navy-deep); color:var(--white); }
.message>div p { color:#c8d7e6; }
.message form { display:grid; gap:16px; }
.message form>div { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.message label { display:grid; gap:7px; color:#d5e1ec; font-size:13px; font-weight:600; }
.message input,.message textarea { width:100%; padding:13px 14px; border:1px solid #406891; border-radius:3px; background:#0b3766; color:white; font:inherit; }
.message input::placeholder,.message textarea::placeholder { color:#9fb4c8; }
.message button { width:170px; padding:14px; border:0; border-radius:3px; background:white; color:var(--navy); font-weight:800; cursor:pointer; }
.message-page { min-height:620px; align-items:center; }

.contact-page { padding:84px max(34px,calc((100% - 1280px)/2)) 100px; background:linear-gradient(180deg,#f7fafc 0%,#edf3f7 100%); }
.contact-intro { max-width:760px; }
.contact-intro .section-tag { color:#b33b4d; font-size:14px; }
.contact-intro h1 { margin:12px 0 18px; color:var(--navy); font-size:clamp(46px,5vw,72px); line-height:1.04; letter-spacing:-.04em; }
.contact-intro p { margin:0; color:#516579; font-size:18px; }
.contact-layout { margin-top:54px; display:grid; grid-template-columns:.82fr 1.18fr; gap:30px; align-items:stretch; }
.contact-details { padding:38px; background:var(--navy-deep); color:white; box-shadow:0 18px 46px rgba(8,47,95,.14); }
.contact-details>h2 { margin:0 0 26px; font-size:24px; line-height:1.25; }
.contact-address-card { margin-top:14px; padding:20px 22px; border-left:4px solid; }
.contact-address-card small { font-size:11px; font-weight:800; letter-spacing:.15em; }
.contact-address-card p { margin:8px 0 0; line-height:1.65; }
.contact-address-card.office { border-color:#61a8df; background:#0b3a6c; }
.contact-address-card.office small { color:#9fd0f3; }
.contact-address-card.factory { border-color:#c54a5e; background:#183857; }
.contact-address-card.factory small { color:#ef9caa; }
.contact-channels { margin:28px 0 0; display:grid; gap:0; }
.contact-channels>div { display:grid; grid-template-columns:86px 1fr; gap:14px; padding:13px 0; border-top:1px solid rgba(255,255,255,.13); }
.contact-channels dt { color:#91bde1; font-weight:750; }
.contact-channels dd { margin:0; overflow-wrap:anywhere; }
.contact-channels a { color:white; text-decoration:underline; text-decoration-color:rgba(255,255,255,.35); text-underline-offset:4px; }
.contact-map-card { min-width:0; padding:30px; background:white; box-shadow:0 18px 46px rgba(8,47,95,.12); }
.contact-map-heading { min-height:62px; margin-bottom:22px; display:flex; align-items:end; justify-content:space-between; gap:22px; }
.contact-map-heading small { color:#b33b4d; font-size:11px; font-weight:800; letter-spacing:.15em; }
.contact-map-heading h2 { margin:4px 0 0; color:var(--navy); font-size:28px; }
.contact-map-heading a { padding:10px 14px; border:1px solid #bfd2e3; color:var(--blue); font-size:13px; font-weight:750; white-space:nowrap; }
.contact-map-card iframe { display:block; width:100%; min-height:520px; border:0; background:#dce8f2; }

.process-page { padding:86px max(34px,calc((100% - 1360px)/2)) 104px; background:#f4f7f9; }
.process-intro { max-width:860px; }
.process-intro .section-tag { color:#b33b4d; font-size:14px; }
.process-intro h1 { margin:12px 0 18px; color:var(--navy); font-size:clamp(46px,5vw,72px); line-height:1.02; letter-spacing:-.045em; }
.process-intro p { max-width:720px; margin:0; color:#53687b; font-size:18px; }
.process-visual { margin-top:42px; padding:18px; border:1px solid #d5e1ea; background:white; box-shadow:0 18px 46px rgba(8,47,95,.10); }
.process-visual img { display:block; width:100%; height:auto; }
.process-legend { margin-top:36px; display:flex; flex-wrap:wrap; gap:16px 30px; color:#4f6477; font-size:13px; font-weight:700; }
.process-legend span { display:flex; align-items:center; gap:8px; }
.process-legend i { width:10px; height:10px; border-radius:50%; }
.material-dot { background:#b33b4d; }
.forming-dot { background:#1766a7; }
.finishing-dot { background:#6e93b4; }
.process-lines { margin-top:36px; display:grid; gap:18px; }
.process-line { display:grid; grid-template-columns:230px 1fr; min-width:0; border:1px solid #d5e1ea; background:white; box-shadow:0 10px 28px rgba(8,47,95,.06); }
.process-product { padding:25px 24px; display:flex; align-items:center; gap:17px; background:linear-gradient(135deg,var(--navy-deep),var(--navy)); color:white; }
.process-product>span { min-width:48px; height:48px; border:1px solid rgba(255,255,255,.28); display:grid; place-items:center; color:#9fc7e9; font-weight:800; }
.process-product small { color:#9fc7e9; font-size:10px; font-weight:800; letter-spacing:.14em; }
.process-product h2 { margin:3px 0 2px; font-size:23px; }
.process-product p { margin:0; color:#c2d5e5; font-size:12px; }
.process-line ol { margin:0; padding:20px 22px; list-style:none; display:grid; grid-template-columns:repeat(7,minmax(90px,1fr)); gap:20px; align-items:stretch; }
.process-line li { position:relative; min-width:0; padding:13px 10px 12px; border-top:3px solid; background:#f5f8fa; }
.process-line li:not(:last-child)::after { content:"→"; position:absolute; top:50%; right:-17px; translate:0 -50%; color:#7695af; font-size:17px; font-weight:800; }
.process-line li>span { display:block; margin-bottom:7px; color:#8a9cac; font-size:10px; font-weight:800; letter-spacing:.12em; }
.process-line li>b { color:#20384d; font-size:13px; line-height:1.28; }
.process-line .stage-material { border-color:#b33b4d; background:#fbf3f4; }
.process-line .stage-forming { border-color:#1766a7; background:#f0f6fb; }
.process-line .stage-finishing { border-color:#6e93b4; }
.process-note { margin-top:26px; padding:22px 26px; border-left:4px solid #b33b4d; display:flex; gap:12px 28px; justify-content:space-between; background:#e5eef5; color:#435a6e; }
.process-note b { color:var(--navy); }

.news-page { padding:86px max(34px,calc((100% - 1280px)/2)) 104px; background:#f4f7f9; }
.news-page>header { max-width:820px; }
.news-page>header h1 { margin:12px 0 18px; color:var(--navy); font-size:clamp(46px,5vw,72px); line-height:1.02; letter-spacing:-.045em; }
.news-page>header p { margin:0; color:#53687b; font-size:18px; }
.news-list-grid { margin-top:52px; display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.news-list-grid article { overflow:hidden; border-top:3px solid var(--blue); background:white; box-shadow:0 12px 34px rgba(8,47,95,.08); }
.news-list-grid article>div { padding:25px; }
.news-cover { display:block; aspect-ratio:16/9; overflow:hidden; background:#dce8f2; }
.news-cover img { width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.news-cover:hover img { transform:scale(1.025); }
.news-list-grid small { color:#b33b4d; font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.news-list-grid h2 { margin:12px 0 10px; color:var(--navy); font-size:22px; line-height:1.25; }
.news-list-grid p { color:#607080; font-size:14px; }
.read-more { color:var(--blue); font-size:13px; font-weight:800; }
.news-empty { margin-top:48px; padding:50px; border:1px solid #d5e1ea; background:white; text-align:center; }
.news-empty h2 { color:var(--navy); }
.article-page { width:min(900px,calc(100% - 48px)); margin:0 auto; padding:52px 0 96px; }
.article-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; color:#6b7f91; font-size:13px; }
.article-page>header { padding:54px 0 38px; }
.article-page>header small { color:#b33b4d; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.article-page>header h1 { margin:14px 0 18px; color:var(--navy); font-size:clamp(42px,5vw,68px); line-height:1.06; letter-spacing:-.04em; }
.article-page>header p { max-width:780px; margin:0; color:#53687b; font-size:20px; }
.article-hero-image { width:100%; max-height:560px; object-fit:cover; }
.article-content { max-width:760px; margin:48px auto 0; color:#334b60; font-size:17px; line-height:1.8; }
.article-content h2 { margin:46px 0 14px; color:var(--navy); font-size:30px; line-height:1.2; }
.article-content h3 { margin:34px 0 12px; color:var(--navy); font-size:22px; }
.article-content p { white-space:pre-line; }
.article-content li { margin:7px 0; }
.article-cta { margin-top:64px; padding:30px 34px; display:flex; align-items:center; justify-content:space-between; gap:24px; background:var(--navy); color:white; }
.article-cta small { color:#9fc7e9; font-weight:800; letter-spacing:.1em; }
.article-cta h2 { margin:5px 0 0; }
.article-cta a { padding:13px 18px; background:white; color:var(--navy); font-weight:800; white-space:nowrap; }
.article-not-found { padding:120px 24px; text-align:center; }

.admin-shell { min-height:100vh; display:grid; grid-template-columns:245px 1fr; background:#eef3f6; color:#20384d; }
.admin-sidebar { position:sticky; top:0; height:100vh; padding:28px 20px; display:flex; flex-direction:column; background:var(--navy-deep); color:white; }
.admin-brand { display:grid; gap:12px; padding:4px 10px 28px; border-bottom:1px solid rgba(255,255,255,.12); }
.admin-brand img { width:128px; filter:brightness(0) invert(1); }
.admin-brand span { color:#9fb9cf; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.admin-sidebar nav { margin-top:26px; display:grid; gap:8px; }
.admin-sidebar nav button { padding:13px 14px; border:0; border-left:3px solid transparent; background:transparent; color:#c8d7e6; text-align:left; font:inherit; font-weight:700; cursor:pointer; }
.admin-sidebar nav button.active { border-color:#b33b4d; background:rgba(255,255,255,.08); color:white; }
.admin-view-site { margin-top:auto; padding:12px 14px; border:1px solid rgba(255,255,255,.18); color:#dce8f2; font-size:13px; text-align:center; }
.admin-logout { margin-top:10px; padding:11px 14px; border:0; background:transparent; color:#e3a5af; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.admin-main { min-width:0; padding:34px; }
.admin-top { min-height:70px; display:flex; align-items:start; justify-content:space-between; gap:24px; }
.admin-top small,.admin-panel-title small { color:#b33b4d; font-size:10px; font-weight:800; letter-spacing:.14em; }
.admin-top h1 { margin:3px 0 0; color:var(--navy); font-size:30px; }
.admin-top p { margin:0; padding:10px 14px; background:#dfeaf2; color:var(--navy); font-size:13px; }
.admin-articles-layout { display:grid; grid-template-columns:340px minmax(0,1fr); gap:22px; align-items:start; }
.admin-list-panel,.admin-editor,.admin-site-editor { border:1px solid #d5e1ea; background:white; box-shadow:0 10px 28px rgba(8,47,95,.06); }
.admin-panel-title { min-height:72px; padding:18px 20px; border-bottom:1px solid #e0e8ee; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.admin-list-actions { display:flex; align-items:center; gap:8px; }
.admin-list-actions .secondary { background:#fff; color:var(--navy); border:1px solid #d5e1ea; }
.admin-panel-title h2 { margin:2px 0 0; color:var(--navy); font-size:20px; }
.admin-panel-title button,.admin-editor-actions button { padding:10px 14px; border:0; background:var(--navy); color:white; font-weight:800; cursor:pointer; }
.admin-article-list { max-height:calc(100vh - 160px); overflow:auto; }
.admin-article-list article { padding:18px 16px; border-bottom:1px solid #e5ebf0; display:flex; align-items:start; justify-content:space-between; gap:12px; cursor:pointer; }
.admin-article-list article:hover,.admin-article-list article.selected { background:#f0f6fa; }
.admin-article-list article.selected { box-shadow:inset 3px 0 #1766a7; }
.admin-article-list h3 { margin:7px 0 5px; color:var(--navy); font-size:15px; }
.admin-article-list small { color:#7b8d9c; }
.admin-article-list article>button { border:0; background:transparent; color:#a44957; font-size:20px; cursor:pointer; }
.status { padding:3px 7px; border-radius:20px; font-size:9px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.status.draft { background:#e7edf1; color:#64798b; }
.status.published { background:#dcefe5; color:#17633b; }
.admin-empty { padding:30px 20px; color:#6c7f8f; text-align:center; }
.admin-editor-actions { display:flex; gap:8px; }
.admin-editor-actions select { padding:9px 12px; border:1px solid #ccd9e3; background:white; }
.admin-form-grid { padding:22px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.admin-form-grid label { display:grid; gap:7px; color:#40576b; font-size:12px; font-weight:750; }
.admin-form-grid label>small { color:#8092a1; font-weight:500; }
.admin-form-grid .wide { grid-column:1/-1; }
.admin-form-grid input,.admin-form-grid textarea { width:100%; padding:11px 12px; border:1px solid #cbd8e2; border-radius:2px; background:white; color:#20384d; font:inherit; }
.admin-form-grid textarea { resize:vertical; }
.content-editor { min-height:300px; line-height:1.6; }
.admin-upload { padding:16px; border:1px dashed #b9cad7; display:grid; grid-template-columns:1fr auto; gap:12px; align-items:end; background:#f8fafb; }
.admin-upload img { grid-column:1/-1; max-width:240px; max-height:150px; object-fit:contain; background:white; }
.upload-button { min-height:42px; padding:10px 14px; display:grid!important; place-items:center; background:#1766a7; color:white!important; cursor:pointer; }
.upload-button input { display:none; }
.admin-seo { padding:18px; display:grid; gap:15px; border-left:3px solid #1766a7; background:#f0f6fa; }
.admin-seo h3 { margin:0; color:var(--navy); }
.admin-site-editor { max-width:920px; }
.admin-account-panel { max-width:650px; border:1px solid #d5e1ea; background:white; box-shadow:0 10px 28px rgba(8,47,95,.06); }
.admin-account-fields { padding:26px; display:grid; gap:18px; }
.admin-account-fields>p { margin:0 0 4px; color:#617587; }
.admin-account-fields label { display:grid; gap:7px; color:#40576b; font-size:12px; font-weight:750; }
.admin-account-fields input { padding:12px; border:1px solid #cbd8e2; font:inherit; }
.admin-account-fields>small { color:#7c8e9d; }
.admin-account-fields button { width:max-content; padding:12px 18px; border:0; background:var(--navy); color:white; font-weight:800; cursor:pointer; }
.admin-denied { min-height:100vh; display:grid; place-content:center; text-align:center; background:#eef3f6; }
.admin-denied h1 { color:var(--navy); }
.admin-denied a { color:var(--blue); font-weight:800; }
.admin-login-page { min-height:100vh; display:grid; grid-template-columns:1.08fr .92fr; background:#f2f6f8; }
.admin-login-brand { padding:70px max(50px,calc((100vw - 1180px)/2)); display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(145deg,var(--navy-deep),var(--navy)); color:white; }
.admin-login-brand img { width:165px; filter:brightness(0) invert(1); }
.admin-login-brand span { color:#9fc7e9; font-size:12px; font-weight:800; letter-spacing:.16em; }
.admin-login-brand h1 { margin:14px 0 22px; font-size:clamp(46px,5vw,72px); line-height:1.02; letter-spacing:-.04em; }
.admin-login-brand p { max-width:520px; color:#c8d9e8; font-size:17px; }
.admin-login-panel { padding:50px; display:grid; place-items:center; }
.admin-login-panel form { width:min(430px,100%); padding:42px; border-top:4px solid #b33b4d; background:white; box-shadow:0 18px 52px rgba(8,47,95,.13); }
.admin-login-panel form>small { color:#b33b4d; font-size:10px; font-weight:800; letter-spacing:.15em; }
.admin-login-panel h2 { margin:8px 0 10px; color:var(--navy); font-size:32px; }
.admin-login-panel form>p { margin:0 0 26px; color:#627687; }
.admin-login-panel label { margin-top:16px; display:grid; gap:7px; color:#40576b; font-size:12px; font-weight:750; }
.admin-login-panel input { width:100%; padding:13px; border:1px solid #c6d4df; font:inherit; }
.admin-login-panel button { width:100%; margin-top:22px; padding:14px; border:0; background:var(--navy); color:white; font-weight:800; cursor:pointer; }
.password-help { margin:12px 0 0!important; font-size:12px; }
.admin-login-message,.admin-login-error { margin-top:16px; padding:11px 13px; background:#f9e9ec; color:#8d2f3e; font-size:13px; }
.back-home { display:block; margin-top:22px; color:#60788b; font-size:13px; text-align:center; }

.site-footer { position:relative; overflow:hidden; padding:58px max(34px,calc((100% - 1280px)/2)) 28px; background:linear-gradient(135deg,#101820 0%,var(--navy-deep) 48%,var(--navy) 100%); color:#d9e4ef; }
.site-footer::before { content:""; position:absolute; inset:0; opacity:.18; background:radial-gradient(circle at 34% 35%,rgba(169,200,230,.26) 0 1px,transparent 1px); background-size:18px 18px; mask-image:radial-gradient(circle at 45% 50%,black 0 34%,transparent 62%); pointer-events:none; }
.footer-inner { position:relative; z-index:1; display:grid; grid-template-columns:1.25fr .72fr .78fr 1.55fr; gap:36px; align-items:start; }
.footer-quick-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; }
.footer-quick-grid a { display:flex; align-items:center; justify-content:space-between; min-height:38px; padding:8px 14px; border:1px solid rgba(255,255,255,.22); color:#edf5ff; font-size:13px; font-weight:650; background:rgba(255,255,255,.035); }
.footer-quick-grid a:hover { border-color:var(--blue-light); color:white; background:rgba(255,255,255,.075); }
.footer-quick-grid span { color:#8fb9df; }
.footer-hotline { display:inline-flex; align-items:center; gap:10px; margin-top:20px; color:#f4b72a; font-size:20px; font-weight:800; letter-spacing:.02em; }
.footer-hotline span { font-size:21px; }
.footer-column h3,.footer-contact h3 { margin:0 0 15px; color:white; font-size:16px; }
.footer-column { display:grid; gap:10px; }
.footer-column a { color:#d9e4ef; font-size:14px; }
.footer-column a:hover { color:white; }
.footer-contact-list { margin:0; padding:0; list-style:none; display:grid; gap:8px; }
.footer-contact-list li { display:grid; grid-template-columns:20px 1fr; gap:10px; align-items:start; color:#d6e3ef; font-size:13px; line-height:1.55; }
.footer-contact-list li>span { color:#9fc4e6; font-size:15px; line-height:1.55; }
.footer-contact-list p { margin:0; }
.footer-contact-list b { color:#fff; font-weight:700; }
.footer-bottom { position:relative; z-index:1; margin-top:34px; padding-top:20px; border-top:1px solid rgba(255,255,255,.14); display:flex; justify-content:space-between; gap:18px; color:#9fb4c8; font-size:13px; }
.footer-bottom a { color:#edf5ff; font-weight:700; }

@media(max-width:980px) {
 .main-nav { overflow-x:auto; justify-content:flex-start; }
 .hero { grid-template-columns:1fr; gap:46px; }
  .hero-product { justify-content:center; }
  .hero-product-frame { width:min(100%,620px); }
  .hero-product-frame img { width:100%; margin-left:0; }
 .about,.message { grid-template-columns:1fr; gap:38px; }
 .about-overlay { background:rgba(214,231,244,.34); }
 .about-copy { max-width:760px; }
 .contact-layout { grid-template-columns:1fr; }
 .process-line { grid-template-columns:1fr; }
 .process-line ol { grid-template-columns:repeat(4,1fr); }
 .process-line li:not(:last-child)::after { display:none; }
 .news-list-grid { grid-template-columns:1fr 1fr; }
 .admin-shell { grid-template-columns:190px 1fr; }
 .admin-articles-layout { grid-template-columns:1fr; }
 .admin-article-list { max-height:360px; }
 .admin-login-page { grid-template-columns:1fr; }
 .admin-login-brand { min-height:400px; padding:50px; }
 .product-grid,.quality-grid { grid-template-columns:repeat(2,1fr); }
 .footer-inner { grid-template-columns:1fr 1fr; }
}
@media(max-width:640px) {
 .header-inner { width:calc(100% - 32px); min-height:86px; }
 .zhifa-logo img { width:135px; }
 .header-contact { gap:12px; }
 .whatsapp-link small,.whatsapp-link b { display:none; }
 .whatsapp-link span { width:23px; height:23px; font-size:12px; }
 .hotline small,.hotline span { display:none; }
 .hotline b { font-size:14px; }
 .hero { min-height:auto; padding:54px 22px; }
 .hero h1 { font-size:42px; }
 .hero-actions { flex-direction:column; }
 .hero-actions a { width:100%; }
 .about,.product-center,.quality,.news,.message,.contact-page,.process-page,.news-page { padding:66px 22px; }
 .about-copy { padding:22px 20px; }
 .product-grid { grid-template-columns:1fr 1fr; gap:32px 14px; }
 .product-item figcaption { font-size:14px; }
 .quality-grid,.news-cards { grid-template-columns:1fr; }
 .message form>div { grid-template-columns:1fr; }
 .contact-details,.contact-map-card { padding:24px 20px; }
 .contact-map-heading { align-items:start; flex-direction:column; }
 .contact-map-card iframe { min-height:400px; }
 .process-line ol { grid-template-columns:1fr 1fr; gap:12px; padding:16px; }
 .process-note { flex-direction:column; }
 .news-list-grid { grid-template-columns:1fr; }
 .article-page { width:calc(100% - 36px); padding-top:34px; }
 .article-cta { align-items:flex-start; flex-direction:column; }
 .admin-shell { display:block; }
 .admin-sidebar { position:static; width:100%; height:auto; }
 .admin-sidebar nav { grid-template-columns:1fr 1fr; }
 .admin-view-site { margin-top:22px; }
 .admin-main { padding:20px 14px; }
 .admin-form-grid { grid-template-columns:1fr; }
 .admin-form-grid>* { grid-column:1!important; }
 .admin-upload { grid-template-columns:1fr; }
 .admin-login-brand { min-height:330px; padding:36px 24px; }
 .admin-login-panel { padding:28px 18px; }
 .admin-login-panel form { padding:30px 24px; }
 .site-footer { padding:44px 22px 26px; }
 .footer-inner { grid-template-columns:1fr; gap:26px; }
 .footer-contact { grid-column:auto; }
 .footer-bottom { flex-direction:column; }
}