/*
 * 联系我们页 —— 在旧站版式基础上的现代化微调
 *
 * 基础版式（.contact_banner / .contact_detail / .contact_box1-4）来自 index.css，
 * 这里做四件事：
 * 1. 板块标题由 div 换成 h2 后修正 UA 默认外边距；
 * 2. 留言表单由旧的 table + 图片验证码，换成语义化 HTML5 表单（标签 + 输入框）；
 * 3. 地图区块：高德地图按需加载；未配置 Key 时显示可用的地址卡片兜底；
 * 4. 浅色描边、圆角等现代细节，尊重系统减少动态设置。
 */

/* ---- 标题：h2 替代旧站 div.tit，去掉 UA 外边距 ----
   注意：必须同时取消旧站 CSS 里的 float:left——标题浮动时，紧随其后的
   flex 表单行会被挤到标题右侧、输入框压缩（flex 容器遇到浮动会收窄） */
.contact_box1 .tit,
.contact_box2 .tit {
	float: none;
	margin: 0 0 10px;
	font-weight: normal;
}

/* ---- 联系人信息 ---- */
.contact_box1 .contact_info {
	font-size: 16px;
	line-height: 32px;
}
.contact_box1 .contact_info p {
	margin: 0 0 12px;
}
.contact_box1 .contact_info hr {
	border: 0;
	border-top: 1px solid #e2e2e2;
	margin: 14px 0;
}

/* ---- 留言表单 ---- */

/* 旧站把留言区固定成 480px 高 + overflow:hidden。
   这里保留同样的视觉高度，但改成「最小高度」：
   不同缩放/字体下表单更高时不会被裁掉（提交按钮不会被切）。 */
.contact_box2 {
	height: auto;
	min-height: 480px;
	overflow: visible;
}

.milim-form {
	margin: 0;
	font-size: 14px;
	line-height: 22px;
}

.milim-form .mf-row {
	display: flex;
	align-items: flex-start;
	margin-bottom: 8px;
}

.milim-form .mf-label {
	flex: 0 0 84px;
	width: 84px;
	padding-right: 8px;
	text-align: right;
	line-height: 30px;
	color: #333;
}

.milim-form .mf-field {
	flex: 1 1 auto;
	min-width: 0;
}

.milim-form input[type="text"],
.milim-form input[type="tel"],
.milim-form input[type="email"],
.milim-form textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 5px 8px;
	border: 1px solid #ccc;
	border-radius: 3px;
	background: #fff;
	color: #333;
	font-family: inherit;
	font-size: 14px;
	line-height: 20px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.milim-form input:focus,
.milim-form textarea:focus {
	border-color: #da251c;
	box-shadow: 0 0 0 2px rgba(218, 37, 28, 0.12);
	outline: none;
}

.milim-form textarea {
	height: 130px;
	resize: vertical;
}

.milim-form .mf-req {
	margin-left: 4px;
	color: #e60012;
}

.milim-form .mf-cap {
	display: flex;
	align-items: center;
}

.milim-form .mf-cap input {
	width: 76px;
	flex: 0 0 76px;
}

.milim-form .mf-cap span {
	margin-left: 8px;
	color: #666;
}

.milim-form .mf-actions {
	display: flex;
	gap: 25px;
	margin: 14px 0 0 92px;
}

.milim-form button {
	width: 111px;
	height: 33px;
	padding: 0;
	border: 0;
	border-radius: 2px;
	font-family: "微软雅黑", "Microsoft YaHei", sans-serif;
	font-size: 16px;
	line-height: 33px;
	cursor: pointer;
	transition: filter 0.2s ease;
}

.milim-form button:hover {
	filter: brightness(0.94);
}

.milim-form .mf-submit {
	background-color: #da251c;
	color: #fff;
}

.milim-form .mf-reset {
	background-color: #e2e2e2;
	color: #da251c;
}

/* 蜜罐字段：对真人不可见，对自动填表机器人可见 */
.milim-form .mf-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* 提交结果提示 */
.mf-notice {
	margin: 0 0 12px;
	padding: 8px 12px;
	border-radius: 3px;
	font-size: 14px;
	line-height: 22px;
}
.mf-notice.is-ok {
	border: 1px solid #b7dfb9;
	background: #f1faf1;
	color: #256a29;
}
.mf-notice.is-err {
	border: 1px solid #f0b9b4;
	background: #fdf3f2;
	color: #b32a20;
}

/* ---- 交通路线（沿用旧站底图） ---- */
.contact_box3 .con {
	font-size: 20px;
}

/* ---- 地图 ---- */
.milim-map {
	position: relative;
	/* 与旧站一致：996px 内容宽 + 左右各 2px 边框 = 1000px */
	width: 996px;
	height: 500px;
	margin-top: 30px;
	border: #e2e2e2 solid 2px;
	background: #f7f7f7;
	overflow: hidden;
}
.milim-map img {
	max-width: none;
}

/* 未配置高德 Key 时的兜底卡片 */
.milim-map-fallback {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 0 60px;
	box-sizing: border-box;
	text-align: center;
	color: #444;
}
.milim-map-fallback .mmf-tit {
	margin: 0 0 14px;
	font-size: 22px;
	color: #d7190b;
}
.milim-map-fallback .mmf-addr {
	margin: 0 0 6px;
	font-size: 16px;
	line-height: 30px;
}
.milim-map-fallback .mmf-tel {
	margin: 0 0 20px;
	font-size: 16px;
	line-height: 30px;
}
.milim-map-fallback .mmf-btns {
	display: flex;
	gap: 16px;
}
.milim-map-fallback a,
.milim-map-fallback button {
	display: inline-block;
	min-width: 148px;
	height: 36px;
	padding: 0 18px;
	border: 1px solid #da251c;
	border-radius: 3px;
	background: #da251c;
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	line-height: 34px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-sizing: border-box;
}
.milim-map-fallback button {
	border-color: #ccc;
	background: #fff;
	color: #da251c;
}
.milim-map-fallback a:hover,
.milim-map-fallback button:hover {
	filter: brightness(0.95);
}
.milim-map-fallback .mmf-hint {
	margin: 18px 0 0;
	font-size: 13px;
	color: #999;
}

/* 高德地图自带的版权/标识不参与主题图片样式 */
.milim-map .amap-logo,
.milim-map .amap-copyright {
	max-width: none;
}

/* ---- 信息窗口内容（默认展开，固定宽度避免位置靠边时被挤成细长条） ---- */
.milim-iw {
	width: 250px;
	font-size: 13px;
	line-height: 22px;
	color: #333;
	padding: 2px 2px 0;
	box-sizing: border-box;
}
.milim-iw .milim-iw-tit {
	display: block;
	margin-bottom: 3px;
	font-size: 14px;
	color: #d7190b;
}

/* ---- 「回到公司位置」按钮 ----
   常显。位置在高德缩放控件（右上）下方，不遮挡 +/- 按钮。 */
.milim-locate {
	position: absolute;
	top: 86px;
	right: 10px;
	z-index: 170;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 1px solid #d5d5d5;
	border-radius: 50%;
	background: #fff;
	color: #555;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}
.milim-locate:hover {
	color: #da251c;
	border-color: #da251c;
}
.milim-locate:focus-visible {
	outline: 2px solid #da251c;
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.milim-form input,
	.milim-form textarea,
	.milim-form button,
	.milim-locate {
		transition: none;
	}
}
