/* 技冠科技｜四款設計提案（?style=a / b / c / d） */

/* 四版共用：首圖商品直接融入背景，不使用矩形展示底板 */
.jg-variant-a .jg-device,
.jg-variant-b .jg-device,
.jg-variant-c .jg-device,
.jg-variant-d .jg-device {
    background: transparent;
    box-shadow: none;
}
.jg-variant-a .jg-device img,
.jg-variant-b .jg-device img,
.jg-variant-c .jg-device img,
.jg-variant-d .jg-device img { mix-blend-mode: multiply; }
.jg-variant-a .jg-device figcaption,
.jg-variant-b .jg-device figcaption,
.jg-variant-c .jg-device figcaption,
.jg-variant-d .jg-device figcaption {
    width: max-content;
    min-width: 150px;
    padding: 9px 0 0;
    border: 0;
    border-top: 1px solid currentColor;
    background: transparent;
}

/* A｜霧銀訊號：保留原始構圖，將商品融入霧銀材質面 */
.jg-variant-a .jg-product-card { background: #dfe4df; }
.jg-variant-a .jg-device img,
.jg-variant-a .jg-product-image img { mix-blend-mode: multiply; }
.jg-variant-a .jg-device figcaption { border-color: #c5ccc6; }
.jg-variant-a .jg-product-image { background: #d7ddd8; }
.jg-variant-a .jg-product-card--dark { background: var(--jg-navy); }
.jg-variant-a .jg-product-card--dark .jg-product-image { background: #cfd6d3; }
.jg-variant-a .jg-product-copy { border-color: #c7cec8; }

/* B｜深夜控制台：深色儀器面板、橫向產品軌道 */
.jg-variant-b .jg {
    --jg-paper: #111a22;
    --jg-white: #dce1df;
    --jg-ink: #edf2ef;
    --jg-text: #aebbc0;
    --jg-soft: #86969d;
    --jg-line: #34444d;
    --jg-panel: #17242c;
    --jg-navy: #0b141b;
    --jg-signal: #e5aa3d;
}
.jg-variant-b .jg .navbar { background: #f5f1e8; }
.jg-variant-b .jg-hero { position: relative; background: #111a22; }
.jg-variant-b .jg-hero::before { content: ''; position: absolute; inset: var(--nav-h) 0 0; pointer-events: none; background: repeating-linear-gradient(90deg, transparent 0, transparent calc(8.333% - 1px), rgba(255,255,255,.035) calc(8.333% - 1px), rgba(255,255,255,.035) 8.333%); }
.jg-variant-b .jg-hero-grid { grid-template-columns: 35% 65%; gap: 24px; }
.jg-variant-b .jg-hero h1 small { color: #c8d2d4; }
.jg-variant-b .jg-tags span { border-color: #40505a; background: transparent; color: #b7c4c8; }
.jg-variant-b .jg-actions a { border-color: #56656d; color: #edf2ef; }
.jg-variant-b .jg-hero-visual { min-height: 540px; background: #0b141b; border: 1px solid #35434b; }
.jg-variant-b .jg-hero-visual::before { top: 26px; left: 26px; width: 10px; height: 10px; border-radius: 50%; background: var(--jg-signal); box-shadow: 24px 0 0 #47606a, 48px 0 0 #47606a; }
.jg-variant-b .jg-device img,
.jg-variant-b .jg-product-image img { mix-blend-mode: multiply; }
.jg-variant-b .jg-device-host { top: 86px; left: 45px; width: 50%; }
.jg-variant-b .jg-device-remote { right: 36px; bottom: 34px; width: 39%; }
.jg-variant-b .jg-device figcaption { color: #d8e1e1; }
.jg-variant-b .jg-about { background: #d9ddd8; color: #172630; }
.jg-variant-b .jg-about-copy p { color: #46545b; }
.jg-variant-b .jg-products { background: #17242c; }
.jg-variant-b .jg-product-grid { grid-template-columns: repeat(4,1fr); gap: 1px; background: #384750; }
.jg-variant-b .jg-product-card,
.jg-variant-b .jg-product-card--host,
.jg-variant-b .jg-product-card--dark { grid-column: span 1; grid-template-columns: 1fr; min-height: 510px; background: #111a22; color: #edf2ef; }
.jg-variant-b .jg-product-image,
.jg-variant-b .jg-product-card--dark .jg-product-image { min-height: 285px; padding: 30px 18px; background: #aeb8b7; }
.jg-variant-b .jg-product-image img,
.jg-variant-b .jg-product-image--tall img,
.jg-variant-b .jg-product-card--dark .jg-product-image img { height: 240px; }
.jg-variant-b .jg-product-copy,
.jg-variant-b .jg-product-card--dark .jg-product-copy { min-height: 225px; justify-content: flex-start; padding: 62px 25px 25px; border: 0; border-top: 1px solid #384750; }
.jg-variant-b .jg-product-copy p,
.jg-variant-b .jg-product-card--dark .jg-product-copy p { color: #aebbc0; }
.jg-variant-b .jg-use { background: #111a22; }
.jg-variant-b .jg-service { background: #e5aa3d; color: #13212a; }
.jg-variant-b .jg-service small,
.jg-variant-b .jg-service a,
.jg-variant-b .jg-service a span { color: #13212a; border-color: #13212a; }
.jg-variant-b .jg-service p { color: #34424a; }

/* C｜暖灰型錄：非對稱編輯排版，商品像型錄剪貼而非卡片 */
.jg-variant-c .jg {
    --jg-paper: #ece7de;
    --jg-ink: #272723;
    --jg-text: #5f5b53;
    --jg-soft: #847d72;
    --jg-line: #c9c0b4;
    --jg-panel: #d8d0c3;
    --jg-navy: #303c39;
    --jg-signal: #b45b2a;
}
.jg-variant-c .jg .navbar { background: #f5f1e9; }
.jg-variant-c .jg-hero { min-height: 720px; background: #ece7de; }
.jg-variant-c .jg-hero-grid { grid-template-columns: 48% 52%; gap: 0; align-items: stretch; }
.jg-variant-c .jg-hero-copy { padding: 72px 74px 62px 0; }
.jg-variant-c .jg-hero h1 { font-size: clamp(44px,5vw,70px); }
.jg-variant-c .jg-hero-visual { min-height: 555px; background: #cfc7b9; }
.jg-variant-c .jg-hero-visual::before { top: auto; bottom: -28px; left: -74px; width: 190px; height: 130px; background: #8e9a8b; }
.jg-variant-c .jg-hero-visual::after { color: #5e6159; }
.jg-variant-c .jg-signal { border-color: rgba(39,39,35,.22); }
.jg-variant-c .jg-device img,
.jg-variant-c .jg-product-image img { mix-blend-mode: multiply; }
.jg-variant-c .jg-device figcaption { color: #474740; }
.jg-variant-c .jg-device-host { top: 40px; left: -48px; width: 66%; }
.jg-variant-c .jg-device-remote { right: 22px; bottom: 4px; width: 47%; }
.jg-variant-c .jg-about { background: #f5f1e9; }
.jg-variant-c .jg-products { background: #d8d0c3; }
.jg-variant-c .jg-product-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 64px; }
.jg-variant-c .jg-product-card,
.jg-variant-c .jg-product-card--host,
.jg-variant-c .jg-product-card--dark { grid-column: auto; grid-template-columns: 1fr; min-height: 0; margin: 0 0 76px; background: transparent; color: #272723; overflow: visible; }
.jg-variant-c .jg-product-card:nth-child(even) { transform: translateY(95px); }
.jg-variant-c .jg-product-image,
.jg-variant-c .jg-product-card--dark .jg-product-image { min-height: 340px; padding: 24px; background: #c2b9aa; }
.jg-variant-c .jg-product-image img,
.jg-variant-c .jg-product-image--tall img,
.jg-variant-c .jg-product-card--dark .jg-product-image img { height: 295px; }
.jg-variant-c .jg-product-copy,
.jg-variant-c .jg-product-card--dark .jg-product-copy { min-height: 175px; justify-content: flex-start; padding: 48px 0 0; border: 0; }
.jg-variant-c .jg-model { top: 20px; left: 0; }
.jg-variant-c .jg-product-copy p,
.jg-variant-c .jg-product-card--dark .jg-product-copy p { color: #5f5b53; }
.jg-variant-c .jg-use { background: #f5f1e9; }
.jg-variant-c .jg-service { background: #303c39; }

/* D｜訊號藍圖：冷藍格線與工業橘，商品置於鋼藍展示台 */
.jg-variant-d .jg {
    --jg-paper: #eef2f1;
    --jg-ink: #102c42;
    --jg-text: #496270;
    --jg-soft: #71858e;
    --jg-line: #bfccd0;
    --jg-panel: #173e58;
    --jg-navy: #0e334c;
    --jg-signal: #ef7d32;
}
.jg-variant-d .jg-hero { position: relative; background-color: #e7edef; background-image: linear-gradient(rgba(22,67,91,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(22,67,91,.08) 1px,transparent 1px); background-size: 38px 38px; }
.jg-variant-d .jg-hero-grid { grid-template-columns: 39% 61%; }
.jg-variant-d .jg-hero-visual { min-height: 520px; background: #17465f; clip-path: polygon(7% 0,100% 0,100% 90%,91% 100%,0 100%,0 8%); }
.jg-variant-d .jg-hero-visual::before { top: 0; left: 0; width: 84px; height: 84px; background: #ef7d32; clip-path: polygon(0 0,100% 0,0 100%); }
.jg-variant-d .jg-signal { border-color: rgba(109,213,223,.42); }
.jg-variant-d .jg-device img,
.jg-variant-d .jg-product-image img { mix-blend-mode: multiply; }
.jg-variant-d .jg-device figcaption { color: #dcebed; }
.jg-variant-d .jg-about { background: #eef2f1; }
.jg-variant-d .jg-products { color: #edf5f6; background-color: #173e58; background-image: linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size: 42px 42px; }
.jg-variant-d .jg-products .jg-num { color: rgba(255,255,255,.18); }
.jg-variant-d .jg-products .jg-section-head > div:last-child p { color: #a9bdc5; }
.jg-variant-d .jg-product-grid { grid-template-columns: repeat(2,1fr); gap: 22px; }
.jg-variant-d .jg-product-card,
.jg-variant-d .jg-product-card--host,
.jg-variant-d .jg-product-card--dark { grid-column: auto; grid-template-columns: 44% 56%; min-height: 320px; background: #d3dddd; color: #102c42; clip-path: polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%); }
.jg-variant-d .jg-product-image,
.jg-variant-d .jg-product-card--dark .jg-product-image { min-height: 320px; background: #aebfc2; }
.jg-variant-d .jg-product-image img,
.jg-variant-d .jg-product-image--tall img,
.jg-variant-d .jg-product-card--dark .jg-product-image img { height: 235px; }
.jg-variant-d .jg-product-copy,
.jg-variant-d .jg-product-card--dark .jg-product-copy { justify-content: center; padding: 62px 26px 30px; border-color: #b2c1c2; }
.jg-variant-d .jg-product-copy p,
.jg-variant-d .jg-product-card--dark .jg-product-copy p { color: #496270; }
.jg-variant-d .jg-use { background: #e7edef; }
.jg-variant-d .jg-service { background: #ef7d32; color: #102c42; }
.jg-variant-d .jg-service small,
.jg-variant-d .jg-service p,
.jg-variant-d .jg-service a,
.jg-variant-d .jg-service a span { color: #102c42; border-color: #102c42; }

/* 最終共用：首圖連同大型展示色塊一起移除，商品直接懸浮於頁面 */
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-hero-visual {
    background: transparent;
    border: 0;
    clip-path: none;
}
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-hero-visual::before { display: none; }
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-host { width: 66%; }
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-remote { width: 52%; }
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-host img {
    height: 220px;
    padding: 4px;
    filter: contrast(1.08) saturate(1.05);
}
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-remote img {
    height: 310px;
    padding: 2px;
    filter: contrast(1.08) saturate(1.05);
}
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device figcaption small { font-size: 9px; }
:is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device figcaption strong { font-size: 16px; }
.jg-variant-a .jg-hero-visual::after,
.jg-variant-d .jg-hero-visual::after { color: rgba(20,44,62,.5); }
.jg-variant-a .jg-signal,
.jg-variant-c .jg-signal,
.jg-variant-d .jg-signal { border-color: rgba(20,58,76,.24); }
.jg-variant-d .jg-device figcaption { color: #24485b; }

@media (max-width: 1000px) {
    .jg-variant-b .jg-product-grid { grid-template-columns: repeat(2,1fr); }
    .jg-variant-c .jg-hero-copy { padding-right: 36px; }
    .jg-variant-d .jg-product-card,
    .jg-variant-d .jg-product-card--host,
    .jg-variant-d .jg-product-card--dark { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
    .jg-variant-b .jg-hero-grid,
    .jg-variant-c .jg-hero-grid,
    .jg-variant-d .jg-hero-grid { grid-template-columns: 1fr; }
    .jg-variant-b .jg-product-grid,
    .jg-variant-c .jg-product-grid,
    .jg-variant-d .jg-product-grid { grid-template-columns: 1fr; }
    .jg-variant-b .jg-product-card,
    .jg-variant-b .jg-product-card--host,
    .jg-variant-b .jg-product-card--dark { grid-column: auto; }
    .jg-variant-c .jg-hero-copy { padding: 24px 0 44px; }
    .jg-variant-c .jg-product-card:nth-child(even) { transform: none; }
    .jg-variant-d .jg-product-card,
    .jg-variant-d .jg-product-card--host,
    .jg-variant-d .jg-product-card--dark { grid-template-columns: 1fr; }
    :is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-host { width: 70%; }
    :is(.jg-variant-a,.jg-variant-b,.jg-variant-c,.jg-variant-d) .jg-device-remote { width: 57%; }
}

/* =========================================================
   第二輪主視覺：首圖改用場域與捲門，不再重複下方商品照片
   ========================================================= */
.jg-hero-visual .jg-scene { position: absolute; display: none; margin: 0; overflow: hidden; }
.jg-hero-visual .jg-scene img { width: 100%; height: 100%; object-fit: cover; }
.jg-scene-note { position: absolute; z-index: 4; display: flex; flex-direction: column; }
.jg-scene-note small { font-size: 8px; font-weight: 700; letter-spacing: .22em; }
.jg-scene-note strong { font-family: 'Noto Serif TC',serif; font-size: 22px; font-weight: 500; letter-spacing: .07em; }
.jg-scene-note span { font-size: 8px; letter-spacing: .16em; }
.jg-scene-index { position: absolute; z-index: 3; font-family: Georgia,serif; letter-spacing: .08em; }
.jg-scene-lines { position: absolute; z-index: 3; inset: 0; pointer-events: none; }
.jg-scene-lines i { position: absolute; display: block; border: 1px solid currentColor; border-radius: 50%; }
.jg-scene-lines i:nth-child(1) { width: 84px; height: 84px; }
.jg-scene-lines i:nth-child(2) { width: 150px; height: 150px; }
.jg-scene-lines i:nth-child(3) { width: 220px; height: 220px; }
.jg-scene-lines i:nth-child(4) { width: 8px; height: 8px; background: currentColor; }

/* A｜現場編輯：實景照片＋偏移資訊牌 */
.jg-variant-a .jg-hero { background: #f4f1e9; }
.jg-variant-a .jg-hero-grid { grid-template-columns: 36% 64%; gap: 52px; }
.jg-variant-a .jg-hero-visual { min-height: 565px; }
.jg-variant-a .jg-scene-photo { display: block; inset: 0 0 58px 34px; }
.jg-variant-a .jg-scene-photo img { object-position: 57% center; filter: saturate(.72) contrast(1.04); }
.jg-variant-a .jg-scene-note { left: 0; bottom: 0; width: 58%; padding: 25px 30px; background: #163848; color: #f7f2e8; }
.jg-variant-a .jg-scene-note small { color: #e0a04a; }
.jg-variant-a .jg-scene-note strong { margin: 9px 0 17px; }
.jg-variant-a .jg-scene-note span { color: #9bb0b8; }
.jg-variant-a .jg-scene-index { top: -28px; right: 0; color: #b85f2f; font-size: 15px; }
.jg-variant-a .jg-scene-lines { display: none; }

/* B｜金屬節奏：門片紋理成為大型視覺語言 */
.jg-variant-b .jg-hero { background: #10181e; }
.jg-variant-b .jg-hero-grid { grid-template-columns: 43% 57%; gap: 0; }
.jg-variant-b .jg-hero-copy { padding-right: 64px; }
.jg-variant-b .jg-hero-visual { min-height: 565px; overflow: hidden; }
.jg-variant-b .jg-scene-texture { display: block; inset: 0; }
.jg-variant-b .jg-scene-texture::after { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg,rgba(4,12,17,.18),rgba(4,12,17,.78)); }
.jg-variant-b .jg-scene-texture img { filter: grayscale(1) contrast(1.35); transform: scale(1.08); }
.jg-variant-b .jg-scene-note { left: 42px; right: 42px; bottom: 38px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.55); color: #fff; }
.jg-variant-b .jg-scene-note small { color: #edb04d; }
.jg-variant-b .jg-scene-note strong { margin: 12px 0 34px; font-size: 31px; }
.jg-variant-b .jg-scene-note span { color: #c0c8cb; }
.jg-variant-b .jg-scene-index { top: 26px; right: 30px; color: #edb04d; font-size: 17px; }
.jg-variant-b .jg-scene-lines { color: rgba(237,176,77,.42); }
.jg-variant-b .jg-scene-lines i { right: -45px; top: 60px; }
.jg-variant-b .jg-scene-lines i:nth-child(2) { right: -78px; top: 27px; }
.jg-variant-b .jg-scene-lines i:nth-child(3) { right: -113px; top: -8px; }
.jg-variant-b .jg-scene-lines i:nth-child(4) { right: 27px; top: 132px; }

/* C｜建築留白：獨立捲門剪影＋雜誌式大字 */
.jg-variant-c .jg-hero { background: #e9e2d6; }
.jg-variant-c .jg-hero-grid { grid-template-columns: 45% 55%; gap: 10px; }
.jg-variant-c .jg-hero-visual { min-height: 585px; }
.jg-variant-c .jg-scene-cutout { display: block; inset: 20px 0 0 0; }
.jg-variant-c .jg-scene-cutout img { object-fit: contain; object-position: center bottom; filter: sepia(.08) contrast(1.08); }
.jg-variant-c .jg-scene-note { top: 34px; right: 0; align-items: flex-end; color: #282824; }
.jg-variant-c .jg-scene-note small { color: #b45b2a; }
.jg-variant-c .jg-scene-note strong { order: -1; margin-bottom: 11px; font-size: 17px; }
.jg-variant-c .jg-scene-note span { margin-top: 9px; color: #756d62; }
.jg-variant-c .jg-scene-index { left: -12px; bottom: -36px; color: rgba(180,91,42,.22); font-size: 96px; }
.jg-variant-c .jg-scene-lines { color: rgba(180,91,42,.3); }
.jg-variant-c .jg-scene-lines i { left: 18px; top: 22px; }
.jg-variant-c .jg-scene-lines i:nth-child(2) { left: -15px; top: -11px; }
.jg-variant-c .jg-scene-lines i:nth-child(3) { left: -50px; top: -46px; }
.jg-variant-c .jg-scene-lines i:nth-child(4) { left: 56px; top: 60px; }

/* D｜訊號建築：藍圖格線＋裁切現場照片 */
.jg-variant-d .jg-hero { background-color: #e8eeef; }
.jg-variant-d .jg-hero-grid { grid-template-columns: 40% 60%; gap: 48px; }
.jg-variant-d .jg-hero-visual { min-height: 565px; }
.jg-variant-d .jg-hero-visual::before { content: ''; display: block; position: absolute; inset: -34px -34px 30px 68px; background-image: linear-gradient(rgba(18,71,98,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(18,71,98,.09) 1px,transparent 1px); background-size: 28px 28px; }
.jg-variant-d .jg-scene-photo { display: block; inset: 38px 25px 54px 0; clip-path: polygon(0 0,94% 0,100% 9%,100% 100%,8% 100%,0 91%); }
.jg-variant-d .jg-scene-photo img { object-position: 60% center; filter: grayscale(.55) saturate(.7) contrast(1.1); }
.jg-variant-d .jg-scene-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(120deg,rgba(9,55,78,.08),rgba(9,55,78,.34)); }
.jg-variant-d .jg-scene-note { right: 0; bottom: 0; width: 54%; padding: 22px 25px; background: #f07831; color: #0f3043; }
.jg-variant-d .jg-scene-note strong { margin: 8px 0 15px; }
.jg-variant-d .jg-scene-note span { color: #244b5d; }
.jg-variant-d .jg-scene-index { top: 3px; left: -22px; color: #0f4059; font-size: 15px; writing-mode: vertical-rl; }
.jg-variant-d .jg-scene-lines { color: rgba(106,209,220,.55); }
.jg-variant-d .jg-scene-lines i { right: 5px; top: 70px; }
.jg-variant-d .jg-scene-lines i:nth-child(2) { right: -28px; top: 37px; }
.jg-variant-d .jg-scene-lines i:nth-child(3) { right: -63px; top: 2px; }
.jg-variant-d .jg-scene-lines i:nth-child(4) { right: 77px; top: 142px; }

@media (max-width: 760px) {
    .jg-variant-a .jg-hero-grid,
    .jg-variant-b .jg-hero-grid,
    .jg-variant-c .jg-hero-grid,
    .jg-variant-d .jg-hero-grid { grid-template-columns: 1fr; gap: 28px; }
    .jg-variant-b .jg-hero-copy { padding-right: 0; }
    .jg-variant-a .jg-hero-visual,
    .jg-variant-b .jg-hero-visual,
    .jg-variant-c .jg-hero-visual,
    .jg-variant-d .jg-hero-visual { min-height: 440px; }
    .jg-variant-a .jg-scene-photo { left: 0; }
    .jg-variant-c .jg-scene-index { font-size: 64px; }
}

/* =========================================================
   A 定案｜由手持 J-666 首圖延伸的正式整頁視覺
   ========================================================= */
.jg-variant-a .jg-system-strip { position: relative; background: #163848; }
.jg-variant-a .jg-system-strip::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: #b85f2f; }
.jg-variant-a .jg-system-strip-grid > div { border-color: rgba(255,255,255,.13); }
.jg-variant-a .jg-system-strip-grid span,
.jg-variant-a .jg-system-strip-title small { color: #e1a04a; }

.jg-variant-a .jg-about { position: relative; padding: 96px 0 108px; background: #fbfaf6; }
.jg-variant-a .jg-about::after { content: 'CONTROL / MATCHING / SERVICE'; position: absolute; right: 18px; top: 100px; color: #b6b9b4; font-size: 7px; letter-spacing: .25em; writing-mode: vertical-rl; }
.jg-variant-a .jg-about-grid { grid-template-columns: 82px .9fr 1.15fr; row-gap: 28px; }
.jg-variant-a .jg-section-mark span { color: #dedbd2; }
.jg-variant-a .jg-about-title h2 { margin-top: 18px; font-size: clamp(30px,3.2vw,43px); }
.jg-variant-a .jg-about-copy { padding-top: 32px; }
.jg-variant-a .jg-process { border-color: #d7dad5; }
.jg-variant-a .jg-process > div + div { border-color: #d7dad5; }
.jg-variant-a .jg-process > div::after { content: ''; position: absolute; right: 18px; top: 30px; width: 5px; height: 5px; border-radius: 50%; background: #c18428; box-shadow: 0 0 0 6px rgba(193,132,40,.1); }

.jg-variant-a .jg-products { position: relative; padding-top: 92px; background: #e5e9e4; }
.jg-variant-a .jg-products::before { content: ''; position: absolute; top: 0; left: 50%; width: min(1200px,calc(100% - 48px)); height: 1px; transform: translateX(-50%); background: #bcc5bd; }
.jg-variant-a .jg-section-head { margin-bottom: 44px; }
.jg-variant-a .jg-section-head h2 { font-size: 38px; }
.jg-variant-a .jg-product-card { position: relative; background: #eef0eb; }
.jg-variant-a .jg-product-card::after { content: ''; position: absolute; top: 0; right: 0; width: 28px; height: 3px; background: #c18428; }
.jg-variant-a .jg-product-image { background: #d4dad5; }
.jg-variant-a .jg-product-card--dark { background: #163848; }
.jg-variant-a .jg-product-card--dark::after { background: #e1a04a; }
.jg-variant-a .jg-product-card--dark .jg-product-image { background: #cbd3cf; }
.jg-variant-a .jg-product-copy { border-color: #cbd1cb; }
.jg-variant-a .jg-product-copy h3 { font-size: 25px; }

.jg-variant-a .jg-use { padding: 110px 0 72px; background: #fbfaf6; }
.jg-variant-a .jg-use-grid { grid-template-columns: 225px 1fr 350px; gap: 48px; }
.jg-variant-a .jg-use-list > div { grid-template-columns: 38px 135px 1fr; transition: padding .2s ease,background .2s ease; }
.jg-variant-a .jg-use-list > div:hover { padding-left: 12px; background: rgba(22,56,72,.035); }
.jg-variant-a .jg-service { min-height: 365px; background: #163848; }
.jg-variant-a .jg-service::before { content: '03'; position: absolute; right: 24px; top: 22px; color: rgba(255,255,255,.08); font-family: Georgia,serif; font-size: 76px; }

@media (max-width: 1000px) {
    .jg-variant-a .jg-use-grid { grid-template-columns: 200px 1fr; }
    .jg-variant-a .jg-service { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
    .jg-variant-a .jg-about-grid { grid-template-columns: 1fr; }
    .jg-variant-a .jg-use-grid { grid-template-columns: 1fr; }
    .jg-variant-a .jg-service { grid-column: auto; }
}

/* 02｜不對稱產品型錄 */
.jg-variant-a .jg-product-grid { gap: 22px; }
.jg-variant-a .jg-product-card--host { grid-column: span 8; min-height: 390px; grid-template-columns: 52% 48%; }
.jg-variant-a .jg-product-card--dark { grid-column: span 4; min-height: 390px; }
.jg-variant-a .jg-product-card:nth-child(3) { grid-column: span 5; grid-template-columns: 1fr; }
.jg-variant-a .jg-product-card:nth-child(4) { grid-column: span 7; grid-template-columns: 43% 57%; }
.jg-variant-a .jg-product-card:nth-child(3) .jg-product-image { min-height: 295px; }
.jg-variant-a .jg-product-card:nth-child(3) .jg-product-copy { min-height: 190px; padding-top: 60px; border-left: 0; border-top: 1px solid #cbd1cb; }
.jg-variant-a .jg-product-card:nth-child(3) .jg-model { top: 25px; }
.jg-variant-a .jg-product-card:nth-child(4) { background: #e9e3d8; }
.jg-variant-a .jg-product-card:nth-child(4) .jg-product-image { background: #d7d2c8; }
.jg-variant-a .jg-product-card:hover .jg-product-image img { transform: translateY(-5px) scale(1.025); }
.jg-variant-a .jg-product-image img { transition: transform .35s ease; }
.jg-variant-a .jg-product-copy::before { content: ''; position: absolute; left: 30px; bottom: 27px; width: 24px; height: 1px; background: #c18428; opacity: .7; }
.jg-variant-a .jg-product-copy { padding-bottom: 58px; }

/* 03｜訊號節點清單與切角服務牌 */
.jg-variant-a .jg-use { position: relative; }
.jg-variant-a .jg-use::before { content: ''; position: absolute; top: 0; bottom: 0; left: calc(50% - 600px); width: 1px; background: #dedfd9; }
.jg-variant-a .jg-use-head { position: relative; padding-left: 24px; }
.jg-variant-a .jg-use-head::before { content: ''; position: absolute; top: 4px; left: 0; width: 3px; height: 74px; background: #b85f2f; }
.jg-variant-a .jg-use-list { position: relative; }
.jg-variant-a .jg-use-list::before { content: ''; position: absolute; top: 43px; bottom: 43px; left: 18px; width: 1px; background: #d3aa6c; }
.jg-variant-a .jg-use-list > div { position: relative; min-height: 92px; padding-left: 0; }
.jg-variant-a .jg-use-list > div::before { content: ''; position: absolute; z-index: 1; left: 14px; top: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: #fbfaf6; border: 1px solid #c18428; }
.jg-variant-a .jg-use-list span { position: relative; z-index: 2; padding-left: 30px; }
.jg-variant-a .jg-use-list > div:hover { padding-left: 8px; }
.jg-variant-a .jg-service { clip-path: polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%); }
.jg-variant-a .jg-service::after { border-color: rgba(225,160,74,.33); box-shadow: 0 0 0 34px rgba(225,160,74,.05),0 0 0 68px rgba(225,160,74,.035); }
.jg-variant-a .jg-service a { min-width: 150px; }

/* 頁尾｜與首圖共用深藍綠、暖金系統 */
.jg-variant-a .jg .footer { border-top: 4px solid #b85f2f; background: #142f3e; }
.jg-variant-a .jg .footer .footer-top { padding: 34px 0 24px; background: #142f3e; }
.jg-variant-a .jg .footer .footer-brand h3 { color: #f3f0e7; }
.jg-variant-a .jg .footer .footer-brand .footer-tax,
.jg-variant-a .jg .footer .line-id { color: #a9b7bb; }
.jg-variant-a .jg .footer .fc-label { color: #d7a05a; }
.jg-variant-a .jg .footer .fc-item p,
.jg-variant-a .jg .footer .fc-item a,
.jg-variant-a .jg .footer .hours-row,
.jg-variant-a .jg .footer .hours-day,
.jg-variant-a .jg .footer .hours-time,
.jg-variant-a .jg .footer .fc-sub { color: #dbe2e1 !important; }
.jg-variant-a .jg .footer .fc-link { color: #e0a04a !important; }
.jg-variant-a .jg .footer .ft-div { border-color: rgba(255,255,255,.14); }
.jg-variant-a .jg .footer .ft-cats a { color: #c5d0d1; }
.jg-variant-a .jg .footer .ft-cats .lb { color: #d7a05a; }
.jg-variant-a .jg .footer .ft-cats .sep { color: #60747c; }
.jg-variant-a .jg .footer .footer-bottom { background: #0d2633; border-color: rgba(255,255,255,.1); }
.jg-variant-a .jg .footer .footer-bottom p,
.jg-variant-a .jg .footer .ft-bq a { color: #aebdc1; }
.jg-variant-a .jg .footer .ft-bq .sep { color: #60747c; }
.jg-variant-a .jg .back-to-top { background: #b85f2f; color: #fff; }

@media (max-width: 1100px) {
    .jg-variant-a .jg-use::before { display: none; }
}
@media (max-width: 1000px) {
    .jg-variant-a .jg-product-card--host,
    .jg-variant-a .jg-product-card--dark,
    .jg-variant-a .jg-product-card:nth-child(3),
    .jg-variant-a .jg-product-card:nth-child(4) { grid-column: span 6; grid-template-columns: 1fr; }
    .jg-variant-a .jg-product-copy { min-height: 205px; border-left: 0; border-top: 1px solid #cbd1cb; }
}
@media (max-width: 760px) {
    .jg-variant-a .jg-product-card--host,
    .jg-variant-a .jg-product-card--dark,
    .jg-variant-a .jg-product-card:nth-child(3),
    .jg-variant-a .jg-product-card:nth-child(4) { grid-column: 1 / -1; }
    .jg-variant-a .jg-use-list::before,
    .jg-variant-a .jg-use-list > div::before { display: none; }
    .jg-variant-a .jg-use-list span { padding-left: 0; }
}

/* =========================================================
   下方區塊四款提案（固定使用 A 首圖）
   layout=a 現場編輯／b 深色技術／c 暖灰型錄／d 訊號藍圖
   ========================================================= */

/* B｜深色技術：像控制設備型錄，產品四欄整齊展開 */
.jg-variant-a.jg-layout-b .jg-system-strip { background: #c68a2d; color: #101a21; }
.jg-variant-a.jg-layout-b .jg-system-strip::before { background: #101a21; }
.jg-variant-a.jg-layout-b .jg-system-strip-grid > div { border-color: rgba(16,26,33,.18); }
.jg-variant-a.jg-layout-b .jg-system-strip-grid span,
.jg-variant-a.jg-layout-b .jg-system-strip-title small { color: #132630; }
.jg-variant-a.jg-layout-b .jg-system-strip-grid small { color: #3e4a4d; }
.jg-variant-a.jg-layout-b .jg-about { background: #121c23; color: #f1f2ed; }
.jg-variant-a.jg-layout-b .jg-about::after { color: #52636b; }
.jg-variant-a.jg-layout-b .jg-about-copy p,
.jg-variant-a.jg-layout-b .jg-process small { color: #abb8bd; }
.jg-variant-a.jg-layout-b .jg-section-mark,
.jg-variant-a.jg-layout-b .jg-process,
.jg-variant-a.jg-layout-b .jg-process > div + div { border-color: #35434a; }
.jg-variant-a.jg-layout-b .jg-section-mark span { color: #334149; }
.jg-variant-a.jg-layout-b .jg-products { background: #1a2831; color: #f0f2ef; }
.jg-variant-a.jg-layout-b .jg-products::before { background: #40505a; }
.jg-variant-a.jg-layout-b .jg-products .jg-num { color: #394b55; }
.jg-variant-a.jg-layout-b .jg-products .jg-section-head p { color: #9dabb1; }
.jg-variant-a.jg-layout-b .jg-product-grid { grid-template-columns: repeat(4,1fr); gap: 1px; background: #48565d; }
.jg-variant-a.jg-layout-b .jg-product-card,
.jg-variant-a.jg-layout-b .jg-product-card--host,
.jg-variant-a.jg-layout-b .jg-product-card--dark,
.jg-variant-a.jg-layout-b .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-b .jg-product-card:nth-child(4) { grid-column: span 1; grid-template-columns: 1fr; min-height: 520px; background: #111b22; color: #f3f3ee; }
.jg-variant-a.jg-layout-b .jg-product-image,
.jg-variant-a.jg-layout-b .jg-product-card:nth-child(3) .jg-product-image,
.jg-variant-a.jg-layout-b .jg-product-card:nth-child(4) .jg-product-image { min-height: 285px; background: #aeb9b8; }
.jg-variant-a.jg-layout-b .jg-product-copy,
.jg-variant-a.jg-layout-b .jg-product-card:nth-child(3) .jg-product-copy { min-height: 235px; padding: 62px 24px 50px; border: 0; border-top: 1px solid #384750; }
.jg-variant-a.jg-layout-b .jg-product-copy p { color: #aebbc0; }
.jg-variant-a.jg-layout-b .jg-use { background: #e5e8e3; }
.jg-variant-a.jg-layout-b .jg-use-list > div::before { background: #e5e8e3; }
.jg-variant-a.jg-layout-b .jg-service { background: #c68a2d; color: #14232b; }
.jg-variant-a.jg-layout-b .jg-service small,
.jg-variant-a.jg-layout-b .jg-service p,
.jg-variant-a.jg-layout-b .jg-service a,
.jg-variant-a.jg-layout-b .jg-service a span { color: #14232b; border-color: #14232b; }

/* C｜暖灰型錄：大留白、錯落商品，較接近建築雜誌 */
.jg-variant-a.jg-layout-c .jg-system-strip { background: #8c9687; }
.jg-variant-a.jg-layout-c .jg-system-strip::before { background: #a9522b; }
.jg-variant-a.jg-layout-c .jg-about { background: #eee8dc; }
.jg-variant-a.jg-layout-c .jg-about-grid { grid-template-columns: 70px 1.05fr 1fr; }
.jg-variant-a.jg-layout-c .jg-about-title h2 { font-size: clamp(34px,3.5vw,48px); }
.jg-variant-a.jg-layout-c .jg-process { gap: 16px; border: 0; }
.jg-variant-a.jg-layout-c .jg-process > div { padding: 27px; background: rgba(255,255,255,.38); }
.jg-variant-a.jg-layout-c .jg-process > div + div { border: 0; }
.jg-variant-a.jg-layout-c .jg-products { background: #d6cec0; }
.jg-variant-a.jg-layout-c .jg-products::before { background: #b8ad9e; }
.jg-variant-a.jg-layout-c .jg-product-grid { grid-template-columns: 1fr 1fr; gap: 0 64px; background: transparent; }
.jg-variant-a.jg-layout-c .jg-product-card,
.jg-variant-a.jg-layout-c .jg-product-card--host,
.jg-variant-a.jg-layout-c .jg-product-card--dark,
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(4) { grid-column: auto; grid-template-columns: 1fr; min-height: 0; margin-bottom: 72px; background: transparent; color: #292923; overflow: visible; }
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(even) { transform: translateY(88px); }
.jg-variant-a.jg-layout-c .jg-product-image,
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(3) .jg-product-image,
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(4) .jg-product-image { min-height: 350px; background: #bfb6a7; }
.jg-variant-a.jg-layout-c .jg-product-copy,
.jg-variant-a.jg-layout-c .jg-product-card:nth-child(3) .jg-product-copy { min-height: 175px; padding: 52px 0 30px; border: 0; }
.jg-variant-a.jg-layout-c .jg-product-copy p { color: #5d5a53; }
.jg-variant-a.jg-layout-c .jg-product-copy::before { left: 0; bottom: 12px; }
.jg-variant-a.jg-layout-c .jg-model { left: 0; }
.jg-variant-a.jg-layout-c .jg-use { background: #f2ede4; }
.jg-variant-a.jg-layout-c .jg-service { background: #3c4944; }
.jg-variant-a.jg-layout-c .jg .footer { border-color: #a9522b; background: #3c4944; }
.jg-variant-a.jg-layout-c .jg .footer .footer-top { background: #3c4944; }
.jg-variant-a.jg-layout-c .jg .footer .footer-bottom { background: #303b37; }

/* D｜訊號藍圖：工程格線、切角模組、亮橘服務牌 */
.jg-variant-a.jg-layout-d .jg-system-strip { background: #194761; }
.jg-variant-a.jg-layout-d .jg-system-strip::before { background: #ed7831; }
.jg-variant-a.jg-layout-d .jg-about { background-color: #e9eff0; background-image: linear-gradient(rgba(18,70,95,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(18,70,95,.065) 1px,transparent 1px); background-size: 34px 34px; }
.jg-variant-a.jg-layout-d .jg-process > div { background: rgba(233,239,240,.84); }
.jg-variant-a.jg-layout-d .jg-products { color: #edf4f4; background-color: #173f57; background-image: linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size: 38px 38px; }
.jg-variant-a.jg-layout-d .jg-products .jg-num { color: rgba(255,255,255,.17); }
.jg-variant-a.jg-layout-d .jg-products .jg-section-head p { color: #a7bac1; }
.jg-variant-a.jg-layout-d .jg-product-grid { grid-template-columns: 1fr 1fr; gap: 22px; }
.jg-variant-a.jg-layout-d .jg-product-card,
.jg-variant-a.jg-layout-d .jg-product-card--host,
.jg-variant-a.jg-layout-d .jg-product-card--dark,
.jg-variant-a.jg-layout-d .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-d .jg-product-card:nth-child(4) { grid-column: auto; grid-template-columns: 44% 56%; min-height: 340px; background: #d2dcdb; color: #123448; clip-path: polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%); }
.jg-variant-a.jg-layout-d .jg-product-image,
.jg-variant-a.jg-layout-d .jg-product-card:nth-child(3) .jg-product-image,
.jg-variant-a.jg-layout-d .jg-product-card:nth-child(4) .jg-product-image { min-height: 340px; background: #aebfc1; }
.jg-variant-a.jg-layout-d .jg-product-copy,
.jg-variant-a.jg-layout-d .jg-product-card:nth-child(3) .jg-product-copy { min-height: 340px; justify-content: center; padding: 66px 26px 54px; border-color: #b1c0c1; }
.jg-variant-a.jg-layout-d .jg-product-copy p { color: #4c6470; }
.jg-variant-a.jg-layout-d .jg-use { background: #e8edef; }
.jg-variant-a.jg-layout-d .jg-use-list > div::before { background: #e8edef; border-color: #ed7831; }
.jg-variant-a.jg-layout-d .jg-service { background: #ed7831; color: #123448; }
.jg-variant-a.jg-layout-d .jg-service small,
.jg-variant-a.jg-layout-d .jg-service p,
.jg-variant-a.jg-layout-d .jg-service a,
.jg-variant-a.jg-layout-d .jg-service a span { color: #123448; border-color: #123448; }
.jg-variant-a.jg-layout-d .jg .footer { border-color: #ed7831; }

@media (max-width: 1000px) {
    .jg-variant-a.jg-layout-b .jg-product-grid { grid-template-columns: repeat(2,1fr); }
    .jg-variant-a.jg-layout-b .jg-product-card,
    .jg-variant-a.jg-layout-b .jg-product-card--host,
    .jg-variant-a.jg-layout-b .jg-product-card--dark,
    .jg-variant-a.jg-layout-b .jg-product-card:nth-child(3),
    .jg-variant-a.jg-layout-b .jg-product-card:nth-child(4) { grid-column: auto; }
    .jg-variant-a.jg-layout-d .jg-product-card,
    .jg-variant-a.jg-layout-d .jg-product-card--host,
    .jg-variant-a.jg-layout-d .jg-product-card--dark,
    .jg-variant-a.jg-layout-d .jg-product-card:nth-child(3),
    .jg-variant-a.jg-layout-d .jg-product-card:nth-child(4) { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .jg-variant-a.jg-layout-b .jg-product-grid,
    .jg-variant-a.jg-layout-c .jg-product-grid,
    .jg-variant-a.jg-layout-d .jg-product-grid { grid-template-columns: 1fr; }
    .jg-variant-a.jg-layout-c .jg-product-card:nth-child(even) { transform: none; }
}

/* D 配色提案｜不改工程格線與切角結構 */
/* DA 墨綠霧金 */
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-products { background-color: #294b44; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip::before,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-card::after { background: #c7a761; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-about { background-color: #edf0e9; background-image: linear-gradient(rgba(48,83,74,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(48,83,74,.065) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-card { background: #dbe1da; color: #233c37; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-image { background: #bac7be; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-copy p { color: #526862; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-kicker,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-model { color: #b9944e; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service { background: #c7a761; color: #233c37; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service small,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service p,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service a,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service a span { color: #233c37; border-color: #233c37; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg .footer { border-color: #c7a761; }

/* DB 石墨冰藍 */
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-products { background-color: #29343b; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip::before,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-card::after { background: #78aeba; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-about { background-color: #edf2f3; background-image: linear-gradient(rgba(70,105,117,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(70,105,117,.07) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-card { background: #d8e1e3; color: #26363d; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-image { background: #afc0c4; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-copy p { color: #536970; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-kicker,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-model { color: #639aa7; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service { background: #78aeba; color: #1f3037; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service small,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service p,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service a,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service a span { color: #1f3037; border-color: #1f3037; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg .footer { border-color: #78aeba; }

/* DC 沙灰橄欖 */
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-products { background-color: #555f50; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip::before,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-card::after { background: #cfb17b; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-about { background-color: #eee8dc; background-image: linear-gradient(rgba(91,96,75,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(91,96,75,.065) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-card { background: #dfd7c9; color: #34382f; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-image { background: #c7beaf; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-copy p { color: #656458; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-kicker,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-model { color: #9a7c47; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service { background: #cfb17b; color: #34382f; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service small,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service p,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service a,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service a span { color: #34382f; border-color: #34382f; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg .footer { border-color: #cfb17b; }

/* DD 深藍鼠尾草 */
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-products { background-color: #19384c; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip::before,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-card::after { background: #91aa9d; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-about { background-color: #edf0ed; background-image: linear-gradient(rgba(43,76,85,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(43,76,85,.065) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-card { background: #dbe2dd; color: #203b46; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-image { background: #bdcbc4; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-copy p { color: #566c72; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-kicker,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-model { color: #668f7e; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service { background: #91aa9d; color: #19333f; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service small,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service p,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service a,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service a span { color: #19333f; border-color: #19333f; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg .footer { border-color: #91aa9d; }

/* D 配色第二輪｜提高明暗、冷暖與材料面的差異，避免四版看起來只是微調 */
/* DA 森林奶油：深森林綠 × 暖奶油 × 黃銅 */
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip { background:#b99a54; color:#173a32; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip-grid span,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip-title small,
.jg-variant-a.jg-layout-d.jg-palette-a .jg-system-strip-grid small { color:#173a32; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-about { background-color:#f4efe2; background-image:linear-gradient(rgba(34,76,64,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(34,76,64,.08) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-process > div { background:rgba(255,251,240,.88); }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-products { background-color:#153f35; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-card { background:#fbf6e9; color:#173a32; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-product-image { background:#d6c49a; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-use { background:#fffaf0; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-use-list > div::before { background:#fffaf0; border-color:#b99a54; }
.jg-variant-a.jg-layout-d.jg-palette-a .jg-service { background:#d2b56f; }

/* DB 石墨訊號：近黑石墨 × 冰白 × 高亮青藍 */
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip { background:#67bfd1; color:#17242a; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip-grid span,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip-title small,
.jg-variant-a.jg-layout-d.jg-palette-b .jg-system-strip-grid small { color:#17242a; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-about { background-color:#e8f2f5; background-image:linear-gradient(rgba(50,116,132,.095) 1px,transparent 1px),linear-gradient(90deg,rgba(50,116,132,.095) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-process > div { background:rgba(248,253,254,.9); }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-products { background-color:#20282e; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-card { background:#f4fafb; color:#202f36; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-product-image { background:#b9dce4; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-use { background:#f5fafb; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-use-list > div::before { background:#f5fafb; border-color:#67bfd1; }
.jg-variant-a.jg-layout-d.jg-palette-b .jg-service { background:#67bfd1; }

/* DC 沙岩橄欖：乾燥橄欖 × 沙岩米 × 芥末金 */
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip { background:#d7ba70; color:#38382d; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip-grid span,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip-title small,
.jg-variant-a.jg-layout-d.jg-palette-c .jg-system-strip-grid small { color:#38382d; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-about { background-color:#efe3cb; background-image:linear-gradient(rgba(101,96,65,.095) 1px,transparent 1px),linear-gradient(90deg,rgba(101,96,65,.095) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-process > div { background:rgba(255,247,229,.88); }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-products { background-color:#5a5c45; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-card { background:#fff3d9; color:#38382d; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-product-image { background:#d8c18e; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-use { background:#f7edda; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-use-list > div::before { background:#f7edda; border-color:#aa8a3e; }
.jg-variant-a.jg-layout-d.jg-palette-c .jg-service { background:#d7ba70; }

/* DD 夜藍鼠尾草：深海軍藍 × 淡鼠尾草 × 薄荷灰 */
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip { background:#9dbdaf; color:#182d3f; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip-grid span,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip-title small,
.jg-variant-a.jg-layout-d.jg-palette-d .jg-system-strip-grid small { color:#182d3f; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-about { background-color:#e4eee9; background-image:linear-gradient(rgba(42,79,83,.085) 1px,transparent 1px),linear-gradient(90deg,rgba(42,79,83,.085) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-process > div { background:rgba(244,250,247,.88); }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-products { background-color:#182d4a; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-card { background:#edf5f1; color:#203747; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-product-image { background:#b9d0c7; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-use { background:#edf4f0; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-use-list > div::before { background:#edf4f0; border-color:#7da595; }
.jg-variant-a.jg-layout-d.jg-palette-d .jg-service { background:#9dbdaf; }

/* D 配色第三輪｜每版只使用三個介面色：主色、底色、強調色 */
.jg-variant-a.jg-layout-d.jg-palette-a { --jg-p-dark:#222b30; --jg-p-light:#f7f7f4; --jg-p-accent:#668696; }
.jg-variant-a.jg-layout-d.jg-palette-b { --jg-p-dark:#30322f; --jg-p-light:#f6f3eb; --jg-p-accent:#9b8050; }
.jg-variant-a.jg-layout-d.jg-palette-c { --jg-p-dark:#203642; --jg-p-light:#f3f6f5; --jg-p-accent:#648f8b; }
.jg-variant-a.jg-layout-d.jg-palette-d { --jg-p-dark:#2c3135; --jg-p-light:#f6f6f3; --jg-p-accent:#b18b3f; }

.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service { background:var(--jg-p-accent); color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip::before,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card::after { background:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid > div { border-color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid span,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-title small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service p,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service a span { color:var(--jg-p-dark); border-color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-about { color:var(--jg-p-dark); background-color:var(--jg-p-light); background-image:linear-gradient(color-mix(in srgb,var(--jg-p-dark) 9%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--jg-p-dark) 9%,transparent) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-process > div { background:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-section-mark,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-process,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-process > div + div { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-about-copy p,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-process small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-section-mark span { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products { color:var(--jg-p-light); background-color:var(--jg-p-dark); background-image:linear-gradient(color-mix(in srgb,var(--jg-p-light) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--jg-p-light) 8%,transparent) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products::before { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products .jg-num,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products .jg-section-head p { color:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card { color:var(--jg-p-dark); background:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-image { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-copy,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(3) .jg-product-copy { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-copy p,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-kicker,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-model { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-use { color:var(--jg-p-dark); background:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-use-list > div::before { background:var(--jg-p-light); border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer { border-color:var(--jg-p-accent); }

/* 三色規則延伸到首圖、導覽與頁尾，避免局部殘留第四種介面色 */
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg {
    --jg-paper:var(--jg-p-light);
    --jg-white:var(--jg-p-light);
    --jg-ink:var(--jg-p-dark);
    --jg-text:var(--jg-p-dark);
    --jg-soft:var(--jg-p-dark);
    --jg-line:var(--jg-p-accent);
    --jg-panel:var(--jg-p-light);
    --jg-navy:var(--jg-p-dark);
    --jg-signal:var(--jg-p-accent);
    --hl-bg:var(--jg-p-dark);
    --hl-paper:var(--jg-p-light);
    --hl-ink:var(--jg-p-dark);
    --hl-text:var(--jg-p-light);
    --hl-red:var(--jg-p-accent);
    --hl-red-dark:var(--jg-p-accent);
    --hl-line:var(--jg-p-accent);
    --hl-sage:var(--jg-p-accent);
    --accent:var(--jg-p-accent);
    --accent-dark:var(--jg-p-dark);
}
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .navbar { background:var(--jg-p-light); border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .logo-main,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .nav-menu li.active a { color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .logo-sub,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .nav-menu a:not(.nav-cta):not(.nav-line) { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .nav-menu a:not(.nav-cta)::after,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .nav-menu li.active a:not(.nav-cta)::after { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-hero,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-tags span,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-device { background:var(--jg-p-light); color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-tags span,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-actions a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-device figcaption { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-tags span,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-actions a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-actions small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-lead { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-hero-visual { background:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .jg-hero-visual::before { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .footer-top { background:var(--jg-p-dark); color:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer::before { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .footer-brand h3,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .footer-brand .footer-tax,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .fc-label,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .fc-item p,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .fc-item a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .hours-row,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .hours-day,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .hours-time,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .fc-sub,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .line-id,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-cats a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-cats .lb { color:var(--jg-p-light) !important; }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .fc-link,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-cats .sep { color:var(--jg-p-accent) !important; }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-div { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .qr-image img { background:var(--jg-p-light); border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .line-add-btn { background:var(--jg-p-accent) !important; color:var(--jg-p-dark) !important; }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .footer-bottom { background:var(--jg-p-accent); border-color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .footer-bottom p,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-bq a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .footer .ft-bq .sep { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg .back-to-top { background:var(--jg-p-accent); color:var(--jg-p-dark); }

/* D 產品型錄版｜淺底 70%、深色資訊 25%、單一強調色 5% */
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip { background:var(--jg-p-dark); color:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip::before { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid > div { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid span { color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-title small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-system-strip-grid small { color:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-about { background-color:var(--jg-p-light); background-image:linear-gradient(color-mix(in srgb,var(--jg-p-dark) 6%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--jg-p-dark) 6%,transparent) 1px,transparent 1px); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-process > div { background:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products { color:var(--jg-p-dark); background:var(--jg-p-light); border-top:1px solid var(--jg-p-accent); border-bottom:1px solid var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products::before { background:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products .jg-num { color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-products .jg-section-head p { color:var(--jg-p-dark); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-grid { gap:18px; background:transparent; }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card--host,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card--dark,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(4) { background:var(--jg-p-light) !important; color:var(--jg-p-dark); outline:1px solid var(--jg-p-dark); outline-offset:-1px; }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card::after { background:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-image,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(3) .jg-product-image,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(4) .jg-product-image { background:var(--jg-p-light) !important; border-right:1px solid var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-copy,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-product-card:nth-child(3) .jg-product-copy { border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-model,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-kicker { color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-use { background:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-use-list > div::before { background:var(--jg-p-light); border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service { background:var(--jg-p-dark); color:var(--jg-p-light); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service small,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service a,
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service a span { color:var(--jg-p-accent); border-color:var(--jg-p-accent); }
.jg-variant-a.jg-layout-d[class*="jg-palette-"] .jg-service p { color:var(--jg-p-light); }

/* =========================================================
   產品頁重排提案
   arrange=a 商品先行／b 主機主打／c 橫向型錄
   ========================================================= */
.jg-variant-a.jg-layout-d[class*="jg-arrange-"] .jg main { display:flex; flex-direction:column; }

/* A｜商品先行：先給選型重點，再直接看四項產品 */
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-hero { order:1; }
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-system-strip { order:2; }
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-products { order:3; }
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-about { order:4; }
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-use { order:5; }
.jg-variant-a.jg-layout-d.jg-arrange-a .jg-products { padding-top:82px; }

/* B｜主機主打：先說系統，再以主機大卡帶三款發射器 */
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-hero { order:1; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-about { order:2; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-products { order:3; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-system-strip { order:4; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-use { order:5; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-grid { grid-template-columns:repeat(12,1fr); }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card,
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card--dark,
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:nth-child(4) { grid-column:span 4; grid-template-columns:1fr; min-height:470px; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card--host { grid-column:1 / -1; grid-template-columns:40% 60%; min-height:390px; }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:not(.jg-product-card--host) .jg-product-image { min-height:255px; border-right:0; border-bottom:1px solid var(--jg-p-accent); }
.jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:not(.jg-product-card--host) .jg-product-copy { min-height:215px; padding:62px 24px 28px; border-left:0; }

/* C｜橫向型錄：四款產品逐列閱讀，圖片與資料左右交錯 */
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-hero { order:1; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-products { order:2; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-system-strip { order:3; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-about { order:4; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-use { order:5; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-grid { grid-template-columns:1fr; gap:14px; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card--host,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card--dark,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(3),
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(4) { grid-column:1 / -1; grid-template-columns:34% 66%; min-height:270px; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-image,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(3) .jg-product-image,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(4) .jg-product-image { min-height:270px; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-copy,
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(3) .jg-product-copy { min-height:270px; padding:70px 46px 38px; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) { grid-template-columns:66% 34%; }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) .jg-product-image { order:2; border-right:0; border-left:1px solid var(--jg-p-accent); }
.jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) .jg-product-copy { order:1; border-left:0; }

@media (max-width:900px) {
    .jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card,
    .jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card--host,
    .jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card--dark,
    .jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:nth-child(3),
    .jg-variant-a.jg-layout-d.jg-arrange-b .jg-product-card:nth-child(4),
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card,
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card--host,
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card--dark,
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(3),
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(4) { grid-column:1 / -1; grid-template-columns:1fr; }
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) { grid-template-columns:1fr; }
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) .jg-product-image { order:1; border-left:0; border-bottom:1px solid var(--jg-p-accent); }
    .jg-variant-a.jg-layout-d.jg-arrange-c .jg-product-card:nth-child(even) .jg-product-copy { order:2; }
}

/* 比較頁專用：隱藏已定案的導覽與首圖，讓預覽從重排區塊開始 */
.jg-preview-sections .jg .navbar,
.jg-preview-sections .jg .jg-hero { display:none; }

/* =========================================================
   球閥系列設計語言參考版
   重點：編輯式留白、主系列＋款式、橫向資料帶、淡色應用區
   ========================================================= */
.jg-reference-ball.jg-variant-a.jg-layout-d .jg {
    --jg-ref-bg:#faf8f4;
    --jg-ref-ink:#242729;
    --jg-ref-accent:#536d80;
    --jg-p-light:var(--jg-ref-bg);
    --jg-p-dark:var(--jg-ref-ink);
    --jg-p-accent:var(--jg-ref-accent);
    background:var(--jg-ref-bg);
    color:var(--jg-ref-ink);
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg main { display:flex; flex-direction:column; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-hero { order:1; background:var(--jg-ref-bg); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about { order:2; padding:76px 0 68px; background:var(--jg-ref-bg); background-image:none; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip { order:3; margin:0 auto 72px; width:min(1160px,calc(100% - 48px)); background:var(--jg-ref-bg); color:var(--jg-ref-ink); border-top:1px solid var(--jg-ref-accent); border-bottom:1px solid var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-products { order:4; padding:18px 0 88px; background:var(--jg-ref-bg); border:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use { order:5; background:color-mix(in srgb,var(--jg-ref-accent) 16%,var(--jg-ref-bg)); }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-grid { grid-template-columns:66px .9fr 1.16fr; gap:42px; padding:58px 46px 54px; border-top:1px solid var(--jg-ref-accent); border-bottom:1px solid var(--jg-ref-accent); background:linear-gradient(90deg,var(--jg-ref-accent) 0 116px,transparent 116px) 0 100% / 100% 7px no-repeat; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-section-mark { border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-section-mark span { color:var(--jg-ref-accent); font-size:52px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-title h2 { font-size:30px; line-height:1.55; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-copy p { font-size:14px; line-height:2; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process { border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process > div { background:transparent; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process > div + div { border-color:var(--jg-ref-accent); }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip::before { display:none; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid > div { min-height:112px; border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid span,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-title small { color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid small { color:var(--jg-ref-ink); }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-products .jg-section-head { max-width:1160px; margin:0 auto; padding:0 0 34px 96px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-products .jg-num { color:var(--jg-ref-accent); font-size:64px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-grid { grid-template-columns:repeat(12,1fr); gap:0; border-top:1px solid var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--dark,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3),
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) { grid-column:span 4; grid-template-columns:1fr; min-height:455px; outline:0; border:0; border-right:1px solid var(--jg-ref-accent); border-bottom:1px solid var(--jg-ref-accent); clip-path:none; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) { border-right:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host { grid-column:1 / -1; grid-template-columns:32% 68%; min-height:390px; border-right:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card::after { display:none; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-image,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3) .jg-product-image,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) .jg-product-image { min-height:260px; padding:34px; background:var(--jg-ref-bg) !important; border:0; border-bottom:1px solid var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host .jg-product-image { min-height:390px; border-right:1px solid var(--jg-ref-accent); border-bottom:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:not(.jg-product-card--host) .jg-product-image img { max-height:205px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-copy,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3) .jg-product-copy { min-height:195px; padding:64px 28px 32px; border:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host .jg-product-copy { min-height:390px; padding:78px 54px 44px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-copy h3 { font-family:'Noto Serif TC',serif; font-size:23px; font-weight:500; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-model { color:var(--jg-ref-accent); }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-grid { grid-template-columns:66px 1.3fr .8fr; gap:36px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list { display:grid; grid-template-columns:1fr 1fr; border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div { min-height:128px; grid-template-columns:38px 1fr; gap:8px 14px; padding:24px; border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(odd) { border-right:1px solid var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list p { grid-column:2; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div::before { display:none; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service { background:var(--jg-ref-bg); color:var(--jg-ref-ink); border:1px solid var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service small,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service a,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service a span { color:var(--jg-ref-accent); border-color:var(--jg-ref-accent); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service p { color:var(--jg-ref-ink); }

@media(max-width:900px) {
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-grid { grid-template-columns:54px 1fr; padding:42px 28px; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card,
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host,
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--dark,
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3),
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) { grid-column:1 / -1; grid-template-columns:1fr; border-right:0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host .jg-product-image { border-right:0; border-bottom:1px solid var(--jg-ref-accent); }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-grid { grid-template-columns:1fr; }
}

/* 全站固定頁尾｜品牌頁的版型與配色不得覆寫 */
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer {
    --hl-bg:#F6F3EF;
    --hl-ink:#13293F;
    --hl-text:#4A4E53;
    --hl-line:#DAD5CC;
    --hl-red:#B94316;
    --hl-red-dark:#9A360F;
    --hl-sage:#CDD0BE;
    --hl-paper:#FCFBF8;
    background:var(--hl-bg);
    color:var(--hl-text);
    border:0;
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer::before {
    background:linear-gradient(90deg,transparent,var(--hl-red),transparent);
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .footer-top { background:var(--hl-bg); }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .footer-brand h3 { color:var(--hl-ink) !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .footer-brand .footer-tax,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .fc-label,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .line-id,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-cats .lb { color:#7C7A6E !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .fc-item p,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .fc-item a,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .hours-row,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .hours-day,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .hours-time,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .fc-sub,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-cats a { color:var(--hl-text) !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .fc-link { color:var(--hl-red) !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-cats .sep,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-bq .sep { color:#B5AE9F !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-div { border-color:var(--hl-line); }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .qr-image img {
    background:#fff;
    border-color:var(--hl-line);
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .line-add-btn {
    background:#06C755 !important;
    color:#fff !important;
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .footer-bottom {
    background:var(--hl-sage);
    border-color:var(--hl-line);
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .footer-bottom p,
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .footer .ft-bq a { color:#3F463C !important; }
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .back-to-top {
    background:#29485A;
    color:#fff;
}
html[class*="jg-variant-"][class*="jg-layout-"][class*="jg-palette-"] body.jg .back-to-top:hover { background:#1E3746; }

/* 球閥參考版第二輪｜移除規格表式框線，改以留白與淡色面建立層級 */
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-grid {
    padding:64px 54px 58px;
    border:0;
    background:linear-gradient(90deg,color-mix(in srgb,var(--jg-ref-accent) 14%,var(--jg-ref-bg)) 0 9px,transparent 9px);
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-section-mark { border:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process {
    gap:34px;
    margin-top:42px;
    padding-top:28px;
    border:0;
    background:linear-gradient(90deg,var(--jg-ref-accent),var(--jg-ref-accent)) 0 0 / 42px 2px no-repeat;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process > div,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process > div + div { padding:0; border:0; background:transparent; }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip {
    margin-bottom:78px;
    border:0;
    border-radius:0 46px 0 0;
    background:color-mix(in srgb,var(--jg-ref-accent) 14%,var(--jg-ref-bg));
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid { gap:34px; padding:0 34px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid > div { min-height:118px; padding:28px 0; border:0; }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-products .jg-section-head { padding-bottom:42px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-grid { gap:28px 24px; border:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--dark,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3),
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) {
    min-height:430px;
    border:0;
    background:transparent !important;
    overflow:visible;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host {
    min-height:410px;
    margin-bottom:42px;
    border-radius:0 86px 0 0;
    background:color-mix(in srgb,var(--jg-ref-accent) 12%,var(--jg-ref-bg)) !important;
    overflow:hidden;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-image,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3) .jg-product-image,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(4) .jg-product-image {
    min-height:250px;
    padding:30px;
    border:0;
    border-radius:120px 120px 18px 18px;
    background:color-mix(in srgb,var(--jg-ref-accent) 9%,var(--jg-ref-bg)) !important;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host .jg-product-image {
    min-height:410px;
    border:0;
    border-radius:0;
    background:transparent !important;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-copy,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card:nth-child(3) .jg-product-copy {
    min-height:170px;
    padding:54px 10px 18px;
    border:0;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host .jg-product-copy { min-height:410px; padding:80px 58px 48px; }

.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use { padding:88px 0 94px; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list { gap:30px 36px; border:0; }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div,
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(odd) {
    min-height:108px;
    padding:16px 0 22px;
    border:0;
    background:transparent;
}
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(2),
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(4) { transform:translateY(28px); }
.jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-service {
    min-height:330px;
    border:0;
    border-radius:90px 0 0 0;
    background:var(--jg-ref-bg);
    box-shadow:0 18px 42px color-mix(in srgb,var(--jg-ref-ink) 8%,transparent);
}

@media(max-width:900px) {
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-about-grid { padding:42px 28px; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process { gap:0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-process > div { padding:18px 0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip { border-radius:0 34px 0 0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-system-strip-grid { gap:0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-product-card--host { border-radius:0 48px 0 0; }
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(2),
    .jg-reference-ball.jg-variant-a.jg-layout-d .jg .jg-use-list > div:nth-child(4) { transform:none; }
}
