:root{--ink:#17212b;--muted:#5d6975;--line:#d9e0e6;--soft:#f4f7f8;--paper:#ffffff;--blue:#0b6f95;--blue-dark:#07516d;--green:#34735f;--amber:#b06818;--shadow:0 14px 34px rgba(23,33,43,0.11)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Arial,Noto Sans TC,Microsoft JhengHei,sans-serif;background:radial-gradient(circle at 12% 18%,rgba(11,111,149,.1),transparent 28%),radial-gradient(circle at 86% 8%,rgba(52,115,95,.1),transparent 25%),linear-gradient(180deg,#f8fbfc,#ffffff 42%,#f4f7f8);line-height:1.65}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.site-header{position:-webkit-sticky;position:sticky;top:0;z-index:10;justify-content:space-between;gap:20px;padding:14px clamp(18px,4vw,56px);background:rgba(255,255,255,.94);border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand,.site-header{display:flex;align-items:center}.brand{min-width:330px;min-height:62px;padding:8px 18px 10px;border-radius:2px;color:#0b6f95;background:white}.brand small,.brand strong{display:block}.brand strong{font-size:31px;line-height:1.1;letter-spacing:0;font-weight:800}.brand small{color:#0b6f95;font-size:17px;font-weight:700;line-height:1.15}.nav-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;color:var(--blue-dark);font-size:15px;font-weight:700}.nav-links a{display:inline-flex;min-height:36px;align-items:center;padding:6px 11px;border:1px solid transparent;border-radius:8px;background:transparent}.header-call:hover,.nav-links a:hover,.site-footer a:hover{color:var(--blue)}.nav-links a:hover{border-color:#bad4df;background:#f0f8fa}.header-call{display:inline-flex;min-height:38px;align-items:center;justify-content:center;padding:6px 12px;border:1px solid var(--blue);border-radius:8px;background:white;white-space:nowrap;color:var(--blue-dark);font-weight:700}.hero{position:relative;overflow:hidden;display:grid;min-height:560px;grid-template-columns:minmax(360px,1.05fr) minmax(320px,.95fr);grid-gap:clamp(30px,5vw,72px);gap:clamp(30px,5vw,72px);align-items:center;padding:clamp(28px,6vw,72px) clamp(18px,5vw,72px) 36px;background:radial-gradient(circle at 75% 18%,rgba(11,111,149,.08),transparent 28%),linear-gradient(180deg,#ffffff,#f3f9fb)}.hero:before{position:absolute;right:-8%;bottom:4%;width:min(54vw,720px);height:260px;background:radial-gradient(ellipse at center,rgba(35,161,218,.18),transparent 66%),repeating-linear-gradient(165deg,rgba(11,111,149,.08) 0 2px,transparent 2px 18px);content:"";opacity:1}.hero>*{position:relative;z-index:1}.hero-copy{max-width:760px}.hero-visual{position:relative;min-height:clamp(330px,44vw,540px)}.hero-visual:after,.hero-visual:before{position:absolute;inset:4% 2% 0 0;border-radius:42% 58% 52% 48%/38% 42% 58% 62%;content:""}.hero-visual:before{z-index:0;background:#27a86e;transform:translate(14px,18px) rotate(-3deg)}.hero-visual:after{z-index:1;background:#ffc20e;transform:translate(4px,5px) rotate(-2deg)}.hero-visual-frame{position:absolute;inset:8% 4% 4% 0;z-index:2;overflow:hidden;border-radius:42% 58% 52% 48%/38% 42% 58% 62%;box-shadow:0 20px 45px rgba(7,81,109,.2)}.hero-visual-frame img{width:100%;height:100%;object-fit:cover;object-position:center center;transform:scale(1.04)}.eyebrow{margin:0 0 10px;color:var(--green);font-weight:700}.hero-company{margin-bottom:8px;color:var(--blue-dark);font-size:clamp(24px,4vw,38px);font-weight:800;line-height:1.2}h1,h2,h3,p{margin-top:0}h1{margin-bottom:18px;color:var(--blue-dark);font-size:clamp(38px,5vw,64px);line-height:1.12}h1,h2{letter-spacing:0}h2{margin-bottom:12px;font-size:clamp(28px,4vw,42px);line-height:1.2}h3{margin-bottom:8px;line-height:1.35}.lead,h3{font-size:20px}.lead{max-width:720px;color:var(--muted)}.need-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.need-list span{display:inline-flex;min-height:38px;align-items:center;padding:6px 14px;border:1px solid #bad4df;border-radius:8px;color:var(--blue-dark);background:white;font-weight:700}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}.button{display:inline-flex;min-height:46px;align-items:center;justify-content:center;padding:10px 18px;border:1px solid var(--blue);border-radius:8px;font-weight:700}.button.primary{color:white;background:var(--blue)}.button.secondary{color:var(--blue-dark);background:white}.hero-side{display:grid;grid-gap:12px;gap:12px}.hero-photo{overflow:hidden;border-radius:8px;box-shadow:var(--shadow);background:var(--soft)}.hero-photo img{width:100%;height:min(52vw,420px);object-fit:cover}.hero-photo figcaption{padding:10px 12px;margin:0;color:var(--muted);font-size:13px;background:white}.quick-contact{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:8px;background:white}.quick-contact span,.quick-contact strong{display:block}.quick-contact span{color:var(--muted)}.trust-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:1px;gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.trust-strip div{padding:20px clamp(16px,3vw,34px);background:white}.trust-strip strong{display:block;font-size:22px}.trust-strip span{color:var(--muted)}.section{position:relative;padding:clamp(48px,8vw,86px) clamp(18px,5vw,72px)}.section.soft{background:var(--soft)}.visual-section{background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.88)),url(/images/backgrounds/water-dispenser-bg.webp) 100% /460px auto no-repeat,radial-gradient(circle at right 20%,rgba(11,111,149,.1),transparent 28%),linear-gradient(90deg,rgba(255,255,255,.98),rgba(246,251,252,.94))}.photo-band{background:radial-gradient(circle at 18% 8%,rgba(11,111,149,.12),transparent 30%),radial-gradient(circle at 82% 24%,rgba(52,115,95,.1),transparent 26%),linear-gradient(180deg,rgba(244,247,248,.98),rgba(255,255,255,.98))}.section-head{max-width:760px;margin-bottom:28px}.section-actions{margin-top:22px}.grid{display:grid;grid-gap:16px;gap:16px}.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.card{min-height:170px;padding:22px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.94);box-shadow:0 8px 22px rgba(23,33,43,.06)}.service-link-card{display:block;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.service-link-card:hover{border-color:#9fc8d6;box-shadow:var(--shadow);transform:translateY(-2px)}.card p,.contact-panel p,.section-head p,.service-body p{color:var(--muted)}.tall-card{min-height:260px}.tall-card h2{font-size:24px}.compact-list{display:grid;grid-gap:8px;gap:8px;padding-left:20px;margin:14px 0 0;color:var(--muted)}.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,430px);grid-gap:clamp(28px,5vw,56px);gap:clamp(28px,5vw,56px);align-items:start}.check-list{display:grid;grid-gap:10px;gap:10px;padding:0;margin:18px 0 0;list-style:none}.check-list li{padding-left:28px;position:relative}.check-list li:before{position:absolute;left:0;top:2px;color:var(--green);content:"✓";font-weight:700}.photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:12px;gap:12px}.photo-grid img{width:100%;aspect-ratio:4/3;border-radius:8px;object-fit:cover;background:var(--soft);box-shadow:0 10px 24px rgba(23,33,43,.12)}.large-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}.large-gallery img{aspect-ratio:1/1}.contact-panel{padding:24px;border-radius:8px;background:var(--ink);color:white}.contact-panel p{color:#d8e0e5}.contact-panel .button{width:100%;margin-top:10px}.contact-panel .button.secondary{border-color:white}.contact-form{display:grid;max-width:920px;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:16px;gap:16px;padding:22px;border:1px solid var(--line);border-radius:8px;background:white}.contact-form label{display:grid;grid-gap:7px;gap:7px;color:var(--ink);font-weight:700}.contact-form input,.contact-form select,.contact-form textarea{width:100%;min-height:46px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:white;font:inherit}.contact-form textarea{resize:vertical}.form-note{margin:0;color:var(--muted);font-size:14px}.form-error,.form-success{padding:10px 12px;margin:0;border-radius:8px;font-weight:700}.form-success{color:#1f5f4f;background:#e8f6f1}.form-error{color:#8d321d;background:#fff0ea}.form-submit,.full-field{grid-column:1/-1}.page-hero{padding:clamp(44px,8vw,88px) clamp(18px,5vw,72px);background:linear-gradient(90deg,rgba(244,247,248,.98) 0,rgba(244,247,248,.9) 58%,rgba(244,247,248,.68) 100%),url(/images/backgrounds/water-dispenser-bg.webp) 100% /min(46vw,560px) auto no-repeat,repeating-linear-gradient(135deg,rgba(11,111,149,.06) 0 1px,transparent 1px 18px),var(--soft)}.page-hero .lead{max-width:820px}.photo-page-hero{min-height:360px;background:linear-gradient(90deg,rgba(7,81,109,.92),rgba(7,81,109,.72) 46%,rgba(7,81,109,.34)),url(/images/backgrounds/water-dispenser-bg.webp) 100% /cover;color:white}.photo-page-hero h1{color:white;text-shadow:0 2px 14px rgba(0,43,59,.45)}.photo-page-hero .eyebrow,.photo-page-hero .lead{color:#e9f6f9}.service-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);grid-gap:clamp(28px,5vw,56px);gap:clamp(28px,5vw,56px)}.info-box{padding:22px;border-left:4px solid var(--amber);background:#fff8ef}.product-list{grid-template-columns:repeat(2,minmax(0,1fr))}.category-pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px}.category-pills a{display:inline-flex;min-height:40px;align-items:center;padding:8px 14px;border:1px solid #bad4df;border-radius:8px;color:var(--blue-dark);background:white;font-weight:700}.product-category{scroll-margin-top:110px}.product-category+.product-category{margin-top:54px}.product-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.product-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.96);box-shadow:0 10px 24px rgba(23,33,43,.08)}.product-card img{width:100%;aspect-ratio:4/3;object-fit:contain;padding:14px;background:white;border-bottom:1px solid var(--line)}.product-card-body{display:flex;flex:1 1;flex-direction:column;gap:10px;padding:18px;min-width:0}.product-model{margin:0;color:var(--green);font-weight:800}.product-card h3{margin:0}.product-card p{color:var(--muted);overflow-wrap:anywhere;word-break:break-word}.product-spec{padding-top:10px;border-top:1px solid var(--line);font-size:14px;line-height:1.7}.product-details{min-width:0;margin-top:4px}.product-details summary{cursor:pointer;color:var(--blue-dark);font-weight:800}.product-details p{margin-top:10px}.product-actions{margin-top:auto;display:grid;grid-gap:8px;gap:8px;padding-top:10px}.product-actions .button{width:100%}.site-footer{display:grid;grid-template-columns:1.2fr 1fr 1.4fr;grid-gap:20px;gap:20px;padding:32px clamp(18px,5vw,72px);color:#e8eef2;background:#111920}.site-footer p{margin-bottom:4px}.footer-note{color:#b9c4cc}@media (max-width:920px){.site-header{align-items:flex-start;flex-direction:column;gap:12px}.nav-links{display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:stretch}.nav-links a{justify-content:center;min-height:42px;border-color:var(--line);background:white;text-align:center}.header-call{width:100%;min-height:44px;color:white;background:var(--blue)}.hero,.service-body,.site-footer,.split{grid-template-columns:1fr}.hero{min-height:auto;padding-top:26px}.hero-visual{min-height:380px}.page-hero,.visual-section{background:linear-gradient(rgba(255,255,255,.94),rgba(255,255,255,.94)),url(/images/backgrounds/water-dispenser-bg.webp) 50% /cover,var(--soft)}.photo-page-hero{background:linear-gradient(rgba(7,81,109,.86),rgba(7,81,109,.78)),url(/images/backgrounds/water-dispenser-bg.webp) 50% /cover}.photo-grid,.product-card-grid,.product-list,.service-grid,.trust-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.large-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:560px){body{background:var(--paper)}.site-header{position:static}.brand{width:100%;min-width:0;min-height:58px;padding:8px 10px}.brand strong{font-size:24px}.brand small{font-size:13px}.nav-links{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr));font-size:15px}.contact-form,.large-gallery,.photo-grid,.product-card-grid,.product-list,.service-grid,.trust-strip{grid-template-columns:1fr}.actions,.button{width:100%}.hero-company{font-size:28px}.hero-visual{min-height:280px}.lead{font-size:18px}.quick-contact{align-items:flex-start;flex-direction:column}}