/* WANHUI: the only active stylesheet. Edit this file directly. */

/* ==================== 01. Shared layout and homepage ==================== */
:root{--navy:#09266f;--blue:#0063ff;--green:#00a165;--ink:#10264e;--muted:#7d8aa0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7fbff;color:var(--ink);font-family:'Microsoft YaHei','PingFang SC',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}svg{display:block}.container{width:1400px;max-width:calc(100% - 64px);margin:0 auto}.icon{width:24px;height:24px;flex-shrink:0}.photo{overflow:hidden}.topbar{height:90px;background:white}.topbar .container{display:flex;align-items:center;justify-content:space-between;height:100%;gap:40px}.brand{display:flex;align-items:center;gap:13px;flex-shrink:0}.brand-mark{width:58px;height:58px;border-radius:50%;background-color:white}.brand strong{display:block;font-size:27px;color:var(--navy);letter-spacing:.5px}.brand small{font-size:7.8px;letter-spacing:.05px;color:var(--navy);display:block;margin-top:5px}.navigation{display:flex;align-items:center;gap:28px;font-size:15px;font-weight:700;height:100%}.navigation .nav-link{height:100%;display:flex;align-items:center;position:relative;white-space:nowrap}.navigation .nav-link.active{color:var(--green)}.navigation .nav-link.active:after{content:'';position:absolute;bottom:21px;left:0;width:100%;height:3px;background:var(--green)}
.hero{height:600px;position:relative;overflow:hidden;background:linear-gradient(135deg,#edf9ff 2%,#afdfff 62%,#8ecefb)}.hero-art{position:absolute;top:0;right:0;width:1370px;height:600px}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#ebf8ff 4%,#eaf8ff 22%,#e5f5ffed 30%,#e5f5ff8c 43%,transparent 65%)}.hero .container{height:100%;position:relative;z-index:1;display:flex;align-items:center}.hero-copy{padding-bottom:30px}.eyebrow{font-size:20px;letter-spacing:9px;font-weight:700;color:var(--navy);margin:0 0 25px}.hero h1{font-size:60px;line-height:1.24;letter-spacing:1px;margin:0;color:#082568;font-weight:900}.hero h1 em{color:#008857;font-style:normal}.hero-desc{font-size:18px;line-height:1.9;color:#3d5575;margin:26px 0 30px;max-width:670px}.hero-actions{display:flex;gap:20px}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;background:linear-gradient(110deg,#00b271,#009758);border-radius:7px;color:#fff;padding:17px 28px;font-size:17px;font-weight:700;box-shadow:0 8px 22px #009b6120}.button.secondary{background:#fff;color:var(--navy);border:1px solid #a5c6f4;box-shadow:none}.button.secondary .icon{border:1px solid #b5d2ff;border-radius:50%;padding:4px;color:var(--blue);width:27px;height:27px}
.stats{position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);height:140px;background:linear-gradient(160deg,#fff,#f5faff);border:1px solid #fff;border-radius:12px;box-shadow:0 12px 40px #035bac0b;margin-top:-52px;margin-bottom:12px}.stat{display:flex;align-items:center;justify-content:center;gap:24px;position:relative}.stat:not(:last-child):after{content:'';height:70px;width:1px;background:#d9e6f5;position:absolute;right:0}.stat>.icon{width:52px;height:52px;color:var(--blue);stroke-width:1.45}.stat strong{font-size:38px;line-height:1;display:block;color:var(--navy);letter-spacing:-1px}.stat b{display:block;font-size:17px;margin:6px 0}.stat small{font-size:13px;color:var(--muted)}
main{background:radial-gradient(ellipse at -20% 22%,#e3f4ff 0%,transparent 50%),radial-gradient(ellipse at 115% 67%,#e9f5ff 0%,transparent 50%),#f9fcff}.section{padding-top:48px}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.section-head h2{margin:0;font-size:34px;line-height:1.3;color:var(--navy);position:relative;font-weight:800}.section-head h2:after{content:'';position:absolute;bottom:-10px;left:0;width:37px;height:3px;background:var(--green)}.section-head h2 span{font-size:12px;letter-spacing:.4px;color:#8492a6;font-weight:500;margin-left:24px}.more{color:var(--blue);font-size:14px;font-weight:700;display:flex;gap:12px;align-items:center}.more .icon{width:19px;height:19px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{overflow:hidden;border-radius:9px;background:#fff;box-shadow:0 8px 23px #25579807}.product-photo{height:180px}.card-body{position:relative;padding:20px 23px 21px}.card h3{font-size:21px;line-height:1.4;margin:0 0 8px;color:var(--navy)}.card p{font-size:14px;line-height:1.7;color:#8791a2;margin:0}.circle-arrow{width:35px;height:35px;border:1px solid #c6dcff;border-radius:50%;color:var(--blue);display:grid;place-items:center;position:absolute;right:21px;top:41px}.circle-arrow .icon{width:18px;height:18px}.product .card-body{padding-right:59px}.solution-photo{height:160px}.solution .card-body{display:flex;align-items:flex-start;gap:15px;padding:20px 20px 24px}.solution .card-body>.icon{width:32px;height:32px;color:var(--blue);margin-top:3px}.solution:nth-child(2) .card-body>.icon,.solution:nth-child(3) .card-body>.icon{color:var(--green)}.solution h3{font-size:21px;margin:0 0 5px}.solution p{font-size:13px}.solution .circle-arrow{width:29px;height:29px;right:15px;top:22px}.solution .circle-arrow .icon{width:16px;height:16px}
.about-layout{display:grid;grid-template-columns:650px 1fr;gap:46px;align-items:stretch}.about-image{height:310px;border-radius:9px}.about-copy{padding:5px 0 0}.about-copy>p{font-size:17px;line-height:1.95;margin:0;color:#727f95;text-align:justify}.about-points{display:grid;grid-template-columns:repeat(4,1fr);margin-top:32px}.about-point{text-align:center;border-left:1px solid #e3ebf7}.about-point:first-child{border-left:none}.medallion{width:63px;height:63px;border-radius:50%;background:linear-gradient(140deg,#07b77b,#007052);display:grid;place-items:center;margin:0 auto 13px;color:#fff;box-shadow:inset 0 0 0 4px #ffffff13}.medallion .icon{width:29px;height:29px;stroke-width:1.8}.about-point:nth-child(2) .medallion,.about-point:nth-child(3) .medallion{background:linear-gradient(140deg,#0086ff,#0035d1)}.about-point b{font-size:16px;color:var(--navy);display:block;margin-bottom:6px}.about-point small{font-size:13px;color:#8996a9}
.manufacture-card{height:218px;position:relative;border-radius:9px;overflow:hidden}.manufacture-card>.photo{height:100%}.manufacture-card:after{position:absolute;content:'';inset:25% 0 0;background:linear-gradient(transparent,#081821df)}.manufacture-label{position:absolute;bottom:20px;left:24px;right:24px;z-index:1;color:white}.manufacture-label h3{font-size:23px;margin:0 0 7px}.manufacture-label p{font-size:13px;color:#d3dce7;margin:0}.play{position:absolute;right:0;bottom:5px;width:42px;height:42px;border:1.5px solid white;border-radius:50%;display:grid;place-items:center}.play .icon{width:21px;height:21px}.case-photo{height:155px}.case .card-body{padding:18px 23px 22px}.case h3{font-size:21px}.case .circle-arrow{top:25px}.advantage{padding:24px 22px;display:flex;gap:20px;align-items:center;border-radius:8px;background:white;box-shadow:0 8px 23px #25579807}.advantage .medallion{width:70px;height:70px;margin:0;flex-shrink:0}.advantage:nth-child(even) .medallion{background:linear-gradient(140deg,#0086ff,#0035d1)}.advantage h3{font-size:19px;color:var(--navy);margin:0 0 7px}.advantage p{font-size:14px;color:#8995a7;margin:0;line-height:1.7}
.news-section{padding-bottom:48px}.news-card{display:flex;padding:10px;gap:18px;height:137px}.news-photo{width:132px;min-width:132px;height:117px;border-radius:5px}.news-copy{padding:7px 4px 0 0}.news-copy h3{font-size:17px;line-height:1.5;margin:0 0 9px}.news-copy p{font-size:13px;line-height:1.6}.news-tag{color:#7c90a8;font-size:11px;letter-spacing:1px;display:block;margin-bottom:6px}
.contact-banner{background:linear-gradient(100deg,#e4f3ff,#e0f4f4 55%,#d7f0e9);position:relative;overflow:hidden}.contact-banner:after{content:'';position:absolute;width:800px;height:800px;border:100px solid #b9dbd529;border-radius:50%;right:-120px;top:-570px}.contact-banner .container{height:165px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}.contact-banner h2{font-size:32px;letter-spacing:3px;color:var(--navy);margin:0 0 12px}.contact-banner p{font-size:16px;letter-spacing:4px;color:#52758a;margin:0}.contact-banner .button{border-radius:30px;padding:19px 33px;font-size:17px}
.footer{background:#122b43;color:#d3e0ec}.footer-top{padding:38px 0 29px;display:grid;grid-template-columns:415px 1fr 150px;gap:35px;align-items:center}.footer .brand-mark{width:49px;height:49px}.footer .brand strong{font-size:23px;color:#fff}.footer .brand small{font-size:6.6px;color:#b8cbdc}.footer-links{display:flex;gap:23px;font-size:13px;justify-content:center;margin-bottom:19px}.footer-note{color:#829bb1;font-size:12px;text-align:center;letter-spacing:2px}.footer-contact{border-left:1px solid #ffffff20;display:flex;align-items:center;justify-content:flex-end;gap:12px;font-size:14px}.footer-contact .icon{width:33px;height:33px}.copyright{border-top:1px solid #ffffff12;text-align:center;padding:18px 0;color:#7e95a9;font-size:11px;letter-spacing:1px}.design-note{position:absolute;width:1px;height:1px;overflow:hidden}
@media(max-width:1250px){.navigation{gap:14px;font-size:12px}.brand strong{font-size:20px}.brand small{font-size:6px}.about-layout{grid-template-columns:1fr 1fr;gap:26px}.about-copy>p{font-size:15px}.about-point b{font-size:13px}.grid4,.grid3{gap:18px}.advantage{gap:12px;padding:18px 12px}.advantage h3{font-size:15px}.advantage .medallion{width:52px;height:52px}.advantage p{font-size:12px}.news-photo{width:95px;min-width:95px}.news-copy h3{font-size:14px}.solution p{font-size:11px}.footer-top{grid-template-columns:310px 1fr}.footer-contact{display:none}.footer-links{gap:12px}.hero h1{font-size:52px}}@media(max-width:900px){.container{max-width:calc(100% - 36px)}.navigation{display:none}.topbar{height:76px}.hero{height:520px}.hero h1{font-size:40px}.hero-art{opacity:.55}.hero-desc{font-size:15px;max-width:90%}.eyebrow{font-size:15px;letter-spacing:5px}.hero:after{background:linear-gradient(90deg,#ebf8fff0,#eaf8ff80)}.stats{height:auto;grid-template-columns:repeat(2,1fr);padding:15px 0;margin-top:-30px}.stat{padding:20px 10px;gap:15px}.stat>.icon{width:35px;height:35px}.stat strong{font-size:30px}.stat b{font-size:14px}.stat small{font-size:11px}.stat:not(:last-child):after{display:none}.grid4,.grid3{grid-template-columns:repeat(2,1fr)}.section-head h2{font-size:27px}.section-head h2 span{font-size:9px;margin-left:12px}.more{font-size:11px}.about-layout{grid-template-columns:1fr}.about-image{height:320px}.about-points{margin-bottom:6px}.news-section .grid3{grid-template-columns:1fr}.news-photo{width:132px;min-width:132px}.news-copy h3{font-size:17px}.contact-banner .container{height:auto;padding:32px 0;gap:20px;flex-direction:column;align-items:flex-start}.contact-banner h2{font-size:24px}.contact-banner p{font-size:13px}.footer-top{grid-template-columns:1fr;justify-items:center;gap:25px}.section{padding-top:38px}.solution .circle-arrow{display:none}.card h3{font-size:18px}.card p{font-size:12px}.product-photo{height:145px}.solution-photo{height:125px}.advantage .medallion{width:50px;height:50px}.hero-actions{gap:12px}.button{font-size:14px;padding:14px 18px}}
/* Reference-led homepage: editable wordmark, separate navigation and image-only hero. */
:root { --navy: #062656; --blue: #0068d9; --green: #00975a; --muted: #74849a; }
body { background: #f6faff; }
section[id], footer[id] { scroll-margin-top: 24px; }
.asset-definitions { position: absolute; overflow: hidden; pointer-events: none; }
.photo { background-image: none; position: relative; }
.photo > svg { display: block; width: 100%; height: 100%; }
.brand-mark { display: block; object-fit: contain; flex-shrink: 0; border-radius: 0; background: transparent; }
.topbar { position: relative; z-index: 20; height: auto; background: #fff; }
.topbar .brand-row { height: 132px; gap: 36px; }
.topbar .brand { gap: 25px; min-width: 0; }
.topbar .brand-mark { width: 91px; height: 77px; }
.topbar .brand strong { font-size: 35px; line-height: 1.4; letter-spacing: .5px; color: #062b67; white-space: nowrap; }
.topbar .brand small { font-size: 10.6px; letter-spacing: .08px; line-height: 1.5; color: #6c788b; margin-top: 3px; }
.header-actions { display: flex; align-items: center; gap: 28px; flex-shrink: 0; }
.hotline { display: flex; align-items: center; gap: 16px; }
.hotline > .icon { width: 36px; height: 36px; color: #009452; stroke-width: 1.75; }
.hotline small { display: block; font-size: 13px; color: #798398; margin-bottom: 6px; }
.hotline strong { display: block; color: #008f4a; font-family: Arial, 'Microsoft YaHei', sans-serif; font-size: 27px; font-weight: 700; letter-spacing: -.4px; white-space: nowrap; }
.header-divider { width: 1px; height: 35px; background: #d8e1e8; }
.header-actions .header-quote { min-height: 58px; padding: 15px 25px; border-radius: 32px; gap: 15px; box-shadow: 0 9px 27px #00965919; font-size: 17px; }
.header-quote > .icon { width: 23px; height: 23px; }
.menu-toggle { display: none; }
.nav-shell { position: relative; isolation: isolate; height: 72px; background: linear-gradient(108deg, #075c94 0%, #063a72 17%, #06295f 50%, #004870 80%, #008675 116%); border-bottom: 1px solid #45cbea; border-radius: 0; box-shadow: 0 8px 19px #093d681c; overflow: visible; }
.nav-shell::before { content: ''; position: absolute; z-index: -1; width: 360px; height: 72px; left: 0; top: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 72'%3E%3Cdefs%3E%3ClinearGradient id='g' x2='1' y2='1'%3E%3Cstop stop-color='%234bd7de' stop-opacity='.48'/%3E%3Cstop offset='1' stop-color='%230bb991' stop-opacity='.08'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 0C44 43 108 29 164 47S221 76 280 80H0Z' fill='url(%23g)'/%3E%3Cpath d='M0 0C44 43 108 29 164 47S221 76 280 80' fill='none' stroke='%238cffff' stroke-opacity='.18'/%3E%3Cpath d='M0 35C56 65 94 42 161 64L194 80H0Z' fill='%2326c59c' opacity='.13'/%3E%3C/svg%3E") left top / 360px 72px no-repeat; pointer-events: none; }
.nav-shell::after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 97% 0%, #00b18e35, transparent 30%); pointer-events: none; }
.topbar .nav-shell .container { position: relative; height: 72px; gap: 0; }
.navigation { display: grid; grid-template-columns: repeat(8, 1fr); width: 100%; height: 100%; gap: 0; font-size: 20px; font-weight: 600; color: #fff; }
.navigation .nav-link { justify-content: center; letter-spacing: .5px; transition: color .18s ease, background .18s ease; }
.nav-shell .navigation .nav-link::after { content: ''; position: absolute; width: 31px; height: 3px; border-radius: 2px; bottom: 10px; left: 50%; background: #00e68b; transform: translateX(-50%) scaleX(0); transition: transform .2s ease; }
.nav-shell .navigation .nav-link.active, .nav-shell .navigation .nav-link:hover { color: #1de994; background: #ffffff04; }
.nav-shell .navigation .nav-link.active::after, .nav-shell .navigation .nav-link:hover::after { bottom: 10px; left: 50%; width: 31px; transform: translateX(-50%) scaleX(1); }
.navigation .nav-link:focus-visible, .menu-toggle:focus-visible, .button:focus-visible, .hotline:focus-visible { outline: 2px solid #0bbbe9; outline-offset: -4px; }

/* Product disclosure: a full-width panel within the 1400px navigation container. */
.nav-products { height: 100%; min-width: 0; }
.product-menu-trigger { width: 100%; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; gap: 9px; }
.nav-chevron { width: 16px; height: 16px; transition: transform .2s ease; }
.nav-products.is-open .nav-chevron { transform: rotate(180deg); }
.nav-shell .nav-products.is-open > .nav-link { color: #1de994; background: #ffffff08; }
.nav-shell .nav-products.is-open > .nav-link::after { transform: translateX(-50%) scaleX(1); }
.product-mega { position: absolute; z-index: 30; top: 100%; left: 0; right: 0; display: grid; grid-template-columns: 244px minmax(0, 1fr); color: #123052; background: #fff; border-top: 3px solid #00b777; border-radius: 0; box-shadow: 0 22px 48px #0728452e; text-align: left; animation: product-menu-in .18s ease-out; }
.product-mega[hidden] { display: none; }
.product-mega-intro { position: relative; overflow: hidden; padding: 30px 28px; background: radial-gradient(ellipse at 5% 100%, #00857180, transparent 70%), linear-gradient(145deg, #073f72, #082e52); color: #fff; }
.product-mega-intro::after { content: ''; position: absolute; width: 180px; height: 180px; right: -125px; bottom: -95px; border: 30px solid #63e4c518; border-radius: 50%; pointer-events: none; }
.product-mega-kicker { display: block; color: #7ee0c2; font-size: 10px; font-weight: 500; letter-spacing: 2.5px; }
.product-mega-intro h2 { margin: 15px 0 13px; font-size: 28px; font-weight: 600; line-height: 1.45; letter-spacing: 1px; }
.product-mega-intro p { margin: 0; font-size: 13px; font-weight: 400; line-height: 1.9; color: #b5ccdd; }
.product-mega .product-overview { display: inline-flex; align-items: center; gap: 18px; height: auto; margin-top: 23px; color: #fff; font-size: 13px; font-weight: 500; }
.product-overview .icon { width: 18px; height: 18px; color: #4aebb1; }
.product-overview:hover { color: #6ff2c4; }
.product-menu-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 28px; }
.product-menu-card { display: flex; align-items: center; gap: 15px; min-width: 0; padding: 20px 17px; background: #f6f9fc; border: 1px solid #e9eff4; transition: background .18s ease, border-color .18s ease, transform .18s ease; }
.product-menu-icon { display: grid; place-items: center; width: 48px; height: 52px; flex-shrink: 0; color: #086c97; background: #fff; border: 1px solid #e1eaf0; }
.product-menu-icon .icon { width: 31px; height: 31px; stroke-width: 1.4; }
.product-menu-copy { min-width: 0; }
.product-menu-copy strong { display: block; font-size: 18px; font-weight: 600; line-height: 1.5; color: #153658; }
.product-menu-copy small { display: block; margin-top: 8px; color: #8191a2; font-size: 12px; line-height: 1.6; font-weight: 400; }
.product-menu-arrow { width: 16px; height: 16px; margin-left: auto; color: #88a3b6; transition: transform .18s ease; }
.product-menu-card:hover { background: #f0faf6; border-color: #bddfce; transform: translateY(-2px); }
.product-menu-card:hover .product-menu-icon, .product-menu-card:hover strong, .product-menu-card:hover .product-menu-arrow { color: #008552; }
.product-menu-card:hover .product-menu-arrow { transform: translateX(3px); }
.product-mega a:focus-visible { outline: 2px solid #008b66; outline-offset: -3px; }
.product-mega-intro a:focus-visible { outline-color: #7ee0c2; }
.product[id] { scroll-margin-top: 24px; }
@keyframes product-menu-in { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }

.hero { height: 400px; background: #c2e6ff; }
.hero-art { position: absolute; display: block; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 1; }
.hero::after { background: linear-gradient(90deg, #f5fbfff2 0%, #f5fbffe0 30%, #f5fbff8c 45%, transparent 64%); pointer-events: none; }
.hero .container { align-items: center; }
.hero-copy { max-width: 760px; padding: 0; }
.hero h1 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 16px; font-size: 48px; line-height: 1.32; font-weight: 800; letter-spacing: 0; color: #052454; }
.hero-product-primary, .hero-product-secondary { white-space: nowrap; }
.hero-product-separator { color: #7c9ab1; font-size: .7em; font-weight: 400; }
.hero h1 em { display: block; flex-basis: 100%; color: #008e50; }
.hero-actions { margin-top: 26px; gap: 18px; }
.hero-actions .button { min-width: 210px; min-height: 50px; padding: 13px 26px; border-radius: 28px; font-size: 17px; font-weight: 600; gap: 25px; box-shadow: 0 10px 26px #008e5420; }
.button { background: linear-gradient(115deg, #00b867, #008344); transition: transform .2s ease, box-shadow .2s ease, filter .2s ease; }
.button:hover { transform: translateY(-2px); filter: brightness(1.045); box-shadow: 0 13px 27px #008e5429; }

/* Main page: consistent spacing, typography and undistorted image frames. */
main { background: radial-gradient(ellipse at -12% 10%, #eaf6ff, transparent 50%), radial-gradient(ellipse at 112% 60%, #edf7ff, transparent 48%), #f8fbff; }
.stats { margin-top: 0; margin-bottom: 0; height: 142px; border: 1px solid #e4eef7; border-radius: 12px; box-shadow: 0 10px 35px #16496e08; background: #fff; }
.stat { gap: 22px; }
.stat strong { font-size: 40px; font-family: Arial, 'Microsoft YaHei', sans-serif; }
.stat b { font-size: 17px; margin: 6px 0; }
.stat small { font-size: 12px; color: #8290a3; }
.stat:not(:last-child)::after { height: 62px; }
.section { padding-top: 84px; }
.section-head { margin-bottom: 30px; }
.section-head h2 { font-size: 33px; letter-spacing: .2px; }
.section-head h2 span { font-size: 11px; letter-spacing: 1px; margin-left: 20px; }
.section-head h2::after { width: 34px; bottom: -11px; height: 3px; border-radius: 2px; }
.more { font-size: 13px; color: #0066cd; gap: 10px; }
.card { border: 1px solid #e6eef5; border-radius: 10px; box-shadow: 0 7px 24px #103f7105; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.card:hover { transform: translateY(-4px); border-color: #c6dedf; box-shadow: 0 16px 35px #133f7010; }
.product-photo { height: 188px; }
.product-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.product-image-heads { object-position: right center; }
.product .card-body { padding: 23px 62px 24px 23px; }
.card h3 { font-size: 21px; font-weight: 700; letter-spacing: .1px; }
.card p { font-size: 14px; line-height: 1.8; color: #7c8b9f; }
.circle-arrow { width: 33px; height: 33px; border-color: #d7e5ef; color: #0570d4; transition: background .2s ease, color .2s ease; }
.card:hover .circle-arrow { background: #00975a; border-color: #00975a; color: #fff; }
.solution-photo { height: 167px; }
.solution .card-body { padding: 20px 46px 23px 20px; gap: 12px; }
.solution .card-body > .icon { width: 29px; height: 29px; }
.solution p { font-size: 12px; white-space: nowrap; }
.about-layout { gap: 48px; }
.about-image { height: 328px; border-radius: 10px; }
.about-image > img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% center; }
.about-copy { padding-top: 3px; }
.about-copy > p { font-size: 16px; line-height: 2; color: #697c92; }
.about-points { margin-top: 37px; }
.about-point b { font-size: 15px; }
.about-point small { font-size: 12px; }
.medallion { box-shadow: inset 0 0 0 4px #ffffff0a, 0 5px 16px #0064550b; }
.manufacture-card { height: 232px; border-radius: 10px; }
.manufacture-label { bottom: 23px; }
.manufacture-label h3 { font-size: 23px; }
.manufacture-label p { color: #dbe5ed; font-size: 13px; }
.manufacture-card::after { background: linear-gradient(transparent, #051b2be6); }
.case-photo { height: 174px; }
.case .card-body { padding: 20px 60px 24px 23px; }
.case h3 { font-size: 20px; }
.case .circle-arrow { top: 29px; }
.advantage { border: 1px solid #e8eff5; border-radius: 9px; padding: 24px 21px; gap: 17px; }
.advantage .medallion { width: 64px; height: 64px; }
.advantage h3 { font-size: 18px; }
.advantage p { font-size: 13px; color: #7b8a9d; }
.news-section { padding-bottom: 64px; }
.news-card { height: 151px; padding: 12px; gap: 16px; }
.news-photo { width: 133px; min-width: 133px; height: 125px; border-radius: 5px; }
.news-copy { padding: 5px 2px 0 0; }
.news-copy h3 { font-size: 16px; line-height: 1.55; margin-bottom: 8px; }
.news-copy p { font-size: 12px; line-height: 1.6; }
.news-tag { font-size: 10px; color: #9aa8b7; letter-spacing: .5px; }
.contact-banner { background: linear-gradient(105deg, #e4f2fb, #e5f4ef); }
.contact-banner .container { height: 178px; }
.contact-banner h2 { font-size: 31px; letter-spacing: 1px; }
.contact-banner p { letter-spacing: 2px; font-size: 15px; color: #6b8392; }
.contact-banner .button { border-radius: 32px; font-size: 16px; }
.footer { background: #102b42; }
.footer-top { grid-template-columns: 405px 1fr 230px; gap: 25px; padding: 42px 0 35px; }
.footer .brand { gap: 14px; }
.footer .brand-mark { width: 64px; height: 56px;  padding: 3px; border-radius: 3px; }
.footer .brand strong { font-size: 23px; }
.footer-links { gap: 21px; font-size: 12px; }
.footer-note { font-size: 11px; letter-spacing: 1px; }
.footer-contact { display: flex; gap: 14px; }
.footer-contact .icon { width: 28px; height: 28px; color: #66d2ac; }
.footer-contact small { display: block; color: #a5b8c8; font-size: 12px; margin-bottom: 7px; }
.footer-contact strong { font-family: Arial, sans-serif; font-size: 20px; color: #fff; white-space: nowrap; }
.copyright { padding: 21px 0; font-size: 11px; color: #8399ab; }

@media (max-width: 1450px) {
  .topbar .brand { gap: 19px; }
  .topbar .brand strong { font-size: 31px; }
  .topbar .brand small { font-size: 9.4px; }
  .topbar .brand-mark { width: 83px; height: 70px; }
  .header-actions { gap: 23px; }
  .hotline strong { font-size: 25px; }
  .header-actions .header-quote { padding: 15px 23px; gap: 12px; }
  .hero h1 { font-size: 46px; }
}
@media (max-width: 1250px) {
  .product-mega { grid-template-columns: 210px minmax(0, 1fr); }
  .product-mega-intro { padding: 27px 25px; }
  .product-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 21px; gap: 12px; }
  .product-menu-card { padding: 15px; }
  .product-menu-copy strong { font-size: 17px; }
  .topbar .brand-row { height: 112px; gap: 20px; }
  .topbar .brand strong { font-size: 27px; }
  .topbar .brand small { font-size: 8.2px; }
  .topbar .brand-mark { width: 73px; height: 62px; }
  .topbar .brand { gap: 15px; }
  .header-actions { gap: 20px; }
  .header-divider { display: none; }
  .hotline { gap: 12px; }
  .hotline strong { font-size: 23px; }
  .hotline > .icon { width: 30px; height: 30px; }
  .header-actions .header-quote { min-height: 51px; padding: 13px 20px; font-size: 15px; }
  .navigation { font-size: 18px; }
  .hero { height: 400px; }
  .hero h1 { font-size: 42px; }
  .hero-actions .button { min-height: 50px; font-size: 17px; }
  .about-layout { grid-template-columns: 1fr 1fr; gap: 30px; }
  .about-copy > p { font-size: 14px; }
  .about-point b { font-size: 13px; }
  .about-point small { font-size: 11px; }
  .solution p { white-space: normal; font-size: 11px; }
  .solution h3 { font-size: 19px; }
  .advantage { gap: 12px; padding: 20px 13px; }
  .advantage .medallion { width: 51px; height: 51px; }
  .advantage h3 { font-size: 15px; }
  .advantage p { font-size: 12px; }
  .news-photo { width: 103px; min-width: 103px; }
  .news-copy h3 { font-size: 14px; }
  .footer-top { grid-template-columns: 360px 1fr; }
  .footer-contact { display: none; }
  .footer-links { gap: 15px; }
}
@media (max-width: 1050px) and (min-width: 901px) {
  .topbar .brand strong { font-size: 24px; }
  .topbar .brand small { font-size: 7.3px; }
  .topbar .brand-mark { width: 66px; height: 56px; }
  .header-actions .header-quote { padding: 12px 16px; }
  .header-quote > .icon:first-child { display: none; }
  .hotline strong { font-size: 21px; }
  .hotline > .icon { width: 25px; height: 25px; }
  .hero h1 { font-size: 40px; }
}
@media (max-width: 900px) {
  .topbar .brand-row { height: 96px; gap: 16px; }
  .topbar .brand strong { font-size: 26px; }
  .topbar .brand small { font-size: 7.8px; }
  .topbar .brand-mark { width: 66px; height: 56px; }
  .header-actions { display: none; }
  .menu-toggle { display: inline-flex; justify-content: center; align-items: center; gap: 10px; font-size: 15px; padding: 12px 15px; border: 1px solid #d7e2ec; border-radius: 5px; background: #fff; color: #07335c; cursor: pointer; }
  .menu-toggle svg { width: 21px; height: 21px; }
  .nav-shell { display: none; position: absolute; left: 0; top: 100%; width: 100%; height: auto; max-height: calc(100dvh - 96px); overflow-y: auto; overscroll-behavior: contain; border-radius: 0; }
  .topbar.menu-open .nav-shell { display: block; }
  .topbar .nav-shell .container { height: auto; }
  .navigation { display: grid; grid-template-columns: repeat(4, 1fr); height: auto; padding: 14px 0 17px; }
  .navigation .nav-link { height: 52px; font-size: 17px; }
  .nav-products.is-open { grid-column: 1 / -1; }
  .product-mega { position: static; grid-template-columns: 1fr; box-shadow: none; animation: none; margin: 0 0 10px; }
  .product-mega-intro { display: none; }
  .product-menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 14px; gap: 10px; }
  .product-menu-card { gap: 10px; padding: 14px 10px; }
  .product-menu-icon { width: 33px; height: 40px; border: 0; background: transparent; }
  .product-menu-icon .icon { width: 28px; height: 28px; }
  .product-menu-copy strong { font-size: 15px; }
  .product-menu-copy small, .product-menu-arrow { display: none; }
  .nav-shell .navigation .nav-link::after, .nav-shell .navigation .nav-link.active::after, .nav-shell .navigation .nav-link:hover::after { bottom: 3px; }
  .hero { height: 400px; }
  .hero-art { object-position: 64% center; opacity: 1; }
  .hero::after { background: linear-gradient(90deg, #f3faffeb, #eff8ffd1 44%, #e9f7ff45); }
  .hero-copy { padding: 0; max-width: 100%; }
  .hero h1 { font-size: 38px; }
  main { padding-top: 20px; }
  .stats { height: auto; margin-top: 0; padding: 14px 0; }
  .stat { gap: 18px; }
  .stat strong { font-size: 32px; }
  .section { padding-top: 47px; }
  .section-head h2 { font-size: 28px; }
  .section-head h2 span { font-size: 9px; margin-left: 12px; }
  .more { font-size: 11px; }
  .grid4, .grid3 { gap: 20px; }
  .about-layout { grid-template-columns: 1fr; gap: 28px; }
  .about-image { height: 320px; }
  .about-copy > p { font-size: 16px; }
  .about-points { margin-top: 27px; }
  .contact-banner .container { height: auto; padding: 36px 0; }
  .contact-banner h2 { font-size: 24px; }
  .contact-banner p { font-size: 13px; }
  .footer-top { grid-template-columns: 1fr; gap: 28px; }
  .footer-contact { display: flex; border-left: 0; justify-content: center; }
}
@media (max-width: 600px) {
  .nav-shell { max-height: calc(100dvh - 87px); }
  .product-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 12px; gap: 8px; }
  .product-menu-card { flex-direction: column; align-items: flex-start; gap: 7px; padding: 12px; }
  .product-menu-icon { width: 28px; height: 28px; }
  .product-menu-copy strong { font-size: 14px; }
  .topbar .brand-row { height: 87px; gap: 10px; }
  .topbar .brand { gap: 9px; }
  .topbar .brand-mark { width: 44px; height: 38px; }
  .topbar .brand strong { font-size: clamp(15px, 4.3vw, 21px); letter-spacing: 0; }
  .topbar .brand small { font-size: clamp(4.5px, 1.3vw, 6.3px); margin-top: 4px; letter-spacing: 0; }
  .menu-toggle { padding: 9px; }
  .menu-toggle span { display: none; }
  .navigation { grid-template-columns: repeat(2, 1fr); }
  .hero { height: 400px; }
  .hero h1 { display: block; font-size: clamp(27px, 7.7vw, 34px); line-height: 1.4; }
  .hero-product-primary, .hero-product-secondary { display: block; }
  .hero-product-separator { display: none; }
  .hero-actions { margin-top: 24px; }
  .hero-actions .button { min-height: 48px; min-width: 195px; padding: 13px 24px; font-size: 16px; }
  .stat { padding: 17px 9px; gap: 13px; }
  .stat > .icon { width: 29px; height: 29px; }
  .stat strong { font-size: 28px; }
  .stat b { font-size: 13px; }
  .stat small { font-size: 10px; }
  .section-head { align-items: center; }
  .section-head h2 { font-size: 25px; }
  .section-head h2 span { display: none; }
  .grid4, .grid3 { grid-template-columns: 1fr; gap: 19px; }
  .product-photo { height: 193px; }
  .solution-photo { height: 175px; }
  .solution h3 { font-size: 20px; }
  .solution p { font-size: 13px; }
  .solution .circle-arrow { display: grid; }
  .about-image { height: 230px; }
  .about-copy > p { font-size: 14px; }
  .about-point b { font-size: 11px; }
  .about-point small { font-size: 10px; }
  .about-point .medallion { width: 49px; height: 49px; }
  .manufacture-card { height: 221px; }
  .case h3 { font-size: 18px; }
  .advantage { padding: 22px; gap: 23px; }
  .advantage h3 { font-size: 18px; }
  .advantage p { font-size: 13px; }
  .advantage .medallion { width: 61px; height: 61px; }
  .news-card { height: 142px; gap: 13px; padding: 10px; }
  .news-photo { width: 110px; min-width: 110px; height: 120px; }
  .news-copy h3 { font-size: 15px; }
  .news-copy p { font-size: 11px; }
  .news-tag { font-size: 8px; }
  .contact-banner h2 { font-size: 22px; letter-spacing: 0; }
  .contact-banner p { font-size: 12px; letter-spacing: 1px; }
  .footer .brand { gap: 10px; }
  .footer .brand-mark { width: 54px; height: 47px; }
  .footer .brand strong { font-size: clamp(17px, 5vw, 21px); letter-spacing: 0; }
  .footer .brand small { font-size: 6px; }
  .footer-links { display: grid; grid-template-columns: repeat(4, 1fr); gap: 17px 22px; font-size: 12px; }
  .footer-note { font-size: 10px; letter-spacing: 0; }
  .copyright { font-size: 9px; letter-spacing: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ==================== 02. products ==================== */
.product-listing { background: #f5f7fa; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.catalog-hero { position: relative; isolation: isolate; height: 316px; overflow: hidden; background: #103951; color: #fff; }
.catalog-hero-image { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.catalog-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #062b49f5 0%, #07334ae8 29%, #083c598a 58%, #07395820 100%); }
.catalog-hero-content { position: relative; padding-top: 25px; }
.catalog-breadcrumb { display: flex; align-items: center; gap: 12px; color: #b5c7d3; font-size: 12px; }
.catalog-breadcrumb a:hover { color: #fff; }
.catalog-breadcrumb [aria-current] { color: #fff; }
.catalog-eyebrow { display: block; margin-top: 35px; color: #76dec3; font-size: 11px; letter-spacing: 4px; }
.catalog-hero h1 { margin: 13px 0 14px; font-size: 44px; font-weight: 600; letter-spacing: 2px; line-height: 1.4; }
.catalog-hero h1 span { color: #5bbaa5; font-weight: 400; }
.catalog-hero-content > p { margin: 0; color: #d2dfe6; font-size: 16px; line-height: 1.8; letter-spacing: .5px; }
.catalog-hero-services { display: flex; gap: 0; margin-top: 27px; font-size: 12px; color: #c2d7df; letter-spacing: 2px; }
.catalog-hero-services span + span { border-left: 1px solid #ffffff35; margin-left: 22px; padding-left: 22px; }
.catalog-main { padding: 56px 0 68px; background: #f5f7fa; }
.catalog-layout { display: grid; grid-template-columns: 246px minmax(0, 1fr); gap: 36px; align-items: start; }
.catalog-sidebar { position: sticky; top: 24px; }
.category-panel { background: #fff; border: 1px solid #e1e8ee; }
.category-panel-heading { padding: 25px 23px 23px; color: #fff; background: linear-gradient(135deg, #073a68, #08556c); }
.category-panel-heading > span { display: block; font-size: 9px; letter-spacing: 1.4px; color: #96c0cd; }
.category-panel-heading h2 { font-size: 24px; margin: 9px 0 0; font-weight: 600; letter-spacing: 1px; }
.category-buttons { padding: 10px; }
.category-filter { display: flex; align-items: center; width: 100%; gap: 11px; border: 0; border-left: 3px solid transparent; padding: 18px 10px; background: transparent; text-align: left; color: #536577; font-size: 14px; cursor: pointer; transition: background .2s, color .2s; }
.category-filter + .category-filter { border-top: 1px solid #edf1f4; }
.category-filter > .icon { width: 21px; height: 21px; color: #8294a4; }
.category-filter > span { flex: 1; }
.category-filter small { font: 11px Arial, sans-serif; color: #9faeba; }
.category-filter:hover { color: #008253; background: #f4faf7; }
.category-filter.is-selected { background: #edf8f3; color: #008352; border-left-color: #009e63; font-weight: 600; }
.category-filter.is-selected > .icon, .category-filter.is-selected small { color: #009564; }
.catalog-assistance { position: relative; overflow: hidden; margin-top: 24px; padding: 27px 25px; background: #e7eeef; border: 1px solid #dce6e8; }
.catalog-assistance > .icon { width: 30px; height: 30px; margin-bottom: 19px; color: #008c67; }
.catalog-assistance > span { display: block; color: #548176; font-size: 12px; letter-spacing: 1px; }
.catalog-assistance h3 { color: #153e48; font-size: 21px; line-height: 1.6; margin: 10px 0; font-weight: 600; }
.catalog-assistance p { color: #7a9095; font-size: 12px; line-height: 1.9; margin: 0 0 22px; }
.catalog-assistance a { display: block; font: 700 20px Arial, sans-serif; color: #008559; white-space: nowrap; }
.catalog-assistance small { display: block; margin-top: 8px; color: #8a9da1; font-size: 11px; }
.catalog-results { min-width: 0; scroll-margin-top: 25px; }
.catalog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.catalog-section-label { color: #96a5b2; font-size: 10px; letter-spacing: 1.8px; }
.catalog-toolbar h2 { font-size: 29px; line-height: 1.35; font-weight: 600; margin: 7px 0 0; color: #10365b; }
.catalog-search { display: flex; align-items: center; width: 360px; max-width: 48%; height: 48px; border: 1px solid #dbe4ea; background: #fff; padding: 5px 5px 5px 14px; transition: border-color .2s, box-shadow .2s; }
.catalog-search:focus-within { border-color: #329c7c; box-shadow: 0 0 0 3px #009d6610; }
.catalog-search > .icon { width: 19px; height: 19px; color: #8ea0af; margin-right: 9px; }
.catalog-search input { width: 100%; min-width: 0; border: 0; outline: none; background: transparent; font: inherit; font-size: 12px; color: #2c4a62; }
.catalog-search input::placeholder { color: #9aa8b4; }
.catalog-search button { flex-shrink: 0; padding: 0 16px; height: 36px; border: 0; background: #0a4862; color: #fff; font-size: 12px; cursor: pointer; }
.catalog-search button:hover { background: #008d62; }
.catalog-introduction { margin: 15px 0 24px; color: #8091a0; font-size: 13px; line-height: 1.8; }
.catalog-results-meta { display: flex; align-items: center; justify-content: space-between; padding: 17px 0; border-top: 1px solid #dde6ed; color: #8c9ba8; font-size: 12px; }
.catalog-results-meta p { margin: 0; }
.catalog-results-meta strong { color: #008953; font-weight: 600; padding: 0 3px; }
.catalog-results-meta > span { color: #a0adb7; font-size: 11px; letter-spacing: .8px; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 23px; }
.catalog-card { min-width: 0; overflow: hidden; background: #fff; border: 1px solid #e1e8ed; transition: border-color .22s, box-shadow .22s, transform .22s; }
.catalog-card[hidden], .catalog-empty[hidden] { display: none; }
.catalog-card:hover { border-color: #b3d2c5; box-shadow: 0 13px 28px #123d5710; transform: translateY(-4px); }
.catalog-photo { height: 211px; overflow: hidden; background: #e9eef2; }
.catalog-photo img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.catalog-card:hover .catalog-photo img { transform: scale(1.035); }
.catalog-card-body { padding: 23px 22px 0; }
.catalog-card-category { display: block; color: #088d68; font-size: 11px; line-height: 1.5; letter-spacing: .4px; }
.catalog-card h3 { color: #123457; font-size: 21px; line-height: 1.5; font-weight: 600; margin: 9px 0 10px; }
.catalog-card-body > p { min-height: 45px; margin: 0; color: #8797a5; font-size: 12px; line-height: 1.9; }
.catalog-detail { display: flex; width: 100%; justify-content: space-between; align-items: center; border: 0; border-top: 1px solid #edf1f4; padding: 17px 0; margin-top: 20px; background: transparent; color: #6e8597; font-size: 12px; cursor: pointer; }
.catalog-detail .icon { width: 18px; height: 18px; color: #2e886f; transition: transform .2s; }
.catalog-detail:hover { color: #00895a; }
.catalog-detail:hover .icon { transform: translateX(4px); }
.catalog-pagination { display: flex; align-items: center; justify-content: center; gap: 9px; margin-top: 35px; }
.catalog-pagination button { min-width: 39px; height: 39px; padding: 0 14px; border: 1px solid #dfe6ec; background: #fff; color: #6b8193; font-size: 12px; cursor: pointer; }
.catalog-pagination button[aria-current="page"] { background: #083b5c; border-color: #083b5c; color: #fff; }
.catalog-pagination button:hover:not(:disabled):not([aria-current]) { color: #008552; border-color: #a9caba; }
.catalog-pagination button:disabled { opacity: .38; cursor: default; }
.catalog-empty { padding: 80px 25px; text-align: center; background: #fff; border: 1px solid #e3eaf0; }
.catalog-empty > .icon { margin: 0 auto 23px; color: #9ab3bc; width: 40px; height: 40px; }
.catalog-empty h3 { font-weight: 600; color: #23485e; }
.catalog-empty p { color: #8296a3; font-size: 14px; }
.catalog-empty button { display: inline-flex; align-items: center; gap: 12px; padding: 12px 21px; margin-top: 15px; border: 1px solid #d2e3dc; background: #f2faf6; color: #008559; cursor: pointer; }
.catalog-empty button .icon { width: 19px; }
.catalog-noscript { font-size: 13px; line-height: 1.8; color: #6b8092; }
.catalog-contact { position: relative; color: #fff; padding: 42px 0 0; background: radial-gradient(ellipse at 100% 20%, #08796b75, transparent 50%), #0a3551; }
.catalog-contact > .container:first-child { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-bottom: 34px; }
.catalog-contact-heading > span { color: #66baa9; font-size: 10px; letter-spacing: 2.5px; }
.catalog-contact h2 { font-size: 30px; font-weight: 500; margin: 13px 0; letter-spacing: 1px; }
.catalog-contact p { margin: 0; font-size: 13px; color: #98b4c4; }
.catalog-contact .button { border-radius: 3px; padding: 16px 27px; font-size: 15px; gap: 30px; }
.catalog-process { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #ffffff17; padding: 25px 0; }
.catalog-process > div { display: flex; align-items: center; gap: 17px; }
.catalog-process span { font: 300 23px Arial, sans-serif; color: #5b9eaa; }
.catalog-process strong { font-size: 13px; font-weight: 400; color: #bcd0db; letter-spacing: 2px; }
.product-listing .footer { background: #10283b; }
.product-dialog { width: min(970px, calc(100% - 40px)); max-height: calc(100dvh - 60px); border: 0; padding: 0; color: #15374d; background: #fff; box-shadow: 0 24px 80px #05263b45; }
.product-dialog::backdrop { background: #051f35b8; backdrop-filter: blur(4px); }
.product-dialog-layout { display: grid; grid-template-columns: 48% 1fr; }
.dialog-photo { background: #edf1f4; padding: 28px; display: flex; align-items: center; }
.dialog-photo img { width: 100%; max-height: 530px; object-fit: contain; }
.dialog-copy { padding: 48px 35px 35px; }
.dialog-copy h2 { font-size: 28px; font-weight: 600; line-height: 1.45; margin: 13px 0 20px; }
.dialog-copy > p { color: #7a8e9e; font-size: 14px; line-height: 1.9; }
.dialog-features { display: flex; flex-wrap: wrap; gap: 8px; margin: 23px 0; }
.dialog-features span { color: #2b816a; font-size: 11px; padding: 7px 10px; background: #eff7f3; }
.dialog-copy dl { margin: 25px 0; }
.dialog-copy dl > div { display: grid; grid-template-columns: 60px 1fr; gap: 16px; font-size: 12px; line-height: 1.8; padding: 12px 0; border-top: 1px solid #e9eef2; }
.dialog-copy dt { color: #a1adb7; }
.dialog-copy dd { margin: 0; color: #586f80; }
.dialog-copy .dialog-note { font-size: 12px; }
.dialog-copy .button { margin-top: 10px; font-size: 14px; border-radius: 2px; }
.dialog-back { display: block; background: transparent; border: 0; color: #8394a0; padding: 15px 0 0; font-size: 12px; cursor: pointer; }
.dialog-close { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid #e2e9ee; background: #fff; color: #4a687f; cursor: pointer; }
body.product-dialog-open { overflow: hidden; }
.product-listing button:focus-visible, .product-listing a:focus-visible { outline: 2px solid #00a173; outline-offset: 3px; }
@media(max-width:1250px) {
  .catalog-layout { grid-template-columns: 217px minmax(0, 1fr); gap: 26px; }
  .category-filter { padding: 16px 8px; font-size: 13px; gap: 8px; }
  .catalog-assistance { padding: 24px 20px; }
  .catalog-assistance a { font-size: 18px; }
  .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 21px; }
  .catalog-photo { height: 210px; }
  .catalog-search { max-width: 50%; width: 315px; }
}
@media(max-width:900px) {
  .catalog-hero { height: 285px; }
  .catalog-eyebrow { margin-top: 30px; }
  .catalog-hero h1 { font-size: 37px; }
  .catalog-hero-content > p { font-size: 14px; }
  .catalog-main { padding: 30px 0 45px; }
  .catalog-layout { grid-template-columns: 1fr; gap: 27px; }
  .catalog-sidebar { position: static; }
  .category-panel { padding: 16px; }
  .category-panel-heading { background: none; color: #254b60; padding: 0 0 14px; }
  .category-panel-heading > span { display: none; }
  .category-panel-heading h2 { margin: 0; font-size: 17px; }
  .category-buttons { display: flex; flex-wrap: wrap; gap: 9px; padding: 0; }
  .category-filter { width: auto; gap: 9px; padding: 12px 13px; border: 1px solid #e6edf1; background: #f8fafc; font-size: 13px; }
  .category-filter + .category-filter { border-top: 1px solid #e6edf1; }
  .category-filter > .icon, .category-filter > small { display: none; }
  .category-filter.is-selected { border: 1px solid #008e63; background: #008e63; color: #fff; }
  .catalog-assistance { display: none; }
  .catalog-photo { height: 220px; }
  .catalog-contact h2 { font-size: 25px; }
  .catalog-contact .button { padding: 14px 19px; gap: 15px; flex-shrink: 0; }
  .catalog-process { padding: 23px 0; }
  .catalog-process > div { gap: 10px; }
  .catalog-process strong { font-size: 12px; letter-spacing: 0; }
}
@media(max-width:600px) {
  .catalog-hero { height: 280px; }
  .catalog-hero-image { object-position: 64% center; }
  .catalog-hero::after { background: linear-gradient(90deg,#062b49ed,#083b53bf 75%,#0739588c); }
  .catalog-hero-content { padding-top: 22px; }
  .catalog-eyebrow { font-size: 9px; margin-top: 33px; }
  .catalog-hero h1 { font-size: clamp(26px,7.1vw,34px); letter-spacing: 0; margin-top: 12px; }
  .catalog-hero-content > p { font-size: 12px; max-width: 275px; line-height: 1.9; }
  .catalog-hero-services { font-size: 10px; margin-top: 21px; }
  .catalog-hero-services span + span { padding-left: 16px; margin-left: 16px; }
  .category-panel { padding: 16px 13px; }
  .category-buttons { gap: 8px; }
  .category-filter { font-size: 12px; padding: 10px 11px; }
  .catalog-toolbar { align-items: flex-start; flex-direction: column; gap: 20px; }
  .catalog-toolbar h2 { font-size: 27px; }
  .catalog-search { max-width: 100%; width: 100%; }
  .catalog-introduction { margin-top: 16px; font-size: 12px; }
  .catalog-results-meta > span { display: none; }
  .catalog-grid { grid-template-columns: 1fr; gap: 23px; }
  .catalog-photo { height: auto; aspect-ratio: 1.6; }
  .catalog-card-body { padding: 23px 22px 0; }
  .catalog-card h3 { font-size: 21px; }
  .catalog-card-body > p { min-height: 0; }
  .catalog-pagination { gap: 7px; }
  .catalog-pagination button { padding: 0 11px; }
  .catalog-contact { padding-top: 34px; }
  .catalog-contact > .container:first-child { align-items: flex-start; flex-direction: column; }
  .catalog-contact-heading > span { font-size: 8px; letter-spacing: 1.5px; }
  .catalog-contact h2 { font-size: 24px; letter-spacing: 0; }
  .catalog-contact p { font-size: 12px; line-height: 1.9; }
  .catalog-process { grid-template-columns: repeat(2,1fr); gap: 23px; }
  .product-dialog { width: calc(100% - 28px); max-height: calc(100dvh - 32px); }
  .product-dialog-layout { grid-template-columns: 1fr; }
  .dialog-photo { padding: 16px; height: 230px; }
  .dialog-photo img { max-height: 100%; }
  .dialog-copy { padding: 25px; }
  .dialog-copy h2 { font-size: 25px; }
}
@media(prefers-reduced-motion:reduce) { .product-listing *, .product-listing *::before, .product-listing *::after { transition: none !important; } }

/* ==================== 03. about ==================== */
.about-page { background: #fff; }
.about-main { padding: 0; background: #fff; }
.about-page section[id], .about-page article[id] { scroll-margin-top: 85px; }
.about-hero { position: relative; isolation: isolate; height: 400px; overflow: hidden; background: #153b50; color: #fff; }
.about-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 53%; z-index: -2; }
.about-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#052b49f5 0%,#0b3a50d9 30%,#163e527a 60%,#153c5420); }
.about-hero-content { padding-top: 25px; }
.about-breadcrumb { display: flex; align-items: center; gap: 12px; color: #d2e0e7; font-size: 12px; }
.about-breadcrumb a:hover { color: #65e3b5; }
.about-eyebrow { display: block; margin-top: 34px; font-size: 11px; letter-spacing: 3.8px; color: #7ddac2; }
.about-hero h1 { font-size: 42px; line-height: 1.4; letter-spacing: 2px; font-weight: 600; margin: 12px 0 16px; }
.about-hero h1 span { display: block; }
.about-hero-content > p { color: #cbdfe7; font-size: 14px; margin: 0; letter-spacing: 1px; line-height: 1.8; }
.about-hero-credentials { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.about-hero-credentials a { display: flex; align-items: center; gap: 11px; padding: 12px 17px; background: #072f4396; border: 1px solid #7bc5bb50; color: #e9f8f4; font-size: 12px; transition: background .2s; }
.about-hero-credentials a:hover { background: #087758b3; }
.about-hero-credentials .icon { width: 21px; height: 21px; color: #73e1b7; }
.about-tabs { position: sticky; top: 0; z-index: 10; background: #fffffff7; border-bottom: 1px solid #e1e8ed; backdrop-filter: blur(12px); }
.about-tabs > .container { display: flex; align-items: center; gap: 50px; min-height: 66px; }
.about-tabs a { position: relative; display: inline-flex; align-items: center; min-height: 66px; white-space: nowrap; color: #71869a; font-size: 14px; }
.about-tabs a::after { content: ''; position: absolute; bottom: 0; height: 3px; left: 0; right: 0; background: #00a66a; transform: scaleX(0); transition: transform .2s; }
.about-tabs a:hover, .about-tabs a.is-active { color: #008d5e; }
.about-tabs a.is-active::after { transform: scaleX(1); }
.about-tabs .container > span { margin-left: auto; font: 10px Arial,sans-serif; letter-spacing: 1.5px; color: #a6b4bf; }
.about-section { padding: 68px 0; }
.about-section-heading > span { display: block; margin-bottom: 12px; font-size: 10px; letter-spacing: 2.1px; font-weight: 500; color: #1b9575; }
.about-section-heading h2 { font-size: 31px; font-weight: 600; line-height: 1.5; letter-spacing: .6px; color: #113655; margin: 0; }
.about-section-heading > p { margin: 15px 0 0; font-size: 14px; line-height: 1.9; color: #667d8e; }
.qualifications-section { background: linear-gradient(140deg,#f2f7f9,#fafcfb); }
.credentials-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px; margin-top: 34px; align-items: stretch; }
.credential-card { min-width: 0; padding: 26px; border: 1px solid #dae6e8; border-top: 3px solid #0a7b79; background: #fff; box-shadow: 0 8px 30px #1a485407; }
.credential-card:nth-child(2) { border-top-color: #00a365; }
.credential-heading { display: flex; gap: 17px; align-items: center; border-bottom: 1px solid #e9eef1; padding-bottom: 23px; }
.credential-symbol { display: grid; place-items: center; width: 50px; height: 55px; flex-shrink: 0; background: #edf7f3; color: #009361; }
.credential-symbol .icon { width: 30px; height: 30px; stroke-width: 1.5; }
.credential-heading > div > span { display: block; font-size: 9px; letter-spacing: 1.3px; color: #98aab5; }
.credential-heading h3 { margin: 7px 0 5px; font-size: 23px; color: #0f3859; line-height: 1.5; font-weight: 600; }
.credential-heading p { margin: 0; font-size: 11px; line-height: 1.7; color: #8599a6; }
.credential-body { display: grid; grid-template-columns: 210px minmax(0,1fr); align-items: start; gap: 25px; padding-top: 26px; }
.certificate-preview { display: block; min-width: 0; width: 100%; padding: 12px 12px 0; border: 1px solid #e3e9ec; background: #f1f5f7; cursor: zoom-in; box-shadow: 0 5px 13px #21435809; }
.certificate-preview > img { display: block; width: 100%; height: auto; aspect-ratio: 1323/1871; object-fit: contain; background: #fff; box-shadow: 0 2px 7px #142e4b17; }
.certificate-preview > span { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 14px 0; font-size: 10px; color: #5e7a90; white-space: nowrap; }
.certificate-preview .icon { width: 14px; height: 14px; }
.certificate-preview:hover { border-color: #9ccbb9; }
.credential-tag { display: inline-block; font-size: 12px; line-height: 1.7; color: #087455; padding: 5px 9px; background: #edf8f3; margin-bottom: 8px; }
.credential-details dl { margin: 0; }
.credential-details dl > div { display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 10px; font-size: 13px; line-height: 1.85; padding: 7px 0; }
.credential-details dt { color: #718694; }
.credential-details dd { margin: 0; color: #4d6c80; overflow-wrap: anywhere; }
.credential-details dl > div:first-child dd { color: #244f68; font-weight: 600; letter-spacing: .2px; }
.credential-pdf { display: inline-flex; align-items: center; gap: 12px; font-size: 12px; color: #0a8863; margin-top: 16px; padding-bottom: 4px; border-bottom: 1px solid #b0d8ca; }
.credential-pdf .icon { width: 16px; height: 16px; }
.company-profile-layout { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 64px; }
.company-photo { position: relative; overflow: hidden; min-width: 0; }
.company-photo > img { display: block; width: 100%; height: 418px; object-fit: cover; object-position: center; }
.company-photo > div { position: absolute; bottom: 0; left: 0; right: 0; padding: 55px 28px 26px; background: linear-gradient(transparent,#062d43d9); color: #fff; }
.company-photo span { display: block; font-size: 10px; letter-spacing: 2px; margin-bottom: 10px; color: #a4dace; }
.company-photo strong { font-size: 19px; font-weight: 500; letter-spacing: 1px; }
.company-profile-copy { min-width: 0; }
.company-profile-copy .about-section-heading h2 { font-size: 28px; letter-spacing: 0; }
.company-profile-copy > p { font-size: 14px; color: #607786; line-height: 2; margin: 18px 0 0; text-align: justify; }
.company-profile-copy blockquote { margin: 22px 0; padding: 13px 0 13px 15px; border-left: 3px solid #03a871; color: #17694f; font-size: 15px; line-height: 1.7; background: linear-gradient(90deg,#f0f8f5,transparent); }
.company-profile-copy blockquote span { margin: 0 21px; }
.company-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin-top: 27px; }
.company-facts > div + div { border-left: 1px solid #e1e8ee; padding-left: 24px; }
.company-facts strong { display: block; color: #0b3f5c; font: 600 30px Arial,'Microsoft YaHei',sans-serif; white-space: nowrap; }
.company-facts strong small { font-size: 12px; font-weight: 400; margin-left: 6px; color: #6a8897; }
.company-facts > div:last-child strong { font-size: 25px; line-height: 35px; }
.company-facts > div > span { display: block; color: #9aabb5; font-size: 11px; margin-top: 10px; }
.business-section { background: #f6f8fa; }
.business-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 26px; margin-top: 33px; }
.business-card { min-width: 0; background: #fff; border: 1px solid #e4ebee; }
.business-photo { height: 218px; position: relative; overflow: hidden; }
.business-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.business-photo > span { position: absolute; bottom: 0; left: 0; padding: 10px 17px; background: #064766ed; font: 400 20px Arial,sans-serif; color: #aee3d8; }
.business-copy { padding: 26px 27px 23px; }
.business-copy > span { display: block; color: #9ab0bb; font-size: 9px; letter-spacing: 1.3px; }
.business-copy h3 { font-size: 23px; line-height: 1.4; font-weight: 600; color: #163d5b; margin: 9px 0 15px; }
.business-copy p { color: #667d8e; font-size: 13px; line-height: 1.9; margin: 0; min-height: 75px; }
.business-copy a { display: flex; justify-content: space-between; align-items: center; color: #168367; font-size: 12px; padding-top: 19px; border-top: 1px solid #edf1f3; margin-top: 23px; }
.business-copy a .icon { width: 18px; height: 18px; }
.business-card:hover { border-color: #b1d8c8; }
.manufacturing-section { background: radial-gradient(ellipse at 0% 0%,#0d657340,transparent 70%),#0b3049; }
.manufacturing-heading { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-bottom: 34px; }
.manufacturing-section .about-section-heading > span { color: #69c5ab; }
.manufacturing-section .about-section-heading h2 { color: #fff; }
.manufacturing-heading > p { margin: 0; color: #8fafc0; line-height: 1.9; font-size: 13px; }
.equipment-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 25px; }
.equipment-card { position: relative; margin: 0; height: 290px; overflow: hidden; }
.equipment-card img { display: block; width: 100%; height: 100%; object-fit: cover; }
.equipment-card figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 70px 25px 24px; background: linear-gradient(transparent,#082839e6); }
.equipment-card figcaption span { color: #b2d0d9; font-size: 9px; letter-spacing: 1.6px; }
.equipment-card h3 { color: #fff; font-size: 22px; font-weight: 500; margin: 9px 0 0; }
.service-flow { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 38px; margin-top: 36px; }
.service-flow article { min-width: 0; }
.service-step-mark { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #dce8e9; padding-bottom: 18px; }
.service-step-mark .icon { width: 32px; height: 32px; color: #09886a; stroke-width: 1.4; }
.service-step-mark > span { color: #d5e2e6; font: 400 35px Arial,sans-serif; }
.service-flow h3 { font-size: 21px; color: #1c4561; font-weight: 500; margin: 20px 0 12px; }
.service-flow p { color: #667d8e; font-size: 13px; line-height: 1.9; margin: 0; }
.about-contact { background: #eaf3f1; border-top: 1px solid #e1ece7; }
.about-contact .container { display: flex; justify-content: space-between; align-items: center; gap: 30px; padding: 38px 0; }
.about-contact .container > div > span { color: #7b9e93; font-size: 9px; letter-spacing: 2px; }
.about-contact h2 { color: #124a47; font-size: 29px; font-weight: 500; margin: 11px 0 12px; }
.about-contact p { margin: 0; color: #88a298; font-size: 13px; }
.about-contact .button { font-size: 15px; border-radius: 3px; padding: 17px 27px; }
.certificate-dialog { border: 0; padding: 0; width: min(1000px,calc(100% - 40px)); max-height: calc(100dvh - 40px); background: #e8eef2; box-shadow: 0 25px 100px #092a3e70; color: #173a55; }
.certificate-dialog::backdrop { background: #051d32b8; backdrop-filter: blur(4px); }
.certificate-dialog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 20px; background: #fff; border-bottom: 1px solid #dce6ec; }
.certificate-dialog-toolbar h2 { font-size: 16px; font-weight: 600; margin: 0; }
.certificate-dialog-toolbar > div { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.certificate-dialog-toolbar button, .certificate-dialog-toolbar a { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #d6e3e6; background: #f5faf8; color: #187656; padding: 9px 12px; font-size: 12px; cursor: pointer; }
.certificate-dialog-toolbar .certificate-close { width: 34px; height: 34px; padding: 0; background: #fff; color: #42617b; font-size: 24px; }
.certificate-viewer { padding: 20px; overflow: auto; max-height: calc(100dvh - 112px); }
.certificate-viewer img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100dvh - 152px); margin: 0 auto; box-shadow: 0 4px 15px #1d3c571c; background: #fff; }
.certificate-viewer.is-zoomed img { width: 1323px; max-width: none; max-height: none; }
.about-page.certificate-open { overflow: hidden; }
.about-page button:focus-visible, .about-page a:focus-visible { outline: 2px solid #0d9871; outline-offset: 3px; }
@media(max-width:1400px) {
  .credential-card { padding: 22px; }
  .credential-body { grid-template-columns: 160px minmax(0,1fr); gap: 20px; }
  .credential-details dl > div { font-size: 12px; grid-template-columns: 73px minmax(0,1fr); }
  .credential-heading h3 { font-size: 21px; }
  .company-profile-layout { gap: 40px; }
  .company-profile-copy .about-section-heading h2 { font-size: 25px; }
}
@media(max-width:1100px) {
  .credentials-grid { grid-template-columns: 1fr; }
  .credential-body { grid-template-columns: 210px minmax(0,1fr); gap: 35px; }
  .credential-details dl > div { font-size: 13px; grid-template-columns: 80px minmax(0,1fr); }
  .certificate-preview { max-width: 210px; }
  .company-profile-layout { grid-template-columns: 1fr 1fr; gap: 30px; }
  .company-photo > img { height: 480px; }
  .company-profile-copy > p { font-size: 13px; }
  .company-profile-copy blockquote { font-size: 13px; }
  .company-profile-copy blockquote span { margin: 0 9px; }
  .company-facts { gap: 9px; }
  .company-facts > div + div { padding-left: 13px; }
  .company-facts strong { font-size: 26px; }
  .business-copy { padding: 23px 20px; }
  .business-copy h3 { font-size: 20px; }
  .business-copy p { font-size: 12px; }
  .manufacturing-heading { align-items: flex-start; flex-direction: column; gap: 19px; }
  .manufacturing-heading > p br { display: none; }
  .equipment-card { height: 245px; }
  .about-tabs .container { gap: 32px; }
  .about-tabs .container > span { display: none; }
}
@media(max-width:900px) {
  .about-hero h1 { font-size: 39px; }
  .about-tabs > .container { gap: 0; justify-content: space-between; }
  .about-section { padding: 48px 0; }
  .about-section-heading h2 { font-size: 28px; }
  .company-profile-layout { grid-template-columns: 1fr; gap: 32px; }
  .company-photo > img { height: 350px; }
  .company-profile-copy .about-section-heading h2 { font-size: 28px; }
  .company-profile-copy > p { font-size: 14px; }
  .company-facts { gap: 20px; }
  .company-facts > div + div { padding-left: 24px; }
  .business-grid { gap: 17px; }
  .business-photo { height: 180px; }
  .business-copy { padding: 21px 17px; }
  .business-copy h3 { font-size: 19px; }
  .business-copy > span { font-size: 8px; letter-spacing: 0; }
  .business-copy p { min-height: 120px; }
  .equipment-grid { gap: 17px; }
  .equipment-card { height: 220px; }
  .equipment-card figcaption { padding: 55px 18px 21px; }
  .service-flow { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
  .about-contact h2 { font-size: 24px; }
  .about-contact .button { flex-shrink: 0; font-size: 13px; padding: 15px 21px; gap: 17px; }
}
@media(max-width:600px) {
  .about-hero { height: 400px; }
  .about-hero-image { object-position: 75% center; }
  .about-hero::after { background: linear-gradient(90deg,#082d49e8,#0d3b51af); }
  .about-eyebrow { margin-top: 29px; font-size: 10px; }
  .about-hero h1 { font-size: 30px; letter-spacing: 0; margin: 12px 0; }
  .about-hero-content > p { font-size: 11px; letter-spacing: 0; }
  .about-hero-credentials { margin-top: 22px; gap: 8px; }
  .about-hero-credentials a { padding: 9px 13px; font-size: 11px; gap: 9px; }
  .about-hero-credentials .icon { width: 18px; height: 18px; }
  .about-tabs > .container { min-height: 54px; }
  .about-tabs a { font-size: 11px; min-height: 54px; }
  .about-section { padding: 38px 0; }
  .about-section-heading > span { font-size: 8px; letter-spacing: 1.3px; }
  .about-section-heading h2 { font-size: 24px; letter-spacing: 0; }
  .about-section-heading > p { font-size: 12px; margin-top: 12px; }
  .credentials-grid { margin-top: 25px; gap: 22px; }
  .credential-card { padding: 21px 18px; }
  .credential-heading { gap: 12px; padding-bottom: 19px; }
  .credential-symbol { width: 38px; height: 46px; }
  .credential-symbol .icon { width: 25px; height: 25px; }
  .credential-heading > div > span { font-size: 7px; letter-spacing: .7px; }
  .credential-heading h3 { font-size: clamp(17px,4.8vw,20px); }
  .credential-heading p { font-size: 9px; }
  .credential-body { grid-template-columns: 1fr; gap: 23px; padding-top: 21px; }
  .certificate-preview { margin: 0 auto; max-width: 210px; }
  .credential-details dl > div { font-size: 12px; grid-template-columns: 73px minmax(0,1fr); gap: 10px; padding: 7px 0; }
  .credential-tag { font-size: 11px; }
  .credential-pdf { font-size: 11px; }
  .company-photo > img { height: 260px; }
  .company-photo > div { padding: 55px 20px 23px; }
  .company-photo strong { font-size: 16px; }
  .company-photo span { font-size: 8px; }
  .company-profile-copy .about-section-heading h2 { font-size: 24px; }
  .company-profile-copy > p { font-size: 13px; }
  .company-profile-copy blockquote { font-size: 12px; padding-left: 11px; }
  .company-profile-copy blockquote span { margin: 0 10px; }
  .company-facts { gap: 7px; }
  .company-facts > div + div { padding-left: 10px; }
  .company-facts strong { font-size: 27px; }
  .company-facts strong small { font-size: 9px; margin-left: 3px; }
  .company-facts > div:last-child strong { font-size: 21px; line-height: 31px; }
  .company-facts > div > span { font-size: 9px; }
  .business-grid, .equipment-grid { grid-template-columns: 1fr; gap: 23px; }
  .business-photo { height: 215px; }
  .business-copy { padding: 25px; }
  .business-copy h3 { font-size: 23px; }
  .business-copy > span { font-size: 9px; letter-spacing: 1px; }
  .business-copy p { min-height: 0; font-size: 13px; }
  .equipment-card { height: 240px; }
  .manufacturing-heading > p { font-size: 12px; }
  .service-flow { gap: 25px; }
  .service-step-mark .icon { width: 27px; height: 27px; }
  .service-step-mark > span { font-size: 29px; }
  .service-flow h3 { font-size: 18px; }
  .service-flow p { font-size: 12px; }
  .about-contact .container { flex-direction: column; align-items: flex-start; gap: 25px; }
  .about-contact h2 { font-size: 23px; }
  .about-contact p { font-size: 11px; }
  .certificate-dialog { width: calc(100% - 20px); max-height: calc(100dvh - 20px); }
  .certificate-dialog-toolbar { flex-wrap: wrap; gap: 12px; padding: 14px; }
  .certificate-dialog-toolbar h2 { font-size: 15px; width: 100%; padding-right: 28px; }
  .certificate-dialog-toolbar button, .certificate-dialog-toolbar a { font-size: 11px; padding: 8px 12px; }
  .certificate-dialog-toolbar .certificate-close { position: absolute; right: 9px; top: 9px; width: 27px; height: 27px; }
  .certificate-viewer { padding: 10px; max-height: calc(100dvh - 125px); }
  .certificate-viewer img { max-height: calc(100dvh - 145px); }
}

/* ==================== 04. news ==================== */
.journal-page { background:#fff; }
.journal-main,.journal-detail-main { background:#fff; }
.journal-page [hidden] { display:none!important; }
.journal-page button,.journal-page a { -webkit-tap-highlight-color:transparent; }
.journal-page button:focus-visible,.journal-page a:focus-visible { outline:2px solid #00a46b;outline-offset:4px; }
.journal-breadcrumb,.news-breadcrumb { display:flex;align-items:center;gap:12px;font-size:12px;color:#7f98ac; }
.news-breadcrumb a:hover { color:#00ad78; }
.journal-hero { position:relative;isolation:isolate;height:320px;color:#fff;overflow:hidden;background:#123d57; }
.journal-hero>img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2; }
.journal-hero::after { content:'';position:absolute;inset:0;background:linear-gradient(90deg,#052b4df5 2%,#103958d9 34%,#173b5960 72%,#103a501a);z-index:-1; }
.journal-hero>.container { padding-top:26px; }
.journal-hero .news-breadcrumb { color:#d0e0e8; }
.journal-eyebrow { display:block;color:#008d69;font-size:11px;letter-spacing:2.5px;font-weight:500; }
.journal-hero .journal-eyebrow { color:#86dbc3;margin-top:35px; }
.journal-hero h1 { font-size:45px;letter-spacing:3px;margin:12px 0 15px;line-height:1.45;font-weight:600; }
.journal-hero p { margin:0;color:#d4e1e8;font-size:16px;letter-spacing:.6px; }
.journal-hero-line { margin-top:27px;display:flex;align-items:center;gap:18px;color:#b8cdd9;font-size:12px; }
.journal-hero-line i { display:block;width:3px;height:3px;background:#72c3af;border-radius:50%; }
.featured-section { padding-top:56px; }
.journal-section-label { display:flex;align-items:center;gap:20px;margin-bottom:24px; }
.journal-section-label h2 { margin:0;font-size:24px;font-weight:600;color:#173c59; }
.journal-section-label>span:not(.journal-section-rule) { font-size:10px;letter-spacing:1.7px;color:#8c9daa; }
.journal-section-rule { height:1px;flex:1;background:#e2eaee;margin-left:6px; }
.journal-section-label>a { display:flex;align-items:center;gap:12px;color:#188263;font-size:12px; }
.journal-section-label>a .icon { width:17px;height:17px; }
.journal-featured { display:grid;grid-template-columns:1.08fr 1fr;min-height:390px;background:#f0f5f6; }
.journal-featured-image { position:relative;display:block;overflow:hidden;min-height:390px; }
.journal-featured-image img { display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .5s; }
.journal-featured-image::after { content:'';position:absolute;inset:65% 0 0;background:linear-gradient(transparent,#103b4c91); }
.journal-featured-image>span { position:absolute;z-index:1;bottom:29px;left:32px;font-size:13px;letter-spacing:4px;color:#fff; }
.journal-featured-image:hover img { transform:scale(1.025); }
.journal-featured-copy { padding:39px 45px 31px;display:flex;flex-direction:column;align-items:flex-start; }
.journal-featured-meta { display:flex;align-items:center;gap:18px; }
.journal-category { display:inline-block;color:#07855d;font-size:12px;line-height:1.7; }
.journal-featured-meta .journal-category { padding:5px 11px;background:#008862;color:#fff; }
.journal-featured-meta>span:last-child { font-size:11px;color:#789193;letter-spacing:1px; }
.journal-featured-en { font-size:10px;letter-spacing:1.9px;color:#99afb9;margin-top:22px; }
.journal-featured h2 { margin:9px 0 16px;color:#163c59;font-size:31px;line-height:1.6;font-weight:600; }
.journal-featured h2 a:hover { color:#008966; }
.journal-featured-copy>p { font-size:14px;line-height:1.95;color:#667e8e;margin:0;max-width:460px; }
.journal-featured-more { display:flex;align-items:center;gap:25px;color:#137d63;font-size:13px;margin-top:24px; }
.journal-featured-more>span { width:37px;height:37px;border:1px solid #92bbaf;border-radius:50%;display:grid;place-items:center;transition:background .2s; }
.journal-featured-more .icon { width:18px;height:18px; }
.journal-featured-more:hover>span { background:#008f69;color:#fff;border-color:#008f69; }
.journal-library { padding-top:66px;padding-bottom:70px;scroll-margin-top:25px; }
.journal-library-top { display:flex;align-items:flex-end;justify-content:space-between;gap:20px; }
.journal-library-top h2 { margin:11px 0 0;color:#163b59;font-size:32px;line-height:1.5;font-weight:600; }
.journal-library-top>p { color:#80929e;font-size:13px;margin:0 0 7px; }
.journal-filterbar { display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #dce5e9;margin:26px 0 33px; }
.journal-filters { display:flex;gap:36px; }
.journal-filters>a { position:relative;display:flex;align-items:center;gap:9px;padding:19px 0;color:#60798e;font-size:15px;white-space:nowrap; }
.journal-filters>a>span { font:11px Arial,sans-serif;color:#97aab7; }
.journal-filters>a::after { content:'';position:absolute;bottom:-1px;height:3px;left:0;right:0;background:#009c6d;transform:scaleX(0);transition:transform .2s; }
.journal-filters>a.is-active { color:#00895f;font-weight:600; }
.journal-filters>a.is-active::after { transform:scaleX(1); }
.journal-total { color:#97a7b3;font-size:12px;white-space:nowrap; }
.journal-list-layout { display:grid;grid-template-columns:minmax(0,1fr) 305px;gap:44px; }
.journal-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px; }
.journal-card { min-width:0;border:1px solid #e0e8ed;background:#fff;transition:box-shadow .25s,border-color .25s; }
.journal-card:hover { border-color:#a8cebf;box-shadow:0 10px 26px #163c5310; }
.journal-card-image { height:232px;display:block;position:relative;overflow:hidden; }
.journal-card-image img { width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s; }
.journal-card:hover .journal-card-image img { transform:scale(1.035); }
.journal-card-image .journal-category { position:absolute;bottom:0;left:0;background:#fff;padding:8px 17px;border-top:2px solid #00a675; }
.journal-card-copy { padding:24px 27px 23px; }
.journal-card-meta { font-size:11px;color:#8b9ca9; }
.journal-card h3 { font-size:21px;line-height:1.65;font-weight:600;margin:12px 0;color:#1b3e58;min-height:69px; }
.journal-card h3 a:hover { color:#00895e; }
.journal-card-copy>p { font-size:13px;color:#728896;line-height:1.9;margin:0;min-height:74px; }
.journal-card-more { display:flex;justify-content:space-between;align-items:center;color:#178167;font-size:12px;border-top:1px solid #e9eef1;margin-top:24px;padding-top:17px; }
.journal-card-more .icon { width:19px;height:19px; }
.journal-sidebar { display:flex;flex-direction:column;gap:31px;min-width:0; }
.journal-promo { background:linear-gradient(135deg,#0d4560,#082d4c);color:#fff;padding:30px 27px 0;overflow:hidden; }
.journal-promo>span { color:#7bc8b6;font-size:9px;letter-spacing:1.5px; }
.journal-promo h3 { font-size:26px;line-height:1.65;font-weight:500;margin:17px 0 14px; }
.journal-promo p { font-size:12px;line-height:1.9;color:#abc5d3;margin:0 0 24px; }
.journal-promo>a { display:flex;justify-content:space-between;align-items:center;color:#b8ead7;border-top:1px solid #ffffff27;padding-top:17px;font-size:12px; }
.journal-promo>a .icon { width:18px;height:18px; }
.journal-promo-image { height:158px;margin:24px -27px 0;position:relative; }
.journal-promo-image img { width:100%;height:100%;object-fit:cover; }
.journal-promo-image::after { content:'';position:absolute;inset:0;background:linear-gradient(#0b35504a,transparent); }
.journal-side-heading { display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce5e9;padding-bottom:17px; }
.journal-side-heading h3 { margin:0;color:#24465f;font-size:18px;font-weight:600; }
.journal-side-heading>span { font-size:8px;color:#9aaebc;letter-spacing:1px; }
.journal-topics>a { padding:19px 0;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8edef;color:#53758a;font-size:12px; }
.journal-topics>a>span { display:flex;align-items:center;gap:12px; }
.journal-topics>a>span .icon { width:22px;height:22px;color:#149776; }
.journal-topics>a>.icon { width:16px;height:16px; }
.journal-recommended>a { display:flex;gap:15px;padding:20px 0;border-bottom:1px solid #e8edef; }
.recommended-number { color:#bdd3d8;font:24px Arial,sans-serif; }
.journal-recommended>a>div>span { font-size:10px;color:#238568; }
.journal-recommended h4 { font-size:13px;font-weight:500;line-height:1.8;color:#567184;margin:7px 0 0; }
.journal-recommended>a>.icon { width:15px;height:15px;color:#92acb5;margin-left:auto;flex-shrink:0;align-self:center; }
.journal-pagination { display:flex;align-items:center;justify-content:center;gap:10px;margin-top:42px; }
.journal-pagination>div { display:flex;gap:10px; }
.journal-pagination button { min-width:43px;height:43px;display:grid;place-items:center;background:white;border:1px solid #dbe6e9;color:#708998;cursor:pointer;font-size:13px; }
.journal-pagination button.is-active { background:#058760;border-color:#058760;color:#fff; }
.journal-pagination button:disabled { opacity:.4;cursor:default; }
.journal-pagination .icon { width:17px;height:17px; }
#news-prev .icon { transform:rotate(180deg); }
.journal-pagination>span { font-size:11px;color:#90a3ad;margin-left:12px; }
.journal-contact { background:#edf5f2;border-top:1px solid #e1ece6; }
.journal-contact>.container { padding:40px 0;display:flex;align-items:center;justify-content:space-between;gap:30px; }
.journal-contact .container>div>span { color:#799e92;font-size:9px;letter-spacing:2px; }
.journal-contact h2 { color:#184d4d;font-size:28px;font-weight:500;margin:12px 0; }
.journal-contact p { color:#70948a;font-size:13px;margin:0; }
.journal-contact .button { font-size:14px;border-radius:3px;padding:17px 25px; }
/* Article page */
.article-heading-band { background:linear-gradient(110deg,#f1f6f8,#f7faf9);border-bottom:1px solid #e3ebef; }
.article-heading-band>.container { padding-top:26px;padding-bottom:43px; }
.article-heading { display:flex;gap:35px;align-items:flex-end;justify-content:space-between;margin-top:37px; }
.article-kicker { display:flex;align-items:center;gap:15px; }
.article-kicker .journal-category { background:#e3f1e9;padding:5px 11px; }
.article-kicker>span:last-child { color:#8dabae;font-size:9px;letter-spacing:1.8px; }
.article-heading h1 { font-size:36px;line-height:1.6;color:#123955;margin:16px 0 8px;font-weight:600;letter-spacing:.5px;text-wrap:balance; }
.article-subtitle { font-size:15px;color:#73909f;letter-spacing:.5px;margin:0 0 26px; }
.article-meta { display:flex;flex-wrap:wrap;gap:10px 23px;color:#7d929f;font-size:12px;line-height:1.8; }
.article-meta>span+span { position:relative; }
.article-meta>span+span::before { position:absolute;content:'';left:-12px;top:7px;height:9px;width:1px;background:#c6d7de; }
.article-back { display:flex;align-items:center;gap:9px;color:#597e8f;font-size:12px;white-space:nowrap;flex-shrink:0;margin-bottom:3px; }
.article-back .icon { transform:rotate(180deg);width:17px;height:17px; }
.article-layout { display:grid;grid-template-columns:minmax(0,1fr) 305px;gap:70px;padding-top:46px;padding-bottom:60px; }
.article-content { min-width:0; }
.article-lead { border-left:3px solid #009766;background:#f3f7f7;padding:21px 26px;margin:0 0 30px;font-size:16px;line-height:2;color:#486776; }
.article-cover { margin:0 0 32px; }
.article-cover img { display:block;width:100%;max-height:485px;object-fit:cover; }
.article-cover figcaption,.article-inline-photo figcaption { text-align:center;color:#97a8b4;font-size:11px;margin-top:12px;line-height:1.8; }
.article-section { scroll-margin-top:28px;margin-top:37px; }
.article-section h2 { margin:0 0 18px;font-size:25px;line-height:1.6;color:#173e58;font-weight:600; }
.article-section p { font-size:16px;line-height:2.05;color:#607684;margin:0 0 17px;text-align:justify; }
.article-facts { border:1px solid #deeaeb;margin:23px 0; }
.article-facts>div { display:grid;grid-template-columns:138px minmax(0,1fr);font-size:14px;line-height:1.9; }
.article-facts>div+div { border-top:1px solid #e5edee; }
.article-facts dt { background:#f0f6f4;padding:15px 20px;color:#66867e; }
.article-facts dd { margin:0;padding:15px 24px;color:#486678;overflow-wrap:anywhere; }
.article-text-link { color:#098864;display:inline-flex;align-items:center;gap:16px;font-size:13px;line-height:1.8;border-bottom:1px solid #b4d6cb;padding-bottom:4px; }
.article-text-link .icon { width:17px;height:17px; }
.article-inline-photo { margin:26px 0; }
.article-inline-photo img { width:100%;max-height:435px;object-fit:cover;display:block; }
.article-quote { margin:35px 0;background:linear-gradient(100deg,#edf6f2,#f7faf9);padding:29px 32px;color:#16755b;font-size:23px;line-height:1.8;border-left:3px solid #11a877; }
.article-quote>span { display:block;color:#8aafa1;font-size:9px;letter-spacing:1.8px;margin-bottom:12px; }
.article-endnote { margin-top:35px;padding-top:23px;border-top:1px solid #e4ecef;display:flex;align-items:baseline;gap:18px;color:#8c9eaa;font-size:11px;line-height:1.8; }
.article-endnote>span { white-space:nowrap;color:#527c89; }
.article-endnote p { margin:0; }
.article-sharing { position:relative;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:28px 0 38px; }
.article-tags { display:flex;gap:8px;flex-wrap:wrap; }
.article-tags>span { display:block;background:#f0f5f6;padding:7px 12px;color:#8298a3;font-size:11px; }
.article-sharing>button { padding:8px 0;display:flex;align-items:center;gap:8px;background:none;border:0;color:#578296;font-size:12px;cursor:pointer;white-space:nowrap; }
.article-sharing .icon { width:18px;height:18px; }
.article-copy-status { position:absolute;right:0;bottom:15px;font-size:11px;color:#008861; }
.article-copy-fallback { background:#f1f6f7;padding:15px;margin-bottom:20px;font-size:12px;color:#547383; }
.article-copy-fallback input { display:block;width:100%;padding:10px;margin-top:9px;border:1px solid #c6d9df;color:#49677b; }
.article-neighbors { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid #dce6eb;border-bottom:1px solid #dce6eb; }
.article-neighbors>a,.article-neighbor-empty { min-width:0;position:relative;padding:25px 40px 25px 0; }
.article-neighbors>a+*,.article-neighbor-empty+* { border-left:1px solid #e3ebef;padding-left:27px; }
.article-neighbors span { display:block;color:#91a5b0;font-size:11px;margin-bottom:9px; }
.article-neighbors strong { font-weight:500;color:#4b6c82;font-size:14px;line-height:1.8;display:block; }
.article-neighbors .icon { position:absolute;right:14px;top:50%;width:17px;height:17px;color:#3b987c; }
.article-neighbors>a:first-child .icon { transform:rotate(180deg); }
.article-neighbor-empty strong { color:#a1b3bc; }
.article-side-sticky { position:sticky;top:28px; }
.article-toc { border-top:3px solid #118967;background:#f5f8f9;padding:27px 25px 14px; }
.article-toc>span { font-size:9px;letter-spacing:1.6px;color:#89a4ad; }
.article-toc h2 { font-size:20px;color:#244860;font-weight:600;margin:12px 0 20px; }
.article-toc a { display:flex;gap:14px;border-top:1px solid #e0e9ed;color:#627f91;font-size:13px;line-height:1.85;padding:17px 0; }
.article-toc a>span { color:#a1bcc4;font:12px Arial,sans-serif;margin-top:6px; }
.article-toc a:hover,.article-toc a.is-active { color:#008762; }
.article-toc a.is-active>span { color:#008762; }
.article-consult { background:linear-gradient(135deg,#0b4b5d,#0b304e);color:#fff;padding:28px 25px;margin-top:26px; }
.article-consult>span .icon { width:34px;height:34px;color:#88d4b8;stroke-width:1.3; }
.article-consult h3 { font-size:18px;line-height:1.7;font-weight:500;margin:19px 0 12px; }
.article-consult p { font-size:12px;color:#a1c1cc;line-height:1.9;margin:0; }
.article-consult>a { border-top:1px solid #ffffff24;margin-top:25px;padding-top:17px;display:flex;align-items:center;justify-content:space-between;gap:8px;font:600 19px Arial,sans-serif;color:#bce9d6; }
.article-consult>a .icon { width:20px;height:20px; }
.article-license-link { display:flex;align-items:center;gap:9px;color:#567c8b;font-size:11px;padding:21px 5px;border-bottom:1px solid #dce6ea; }
.article-license-link>.icon:first-child { color:#118865;width:23px;height:23px; }
.article-license-link>.icon:last-child { width:15px;height:15px;margin-left:auto; }
.article-related { padding:44px 0 52px;background:#f5f8f9;border-top:1px solid #e7eef1; }
.article-related-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:27px; }
.related-story { display:grid;grid-template-columns:200px minmax(0,1fr);background:white;border:1px solid #e4ecef;min-width:0; }
.related-story>img { display:block;width:100%;height:100%;min-height:180px;object-fit:cover; }
.related-story>div { padding:24px 26px; }
.related-story h3 { font-size:19px;line-height:1.7;font-weight:500;margin:10px 0 22px;color:#305269; }
.related-story>div>span:last-child { display:flex;align-items:center;gap:25px;color:#1c916d;font-size:11px; }
.related-story .icon { width:16px;height:16px; }
.article-missing { padding:100px 0;text-align:center;color:#22485c; }
.article-missing p { color:#7891a0;margin:18px 0 30px; }
@media(max-width:1250px){
  .journal-list-layout { grid-template-columns:minmax(0,1fr) 260px;gap:30px; }
  .journal-featured-copy { padding:32px; }
  .journal-featured h2 { font-size:28px; }
  .journal-card-image { height:190px; }
  .journal-card-copy { padding:22px; }
  .journal-card h3 { font-size:19px;min-height:63px; }
  .journal-card-copy>p { min-height:99px; }
  .journal-promo { padding:26px 23px 0; }
  .journal-promo h3 { font-size:24px; }
  .journal-promo-image { margin-left:-23px;margin-right:-23px; }
  .article-heading h1 { font-size:31px; }
  .article-layout { grid-template-columns:minmax(0,1fr) 265px;gap:40px; }
  .article-toc { padding:25px 20px 12px; }
  .article-consult { padding:25px 20px; }
  .article-consult>a { font-size:17px; }
  .related-story { grid-template-columns:155px minmax(0,1fr); }
  .related-story>div { padding:22px; }
  .related-story h3 { font-size:16px; }
}
@media(max-width:1000px){
  .journal-list-layout { grid-template-columns:minmax(0,1fr); }
  .journal-sidebar { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:30px; }
  .journal-promo { grid-row:span 2; }
  .journal-recommended { grid-column:2; }
  .journal-grid { gap:24px; }
  .journal-card-image { height:240px; }
  .journal-card h3 { font-size:21px; }
  .journal-card-copy>p { min-height:74px; }
  .article-layout { gap:32px;grid-template-columns:minmax(0,1fr) 235px; }
  .article-heading { flex-direction:column;align-items:flex-start;gap:24px; }
  .article-section p,.article-lead { font-size:15px; }
  .article-section h2 { font-size:23px; }
  .article-facts>div { grid-template-columns:110px minmax(0,1fr);font-size:13px; }
  .article-facts dt,.article-facts dd { padding:14px 15px; }
  .article-license-link { font-size:10px;gap:7px; }
  .article-consult h3 { font-size:16px; }
  .journal-contact h2 { font-size:24px; }
  .journal-contact .button { font-size:12px;padding:16px 18px;gap:12px; }
}
@media(max-width:800px){
  .journal-hero { height:300px; }
  .journal-hero h1 { font-size:39px; }
  .featured-section { padding-top:37px; }
  .journal-featured { grid-template-columns:1fr 1fr; }
  .journal-featured-copy { padding:27px 25px; }
  .journal-featured h2 { font-size:24px; }
  .journal-featured-copy>p { font-size:12px; }
  .journal-featured-image { min-height:350px; }
  .journal-featured { min-height:350px; }
  .journal-featured-en { font-size:8px;letter-spacing:1px; }
  .journal-library { padding-top:44px;padding-bottom:45px; }
  .journal-library-top h2 { font-size:28px; }
  .journal-filters { gap:26px; }
  .journal-filters>a { font-size:13px; }
  .journal-total { font-size:11px; }
  .journal-card-image { height:195px; }
  .journal-card h3 { font-size:20px; }
  .article-layout { grid-template-columns:1fr; }
  .article-sidebar { display:none; }
  .article-related-grid { gap:20px; }
  .related-story { grid-template-columns:1fr; }
  .related-story>img { height:175px;min-height:0; }
  .journal-contact>.container { align-items:flex-start;flex-direction:column;gap:24px; }
}
@media(max-width:600px){
  .journal-hero { height:280px; }
  .journal-hero>.container { padding-top:22px; }
  .news-breadcrumb { font-size:11px;gap:10px; }
  .journal-hero .journal-eyebrow { margin-top:31px;font-size:9px; }
  .journal-hero h1 { font-size:34px;letter-spacing:2px;margin:11px 0 16px; }
  .journal-hero p { font-size:12px;letter-spacing:0; }
  .journal-hero-line { font-size:10px;gap:14px;margin-top:23px; }
  .journal-section-label { gap:13px;margin-bottom:21px; }
  .journal-section-label h2 { font-size:21px; }
  .journal-section-label>span:not(.journal-section-rule) { font-size:8px;letter-spacing:1px; }
  .journal-featured { grid-template-columns:1fr; }
  .journal-featured-image { min-height:218px; }
  .journal-featured-image>span { bottom:23px;left:23px;font-size:11px; }
  .journal-featured-copy { padding:25px; }
  .journal-featured h2 { font-size:25px; }
  .journal-featured-en { margin-top:19px;font-size:9px; }
  .journal-featured-copy>p { font-size:13px; }
  .journal-featured-more { margin-top:22px; }
  .journal-library-top>p { display:none; }
  .journal-library-top h2 { font-size:27px; }
  .journal-eyebrow { font-size:9px; }
  .journal-filterbar { margin:17px 0 25px;display:block; }
  .journal-filters { gap:0;justify-content:space-between; }
  .journal-filters>a { font-size:12px;gap:5px;padding:18px 0; }
  .journal-filters>a>span { font-size:9px; }
  .journal-total { display:none; }
  .journal-grid { grid-template-columns:1fr;gap:25px; }
  .journal-card-image { height:210px; }
  .journal-card-copy { padding:23px; }
  .journal-card h3 { min-height:0;font-size:21px;line-height:1.7; }
  .journal-card-copy>p { min-height:0;font-size:13px; }
  .journal-pagination { margin-top:30px; }
  .journal-pagination button { min-width:39px;height:39px; }
  .journal-sidebar { grid-template-columns:1fr;gap:30px;margin-top:9px; }
  .journal-promo { grid-row:auto; }
  .journal-promo-image { height:180px; }
  .journal-recommended { grid-column:auto; }
  .journal-contact h2 { font-size:21px;line-height:1.7; }
  .journal-contact p { font-size:11px; }
  .journal-contact>.container { padding:30px 0; }
  .article-heading-band>.container { padding-top:23px;padding-bottom:28px; }
  .article-heading { margin-top:28px;gap:21px; }
  .article-heading h1 { font-size:27px;line-height:1.6;margin:16px 0 12px;letter-spacing:0; }
  .article-kicker>span:last-child { font-size:8px;letter-spacing:1.1px; }
  .article-subtitle { font-size:12px;line-height:1.8;margin-bottom:20px; }
  .article-meta { font-size:10px;gap:7px 16px; }
  .article-meta>span+span::before { left:-8px;top:5px; }
  .article-back { font-size:11px; }
  .article-layout { padding-top:28px;padding-bottom:38px; }
  .article-lead { padding:18px 19px;font-size:14px;line-height:2;margin-bottom:24px; }
  .article-cover img { height:220px; }
  .article-cover figcaption,.article-inline-photo figcaption { font-size:10px; }
  .article-section { margin-top:29px; }
  .article-section h2 { font-size:21px;line-height:1.7;margin-bottom:14px; }
  .article-section p { font-size:14px;line-height:2.1; }
  .article-facts>div { grid-template-columns:85px minmax(0,1fr);font-size:12px; }
  .article-facts dt,.article-facts dd { padding:13px 12px; }
  .article-text-link { font-size:12px;gap:8px; }
  .article-quote { padding:21px;font-size:18px;margin:27px 0; }
  .article-quote>span { font-size:8px;letter-spacing:1px; }
  .article-sharing { flex-wrap:wrap;gap:14px;padding:24px 0 29px; }
  .article-copy-status { bottom:8px; }
  .article-tags>span { font-size:10px;padding:6px 9px; }
  .article-endnote { display:block;font-size:10px; }
  .article-endnote>span { display:block;margin-bottom:7px; }
  .article-neighbors { grid-template-columns:1fr; }
  .article-neighbors>a,.article-neighbor-empty { padding:21px 35px 21px 0; }
  .article-neighbors>a+*,.article-neighbor-empty+* { border-left:0;border-top:1px solid #e3ebef;padding-left:0; }
  .article-neighbors strong { font-size:13px; }
  .article-related { padding:33px 0 37px; }
  .article-related-grid { grid-template-columns:1fr; }
  .article-related .journal-section-label>span:not(.journal-section-rule) { display:none; }
  .article-related .journal-section-label>a { font-size:11px; }
  .related-story { grid-template-columns:106px minmax(0,1fr); }
  .related-story>img { height:100%;min-height:168px; }
  .related-story>div { padding:17px; }
  .related-story h3 { font-size:15px;margin:8px 0 16px; }
  .related-story .journal-category { font-size:10px; }
}
@media(prefers-reduced-motion:reduce){.journal-page *{scroll-behavior:auto!important;transition:none!important;}}

/* ==================== 05. contact ==================== */
.contact-page,.contact-main{background:#fff}
.contact-page a:focus-visible,.contact-page button:focus-visible{outline:2px solid #079d71;outline-offset:4px}
.contact-hero{height:340px;position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#11394e}
.contact-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.contact-hero::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#062c4dfa 0%,#0c3c59e6 30%,#123d546e 67%,#173c5333);z-index:-1}
.contact-hero>.container{padding-top:26px}
.contact-breadcrumb{display:flex;gap:12px;color:#d6e3e9;font-size:12px;align-items:center}
.contact-breadcrumb a:hover{color:#64d6ad}
.contact-eyebrow{display:block;font-size:11px;letter-spacing:2.8px;color:#15976d}
.contact-hero .contact-eyebrow{color:#81d1b8;margin-top:32px}
.contact-hero h1{font-size:42px;line-height:1.5;margin:12px 0 17px;font-weight:600;letter-spacing:2px}
.contact-hero p{font-size:14px;color:#cadbe4;letter-spacing:.5px;margin:0;line-height:1.8}
.contact-overview{padding-top:57px;padding-bottom:58px;scroll-margin-top:24px}
.contact-overview-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:32px}
.contact-overview-heading h2{font-size:31px;line-height:1.5;margin:10px 0 0;font-weight:600;color:#143b58}
.contact-overview-heading>p{font-size:13px;color:#8197a1;letter-spacing:1px;margin:0 0 7px}
.contact-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}
.contact-card{min-width:0;border:1px solid #e0e8ed;padding:29px 31px 25px;background:#fff}
.contact-phone-card{border-top:3px solid #099766;background:linear-gradient(140deg,#f0f8f4,#fff);padding-top:27px}
.contact-card-top{display:flex;align-items:center;justify-content:space-between}
.contact-card-top>.icon{width:31px;height:31px;color:#0a9169;stroke-width:1.4}
.contact-card-top>span{font-size:9px;color:#91a7b2;letter-spacing:1.2px}
.contact-card h3{font-weight:500;color:#597587;font-size:15px;margin:25px 0 16px}
.contact-phone-number{display:block;white-space:nowrap;color:#08734e;font:600 31px Arial,sans-serif;line-height:1.75;letter-spacing:-.4px}
.contact-card address{font-style:normal;font-size:14px;line-height:1.7;color:#7b919d;min-height:54px}
.contact-card address span{display:block}
.contact-card address strong{font-size:22px;font-weight:500;color:#294c62}
.contact-card>p{font-size:12px;line-height:1.9;color:#657e8d;margin:17px 0 24px;min-height:23px}
.contact-card-link{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #e0eae8;padding-top:18px;color:#178366;font-size:12px}
.contact-card-link .icon{width:18px;height:18px}
.contact-business-links{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;min-height:54px}
.contact-business-links>a{background:#f0f5f6;color:#476d80;font-size:12px;padding:8px 10px}
.contact-business-links>a:hover{background:#e5f4ed;color:#078757}
.contact-visit{background:#f1f6f7;padding:60px 0}
.contact-visit>.container{display:grid;grid-template-columns:1.14fr 1fr;gap:70px;align-items:center}
.contact-visit-image{position:relative;min-width:0;height:420px;overflow:hidden}
.contact-visit-image>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.contact-visit-image>div{position:absolute;bottom:0;left:0;right:0;padding:70px 31px 27px;background:linear-gradient(transparent,#07374dd9);color:#fff}
.contact-visit-image>div>span{display:block;font-size:10px;color:#bfdfdb;letter-spacing:2.8px;margin-bottom:11px}
.contact-visit-image strong{font-size:21px;font-weight:500;letter-spacing:.5px;line-height:1.6}
.contact-section-heading>span{display:block;color:#199672;font-size:10px;letter-spacing:2px;margin-bottom:12px}
.contact-section-heading h2{font-size:31px;color:#163d58;font-weight:600;line-height:1.5;margin:0}
.contact-section-heading>p{color:#697f8d;font-size:14px;margin:13px 0 0;line-height:1.9}
.contact-person-details{margin:22px 0 0;padding:0}
.contact-person-details>div{display:grid;grid-template-columns:87px minmax(0,1fr);align-items:baseline;gap:8px;padding:7px 0;line-height:1.5}
.contact-person-details dt{color:#6f8998;font-size:15px}
.contact-person-details dd{margin:0;color:#214c62;font-size:20px;font-weight:500;overflow-wrap:anywhere}
.contact-person-details dd a{display:inline-block;color:inherit}
.contact-person-details dd a:hover{color:#00885e}
.contact-person-details>div:first-child dd{color:#067c57;font-size:22px}
.contact-person-details+.contact-location{padding-top:20px;border-top:1px solid #dce7e9;margin-top:20px}
.contact-location{display:flex;gap:17px;margin-top:29px}
.contact-location>.icon{width:27px;height:27px;color:#0b976d;margin-top:4px}
.contact-location>div>span{font-size:11px;color:#8aa0aa}
.contact-location address{font-style:normal;font-size:18px;line-height:1.8;color:#3b6073;margin-top:9px}
.contact-visit-copy>p{font-size:13px;color:#657d8b;line-height:2;margin:19px 0 24px;max-width:440px}
.contact-visit-actions{display:flex;align-items:center;gap:25px}
.contact-visit-actions>.button{border-radius:2px;font-size:13px;gap:17px;padding:14px 21px}
.contact-visit-actions .icon{width:18px;height:18px}
.contact-text-link{display:flex;align-items:center;gap:11px;color:#4f7889;font-size:12px}
.contact-visit-note{display:flex;align-items:center;gap:20px;border-top:1px solid #dce7e9;margin-top:26px;padding-top:21px}
.contact-visit-note>span{font-size:12px;color:#98aeb6}
.contact-visit-note>a{font:500 21px Arial,sans-serif;color:#347561}
.contact-preparation{padding-top:59px;padding-bottom:62px;scroll-margin-top:25px}
.contact-preparation-top{display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.contact-preparation-top>p{font-size:12px;color:#91a2ad;line-height:1.9;margin:0;text-align:right}
.contact-preparation-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:45px;margin-top:35px}
.contact-preparation-grid article{min-width:0}
.contact-preparation-grid article>div{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dde8eb;padding-bottom:19px}
.contact-preparation-grid article>div>span{font:400 36px Arial,sans-serif;color:#bfd9d5}
.contact-preparation-grid .icon{width:29px;height:29px;color:#19886b;stroke-width:1.5}
.contact-preparation-grid h3{font-size:21px;font-weight:500;color:#365c72;margin:23px 0 13px}
.contact-preparation-grid p{font-size:13px;color:#657d8b;line-height:1.95;margin:0}
.contact-ready{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:32px 39px;margin-top:45px;background:linear-gradient(110deg,#073a53,#075e66);color:white}
.contact-ready h3{font-size:23px;font-weight:500;margin:0 0 11px}
.contact-ready p{font-size:12px;color:#99c4ca;margin:0}
.contact-ready>a{display:flex;align-items:center;gap:19px;color:#c5ecdd;font:600 27px Arial,sans-serif;white-space:nowrap}
.contact-ready>a>.icon:first-child{width:29px;height:29px;stroke-width:1.5}
.contact-ready>a>.icon:last-child{width:22px;height:22px;margin-left:9px}
@media(max-width:1250px){
  .contact-card{padding:26px 23px 23px}.contact-phone-card{padding-top:24px}.contact-phone-number{font-size:27px}.contact-card address strong{font-size:20px}.contact-business-links>a{font-size:11px;padding:8px}
  .contact-card>p{min-height:46px}.contact-visit>.container{gap:42px}.contact-location address{font-size:16px}.contact-visit-image{height:420px}.contact-preparation-grid{gap:32px}
}
@media(max-width:1000px){
  .contact-cards{gap:18px}.contact-card{padding:23px 19px}.contact-phone-card{padding-top:21px}.contact-phone-number{font-size:23px}.contact-card h3{font-size:14px}
  .contact-card-top>span{font-size:8px;letter-spacing:.4px}.contact-card address strong{font-size:17px}.contact-card address{font-size:12px}.contact-card>p{font-size:11px}
  .contact-card address,.contact-phone-number{min-height:76px}.contact-business-links{min-height:76px}.contact-business-links>a{font-size:10px}
  .contact-visit>.container{gap:30px}.contact-section-heading h2{font-size:27px}.contact-location{gap:11px}.contact-visit-image strong{font-size:18px}.contact-visit-image>div{padding:55px 24px 23px}
  .contact-preparation-top{align-items:flex-start;flex-direction:column;gap:15px}.contact-preparation-top>p{text-align:left}.contact-preparation-top>p br{display:none}
  .contact-ready h3{font-size:21px}.contact-ready>a{font-size:23px;gap:14px}.contact-ready{padding:30px}
}
@media(max-width:800px){
  .contact-hero{height:320px}.contact-hero h1{font-size:37px}.contact-overview{padding-top:40px;padding-bottom:43px}.contact-overview-heading h2{font-size:28px}.contact-overview-heading>p{display:none}
  .contact-cards{grid-template-columns:1fr}.contact-card{padding:27px 28px;position:relative}.contact-phone-card{padding-top:25px}.contact-card h3{margin-top:19px}
  .contact-phone-number{font-size:34px;min-height:0}.contact-card address,.contact-business-links{min-height:0}.contact-card address{font-size:14px}.contact-card address strong{font-size:22px}
  .contact-card>p{min-height:0;font-size:12px;margin-bottom:21px}.contact-business-links>a{font-size:12px}.contact-card-top>span{font-size:10px}
  .contact-visit{padding:40px 0}.contact-visit>.container{grid-template-columns:1fr;gap:32px}.contact-visit-image{height:350px}.contact-visit-copy>p{max-width:none}
  .contact-location address{font-size:18px}.contact-preparation{padding-top:42px;padding-bottom:43px}.contact-preparation-grid{gap:22px}.contact-preparation-grid h3{font-size:19px}.contact-preparation-grid p{font-size:12px}
  .contact-ready{flex-direction:column;align-items:flex-start;gap:25px}.contact-ready>a{font-size:27px}
}
@media(max-width:500px){
  .contact-person-details>div{grid-template-columns:73px minmax(0,1fr);padding:8px 0;gap:7px}.contact-person-details dt{font-size:14px}.contact-person-details dd{font-size:18px}.contact-person-details>div:first-child dd{font-size:21px}
  .contact-hero{height:300px}.contact-hero>.container{padding-top:23px}.contact-breadcrumb{font-size:11px}.contact-hero .contact-eyebrow{margin-top:31px;font-size:9px}
  .contact-hero h1{font-size:31px;letter-spacing:1px;margin-top:14px}.contact-hero p{font-size:11px;letter-spacing:0;max-width:310px;line-height:1.9}
  .contact-eyebrow{font-size:9px}.contact-overview-heading h2{font-size:26px}.contact-overview-heading{margin-bottom:26px}.contact-card{padding:25px}.contact-phone-card{padding-top:23px}
  .contact-phone-number{font-size:31px}.contact-card-top>.icon{width:28px;height:28px}.contact-card h3{margin:22px 0 13px}.contact-card address strong{font-size:21px}
  .contact-card-top>span{font-size:9px}.contact-visit-image{height:250px}.contact-visit-image strong{font-size:17px}.contact-visit-image>div>span{font-size:9px}
  .contact-section-heading h2{font-size:25px}.contact-section-heading>p{font-size:12px}.contact-location address{font-size:16px}.contact-visit-copy>p{font-size:12px}
  .contact-visit-actions{gap:22px}.contact-visit-actions>.button{font-size:12px;padding:13px 17px;gap:10px}.contact-text-link{font-size:11px;gap:8px}.contact-preparation-top>p{font-size:11px}
  .contact-preparation-grid{grid-template-columns:1fr;gap:30px}.contact-preparation-grid article>div{padding-bottom:14px}.contact-preparation-grid article>div>span{font-size:31px}
  .contact-preparation-grid h3{margin-top:18px;font-size:21px}.contact-preparation-grid p{font-size:13px}.contact-ready{padding:27px 24px;margin-top:32px}
  .contact-ready h3{font-size:20px;line-height:1.7}.contact-ready p{font-size:10px;line-height:1.8}.contact-ready>a{font-size:23px;gap:11px}.contact-ready>a>.icon:first-child{width:24px;height:24px}.contact-ready>a>.icon:last-child{display:none}
}
@media(max-width:350px){.contact-phone-number{font-size:26px}.contact-business-links{gap:6px}.contact-business-links>a{font-size:11px;padding:7px}.contact-ready>a{font-size:21px}.contact-ready{padding:24px 20px}}

/* 06. Shared image positioning (formerly style attributes). */
.news-photo { object-fit: cover; }
img[data-image-position="center"] { object-position: center; }
img[data-image-position="center 30%"] { object-position: center 30%; }
img[data-image-position="center 40%"] { object-position: center 40%; }
img[data-image-position="center 42%"] { object-position: center 42%; }
img[data-image-position="center 50%"] { object-position: center 50%; }
img[data-image-position="center 58%"] { object-position: center 58%; }
img[data-image-position="center 60%"] { object-position: center 60%; }