/* ===== header 导航字体锁定（原 app.blade.php head 内联）===== */ /* 固定 header 导航字体，消除加载期字体闪烁。 根因：站点混用 ox 主题 / Elementor / Bootstrap，各自都有同等优先级的 body{font-family} 与 a{font-family:var(--unbounded)} 规则； 详情页有 54 个外部 CSS 陆续到达，按源顺序反复覆盖，header 文字（继承 body）在 H-Bold ↔ Unbounded ↔ Poppins 间来回切换。 此内联规则在 首屏即生效，.header 作用域优先级高于裸 a{}/body{}，仅锁定 header 导航、不影响 Elementor 内容字体。 */ .header a, .header .nav a, .header .maex_nav a, .header .Mnav a, .header .Mnav_link { font-family: "H-Bold", sans-serif !important; } /* ===== fixed header 补偿（原 app.blade.php body 内联）===== */ /* 全局修复 fixed header 导致的内容遮挡问题 */ /* 使用更紧凑的间距，仅够覆盖导航栏 */ :root { --header-height-desktop: 4.5rem; /* 72px - 导航栏高度 */ --header-height-tablet: 3.5rem; /* 56px - 平板 */ --header-height-mobile: 3rem; /* 48px - 移动端导航栏 */ } body { padding-top: 0; transition: padding-top 0.3s ease; } /* Header 容器优化 */ .header { transition: all 0.3s ease; } /* Warning 条平滑隐藏 */ .header-warning { transition: all 0.3s ease; overflow: hidden; } /* 为主要内容区域添加顶部间距 - 极致紧凑 */ .wrapper { padding-top: 4rem; /* 64px - 比导航栏小 8px，更紧凑 */ transition: padding-top 0.3s ease; } /* 平板适配 */ @media (min-width: 769px) and (max-width: 1024px) { .wrapper { padding-top: 3rem; /* 48px - 极致紧凑 */ } } /* 移动端调整 - 无顶部间距 */ @media (max-width: 768px) { .wrapper { padding-top: 0; } } /* 小屏手机优化 */ @media (max-width: 480px) { .wrapper { padding-top: 0; } } /* 特殊页面：首页已有 margin-top，需要覆盖 */ #shopify-section-home { margin-top: 0 !important; } /* ===== 菜单徽章（原 header.blade.php 内联）===== */ .mp_new2 { color: #fff; font-size: .875rem; top: .5rem; right: 0.5rem; height: 1.6rem; width: 4rem; text-align: center; line-height: 1.6rem; border-radius: 2rem; background: #e60012; } /* ===== 菜单徽章（原 header.blade.php 内联）===== */ /* 必须用 .mp_img 后代选择器提权：header﹖v=*.css 在 body 中晚于本文件加载， 其 .mp_new{color:#e60012} 同优先级按序覆盖，会导致红字落在红底上不可见 */ .mp_img .mp_new { color: #fff; font-size: .875rem; top: .5rem; right: 0.5rem; height: 1.6rem; width: 4rem; text-align: center; line-height: 1.6rem; border-radius: 2rem; background: #e60012; } /* ===== HIGH-TECH 菜单图与移动端间距（原 header.blade.php 内联）===== */ .dropdown-content img { max-width: 100px !important; max-height: 80px !important; width: auto !important; height: auto !important; image-rendering: crisp-edges; /*background: #ffffff; !* 纯白背景 *!*/ /*padding: 15px; !* 内边距给商标呼吸空间 *!*/ /*border: 1px solid #e5e5e5; !* 细边框 *!*/ /*border-radius: 8px; !* 现代化圆角 *!*/ /*box-shadow: 0 2px 8px rgba(0,0,0,0.08); !* 轻微阴影 *!*/ object-fit: contain; object-position: center; } .dropdown-content img:hover { transform: scale(1.05); /* 轻微放大 */ } /* 移动端图片间距优化 - 符合国际审美 */ @media (max-width: 768px) { /* HIGH-TECH 菜单下的链接间距 */ .Mnav_link>a { display: block; margin: 24px 0; } .Mnav_link>a:first-child { margin-top: 12px; } .Mnav_link>a:last-child { margin-bottom: 12px; } } /* 小屏幕微调 */ @media (max-width: 480px) { .Mnav_link>a { margin: 22px 0; } .Mnav_link>a:first-child { margin-top: 10px; } .Mnav_link>a:last-child { margin-bottom: 10px; } } /* 超小屏幕 */ @media (max-width: 375px) { .Mnav_link>a { margin: 20px 0; } .Mnav_link>a:first-child { margin-top: 8px; } .Mnav_link>a:last-child { margin-bottom: 8px; } } /* ===== 订阅按钮（原 footer.blade.php 内联）===== */ .fir1_rightN { height: 3rem; width: 60%; text-align: center; line-height: 3rem; background: #e60031; width: 9rem; color: #fff; font-size: .9375rem; border-radius: 2rem; cursor: pointer; margin-top: 1rem; } /* ===== WhatsApp 卡片（原 footer.blade.php 内联）===== */ .footer_whatsapp{ display:flex; align-items:center; gap:1.25rem; margin:2rem 0; padding:1.1rem 1.4rem; width:max-content; max-width:100%; background:rgba(255,255,255,.05); border:.1rem solid #666; border-radius:1rem; color:#fff; transition:border-color .3s; box-sizing:border-box; } .footer_whatsapp:hover{ border-color:#44d62c; } .footer_whatsapp .fw_qr{ width:7.5rem; height:7.5rem; flex-shrink:0; background:#fff; padding:.35rem; border-radius:.5rem; box-sizing:border-box; } .footer_whatsapp .fw_info{ display:flex; flex-direction:column; } .footer_whatsapp .fw_title{ font-family:H-Bold; font-size:1.3rem; color:#44d62c; } .footer_whatsapp .fw_num{ font-size:1rem; margin-top:.4rem; font-family:H-Medium; } .footer_whatsapp .fw_tip{ font-size:.8125rem; color:#bbb; margin-top:.45rem; max-width:18rem; line-height:1.4; } @media (max-width:750px){ .footer_whatsapp{ width:100%; gap:.9rem; padding:.9rem 1rem; margin:1.5rem 0; } .footer_whatsapp .fw_qr{ width:5rem; height:5rem; padding:.3rem; } .footer_whatsapp .fw_title{ font-size:1.1rem; } .footer_whatsapp .fw_num{ font-size:.875rem; } .footer_whatsapp .fw_tip{ font-size:.72rem; margin-top:.35rem; } } /* ===== Elementor gallery 修复（原 footer.blade.php 内联）===== */ .elementor-widget-gallery .elementor-gallery__container { display: grid !important; grid-template-columns: repeat(var(--gallery-columns, 4), 1fr); gap: 10px; } @media (max-width: 1024px) { .elementor-widget-gallery .elementor-gallery__container { grid-template-columns: repeat(2, 1fr) !important; } } @media (max-width: 768px) { .elementor-widget-gallery .elementor-gallery__container { grid-template-columns: 1fr !important; } } .elementor-widget-gallery .e-gallery-item { display: block; } .elementor-widget-gallery .e-gallery-image { width: 100%; min-height: 200px; padding-bottom: 100%; background-size: cover !important; background-position: center !important; } /* ===== 首页专属（原 index.blade.php @push 内联）===== */ .home-explore-btn[data-v-ddd11e78]:hover { border-radius: 3rem } /* ===== 懒加载尺寸占位 ===== data-ar 标记的图片：width/height 属性仅用于推导宽高比， 实际高度自适应，避免图片加载前后的布局跳动(CLS) */ img[data-ar] { height: auto; }