/* 技冠內頁新版｜承接首頁、關於我們、營業項目與球閥系列的編輯式語言 */
html.jg-redesign body.jg {
    --jgr-paper:#f6f3ef;
    --jgr-ink:#13293f;
    --jgr-accent:#b94316;
    --jgr-white:#fff;
    --jgr-fade:color-mix(in srgb,var(--jgr-ink) 8%,var(--jgr-paper));
}

/* 選型提示：像訊號路徑，不做卡片列 */
html.jg-redesign[class*="jg-variant-"][class*="jg-layout-"] body.jg .jg-system-strip {
    position:relative;
    margin:0;
    padding:58px 0 74px;
    overflow:hidden;
    background:var(--jgr-white);
    color:var(--jgr-ink);
    border:0;
    border-radius:0;
}
html.jg-redesign body.jg .jg-system-strip::before {
    content:"";
    position:absolute;
    left:calc(50% - 520px);
    right:calc(50% - 520px);
    top:110px;
    height:1px;
    background:color-mix(in srgb,var(--jgr-ink) 20%,transparent);
}
html.jg-redesign body.jg .jg-system-strip-grid {
    position:relative;
    display:grid;
    grid-template-columns:1.25fr repeat(3,1fr);
    min-height:0;
    padding:0;
    gap:40px;
}
html.jg-redesign body.jg .jg-system-strip-grid > div,
html.jg-redesign body.jg .jg-system-strip-grid > div:first-child {
    min-height:0;
    padding:0;
    border:0;
    background:transparent;
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-system-strip-grid > div:not(:first-child) {
    display:grid;
    grid-template-columns:34px 1fr;
    grid-template-rows:auto auto;
    gap:8px 13px;
}
html.jg-redesign body.jg .jg-system-strip-grid > div:not(:first-child)::before {
    content:"";
    position:absolute;
    width:10px;
    height:10px;
    margin:19px 0 0 12px;
    border-radius:50%;
    background:var(--jgr-accent);
    box-shadow:0 0 0 7px var(--jgr-white);
}
html.jg-redesign body.jg .jg-system-strip-title small {
    color:var(--jgr-accent);
    font-size:10px;
    letter-spacing:.22em;
}
html.jg-redesign body.jg .jg-system-strip-title strong {
    margin-top:8px;
    color:var(--jgr-ink);
    font-family:"Noto Serif TC",serif;
    font-size:25px;
    font-weight:700;
}
html.jg-redesign body.jg .jg-system-strip-grid span {
    color:var(--jgr-accent);
    font:700 12px/1 "Noto Sans TC",sans-serif;
    letter-spacing:.1em;
}
html.jg-redesign body.jg .jg-system-strip-grid strong { color:var(--jgr-ink); font-size:15px; }
html.jg-redesign body.jg .jg-system-strip-grid small { color:color-mix(in srgb,var(--jgr-ink) 66%,transparent); }

/* 01 品牌／系統：大字編號與三欄編輯式敘事 */
html.jg-redesign[class*="jg-variant-"][class*="jg-layout-"] body.jg .jg-about {
    position:relative;
    padding:124px 0 132px;
    overflow:hidden;
    background:var(--jgr-paper);
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-about::after {
    content:"REMOTE CONTROL";
    position:absolute;
    right:-30px;
    bottom:12px;
    color:color-mix(in srgb,var(--jgr-ink) 4%,transparent);
    font:900 clamp(70px,10vw,150px)/.8 "Noto Sans TC",sans-serif;
    letter-spacing:-.06em;
    white-space:nowrap;
    pointer-events:none;
}
html.jg-redesign body.jg .jg-about-grid {
    position:relative;
    z-index:1;
    display:grid;
    grid-template-columns:150px minmax(280px,.88fr) minmax(380px,1.12fr);
    gap:34px 56px;
    align-items:start;
    padding:0;
    border:0;
    background:transparent;
}
html.jg-redesign body.jg .jg-section-mark {
    display:flex;
    flex-direction:column;
    min-height:250px;
    padding:0;
    border:0;
}
html.jg-redesign body.jg .jg-section-mark::after {
    content:"";
    width:2px;
    height:104px;
    margin:20px 0 0 34px;
    background:var(--jgr-accent);
}
html.jg-redesign body.jg .jg-section-mark span {
    color:var(--jgr-accent);
    font:300 76px/.9 "Noto Serif TC",serif;
}
html.jg-redesign body.jg .jg-section-mark small { margin-top:16px; color:var(--jgr-ink); writing-mode:vertical-rl; letter-spacing:.18em; }
html.jg-redesign body.jg .jg-about-title { padding-top:8px; }
html.jg-redesign body.jg .jg-about-title .jg-kicker { color:var(--jgr-accent); }
html.jg-redesign body.jg .jg-about-title h2 {
    max-width:520px;
    margin-top:22px;
    color:var(--jgr-ink);
    font-family:"Noto Serif TC",serif;
    font-size:clamp(36px,3.45vw,55px);
    line-height:1.42;
    letter-spacing:.04em;
}
html.jg-redesign body.jg .jg-about-copy {
    position:relative;
    padding:52px 0 0 66px;
    color:color-mix(in srgb,var(--jgr-ink) 78%,transparent);
    font-size:16px;
    line-height:2;
}
html.jg-redesign body.jg .jg-about-copy::before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:78px;
    height:4px;
    background:var(--jgr-accent);
}
html.jg-redesign body.jg .jg-process {
    grid-column:2 / 4;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:48px;
    margin-top:44px;
    padding:38px 0 0;
    border:0;
    background:linear-gradient(90deg,var(--jgr-ink),var(--jgr-ink)) 0 0 / 100% 1px no-repeat;
}
html.jg-redesign body.jg .jg-process > div,
html.jg-redesign body.jg .jg-process > div + div {
    position:relative;
    min-height:112px;
    padding:0 12px 0 28px;
    border:0;
    background:transparent;
}
html.jg-redesign body.jg .jg-process > div::before {
    content:"";
    position:absolute;
    left:0;
    top:4px;
    width:8px;
    height:8px;
    border-radius:50%;
    background:var(--jgr-accent);
}
html.jg-redesign body.jg .jg-process span { color:var(--jgr-accent); letter-spacing:.14em; }
html.jg-redesign body.jg .jg-process strong { margin:12px 0 7px; color:var(--jgr-ink); font-family:"Noto Serif TC",serif; font-size:18px; }
html.jg-redesign body.jg .jg-process small { color:color-mix(in srgb,var(--jgr-ink) 62%,transparent); }

/* 02 產品：一座主展台＋三款錯落陳列，不使用卡片框 */
html.jg-redesign[class*="jg-variant-"][class*="jg-layout-"] body.jg .jg-products {
    padding:126px 0 148px;
    background:var(--jgr-white);
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-products .jg-section-head {
    display:grid;
    grid-template-columns:170px 1fr;
    gap:34px;
    align-items:end;
    max-width:900px;
    margin:0 0 76px;
    padding:0;
}
html.jg-redesign body.jg .jg-section-head .jg-num {
    color:var(--jgr-accent);
    font:300 78px/.85 "Noto Serif TC",serif;
}
html.jg-redesign body.jg .jg-section-head .jg-kicker { margin-top:12px; color:var(--jgr-accent); }
html.jg-redesign body.jg .jg-section-head h2 { color:var(--jgr-ink); font-family:"Noto Serif TC",serif; font-size:clamp(38px,4vw,58px); }
html.jg-redesign body.jg .jg-section-head p { margin-top:12px; color:color-mix(in srgb,var(--jgr-ink) 64%,transparent); }
html.jg-redesign body.jg .jg-product-grid {
    display:grid;
    grid-template-columns:repeat(12,1fr);
    gap:92px 36px;
    border:0;
    background:transparent;
}
html.jg-redesign body.jg .jg-product-card,
html.jg-redesign body.jg .jg-product-card--dark,
html.jg-redesign body.jg .jg-product-card:nth-child(3),
html.jg-redesign body.jg .jg-product-card:nth-child(4) {
    display:grid;
    grid-template-columns:1fr;
    grid-column:span 4;
    min-height:0;
    margin:0;
    border:0;
    border-radius:0;
    overflow:visible;
    background:transparent !important;
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-product-card--host {
    position:relative;
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(420px,1.18fr) minmax(320px,.82fr);
    min-height:520px;
    margin:0 0 42px;
    overflow:hidden;
    background:var(--jgr-paper) !important;
}
html.jg-redesign body.jg .jg-product-card--host::before {
    content:"RECEIVER";
    position:absolute;
    left:38px;
    bottom:-18px;
    color:color-mix(in srgb,var(--jgr-ink) 6%,transparent);
    font:900 110px/1 "Noto Sans TC",sans-serif;
    letter-spacing:-.06em;
}
html.jg-redesign body.jg .jg-product-image,
html.jg-redesign body.jg .jg-product-card:nth-child(3) .jg-product-image,
html.jg-redesign body.jg .jg-product-card:nth-child(4) .jg-product-image {
    position:relative;
    min-height:360px;
    padding:42px 28px 30px;
    border:0;
    border-radius:48% 48% 8px 8px;
    overflow:hidden;
    background:var(--jgr-paper) !important;
}
html.jg-redesign body.jg .jg-product-card:nth-child(3) { transform:translateY(58px); }
html.jg-redesign body.jg .jg-product-card:nth-child(4) { transform:translateY(-28px); }
html.jg-redesign body.jg .jg-product-card:nth-child(3) .jg-product-image { border-radius:8px 48% 48% 8px; }
html.jg-redesign body.jg .jg-product-card:nth-child(4) .jg-product-image { border-radius:48% 8px 8px 48%; }
html.jg-redesign body.jg .jg-product-image::after {
    content:"";
    position:absolute;
    left:50%;
    bottom:32px;
    width:42%;
    height:14px;
    border-radius:50%;
    transform:translateX(-50%);
    background:color-mix(in srgb,var(--jgr-ink) 14%,transparent);
    filter:blur(11px);
}
html.jg-redesign body.jg .jg-product-image img {
    position:relative;
    z-index:1;
    width:100%;
    height:290px;
    object-fit:contain;
    mix-blend-mode:multiply;
    filter:contrast(1.04) saturate(.9);
}
html.jg-redesign body.jg .jg-product-card--host .jg-product-image {
    min-height:520px;
    padding:64px;
    border:0;
    border-radius:0;
    background:transparent !important;
}
html.jg-redesign body.jg .jg-product-card--host .jg-product-image img { height:390px; }
html.jg-redesign body.jg .jg-product-copy,
html.jg-redesign body.jg .jg-product-card:nth-child(3) .jg-product-copy {
    min-height:0;
    padding:32px 6px 0;
    border:0;
    background:transparent;
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-product-card--host .jg-product-copy {
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:520px;
    padding:74px 72px;
    background:var(--jgr-ink);
    color:var(--jgr-white);
}
html.jg-redesign body.jg .jg-model { color:var(--jgr-accent); letter-spacing:.16em; }
html.jg-redesign body.jg .jg-product-copy h3 { margin:14px 0 12px; color:var(--jgr-ink); font-family:"Noto Serif TC",serif; font-size:31px; }
html.jg-redesign body.jg .jg-product-copy p { color:color-mix(in srgb,var(--jgr-ink) 66%,transparent); line-height:1.85; }
html.jg-redesign body.jg .jg-product-card--host .jg-product-copy h3 { color:var(--jgr-white); font-size:42px; }
html.jg-redesign body.jg .jg-product-card--host .jg-product-copy p { color:color-mix(in srgb,var(--jgr-white) 74%,transparent); }

/* 03 場域：開放式清單＋一個收尾色塊 */
html.jg-redesign[class*="jg-variant-"][class*="jg-layout-"] body.jg .jg-use {
    position:relative;
    padding:124px 0 136px;
    overflow:hidden;
    background:var(--jgr-paper);
    color:var(--jgr-ink);
}
html.jg-redesign body.jg .jg-use-grid {
    display:grid;
    grid-template-columns:210px minmax(420px,1fr) 360px;
    gap:56px;
    align-items:start;
}
html.jg-redesign body.jg .jg-use-head { position:sticky; top:130px; }
html.jg-redesign body.jg .jg-use-head .jg-num { color:var(--jgr-accent); font:300 78px/.86 "Noto Serif TC",serif; }
html.jg-redesign body.jg .jg-use-head .jg-kicker { margin:14px 0 30px; color:var(--jgr-accent); }
html.jg-redesign body.jg .jg-use-head h2 { color:var(--jgr-ink); font-family:"Noto Serif TC",serif; font-size:38px; }
html.jg-redesign body.jg .jg-use-list { display:grid; grid-template-columns:1fr 1fr; gap:48px 38px; border:0; }
html.jg-redesign body.jg .jg-use-list > div,
html.jg-redesign body.jg .jg-use-list > div:nth-child(odd) {
    position:relative;
    display:grid;
    grid-template-columns:36px 1fr;
    grid-template-rows:auto auto;
    gap:10px 12px;
    min-height:138px;
    padding:0 0 26px;
    border:0;
    background:linear-gradient(90deg,var(--jgr-accent),var(--jgr-accent)) 0 100% / 44px 2px no-repeat;
    transform:none;
}
html.jg-redesign body.jg .jg-use-list span { color:var(--jgr-accent); font-weight:700; }
html.jg-redesign body.jg .jg-use-list h3 { color:var(--jgr-ink); font-family:"Noto Serif TC",serif; font-size:23px; }
html.jg-redesign body.jg .jg-use-list p { grid-column:2; color:color-mix(in srgb,var(--jgr-ink) 65%,transparent); line-height:1.7; }
html.jg-redesign body.jg .jg-service {
    position:relative;
    min-height:390px;
    padding:58px 45px;
    overflow:hidden;
    border:0;
    border-radius:0 90px 0 0;
    background:var(--jgr-accent);
    color:var(--jgr-white);
    box-shadow:none;
}
html.jg-redesign body.jg .jg-service::before {
    content:"";
    position:absolute;
    right:-54px;
    bottom:-54px;
    width:185px;
    height:185px;
    border:1px solid color-mix(in srgb,var(--jgr-white) 30%,transparent);
    border-radius:50%;
    box-shadow:0 0 0 34px color-mix(in srgb,var(--jgr-white) 7%,transparent),0 0 0 68px color-mix(in srgb,var(--jgr-white) 5%,transparent);
}
html.jg-redesign body.jg .jg-service::after { display:none; }
html.jg-redesign body.jg .jg-service small,
html.jg-redesign body.jg .jg-service h3,
html.jg-redesign body.jg .jg-service p,
html.jg-redesign body.jg .jg-service a,
html.jg-redesign body.jg .jg-service a span { position:relative; z-index:1; color:var(--jgr-white); border-color:color-mix(in srgb,var(--jgr-white) 55%,transparent); }
html.jg-redesign body.jg .jg-service h3 { margin:24px 0 18px; font-family:"Noto Serif TC",serif; font-size:31px; }
html.jg-redesign body.jg .jg-service p { max-width:290px; margin:0; line-height:1.9; }
html.jg-redesign body.jg .jg-service a {
    left:auto;
    bottom:auto;
    display:inline-flex;
    align-items:center;
    width:max-content;
    margin-top:32px;
    padding-bottom:8px;
}

@media(max-width:1050px) {
    html.jg-redesign body.jg .jg-about-grid { grid-template-columns:110px .9fr 1.1fr; gap:32px; }
    html.jg-redesign body.jg .jg-use-grid { grid-template-columns:170px 1fr; }
    html.jg-redesign body.jg .jg-service { grid-column:2; min-height:280px; }
}
@media(max-width:760px) {
    html.jg-redesign body.jg .jg-system-strip { padding:42px 0 54px; }
    html.jg-redesign body.jg .jg-system-strip::before { display:none; }
    html.jg-redesign body.jg .jg-system-strip-grid { grid-template-columns:1fr; gap:26px; padding:0 22px; }
    html.jg-redesign body.jg .jg-system-strip-grid > div:not(:first-child) { padding-left:6px; }
    html.jg-redesign body.jg .jg-about,
    html.jg-redesign body.jg .jg-products,
    html.jg-redesign body.jg .jg-use { padding:78px 0 88px; }
    html.jg-redesign body.jg .jg-about-grid { grid-template-columns:1fr; gap:28px; padding:0 22px; }
    html.jg-redesign body.jg .jg-section-mark { min-height:0; flex-direction:row; align-items:end; gap:14px; }
    html.jg-redesign body.jg .jg-section-mark::after { width:42px; height:2px; margin:0 0 8px; }
    html.jg-redesign body.jg .jg-section-mark small { writing-mode:horizontal-tb; }
    html.jg-redesign body.jg .jg-about-copy { padding:34px 0 0; }
    html.jg-redesign body.jg .jg-process { grid-column:1; grid-template-columns:1fr; gap:28px; }
    html.jg-redesign body.jg .jg-products .jg-section-head { grid-template-columns:1fr; margin-bottom:50px; padding:0 22px; }
    html.jg-redesign body.jg .jg-product-grid { grid-template-columns:1fr; gap:64px; padding:0 22px; }
    html.jg-redesign body.jg .jg-product-card,
    html.jg-redesign body.jg .jg-product-card--dark,
    html.jg-redesign body.jg .jg-product-card:nth-child(3),
    html.jg-redesign body.jg .jg-product-card:nth-child(4) { grid-column:1; transform:none; }
    html.jg-redesign body.jg .jg-product-card--host { grid-template-columns:1fr; }
    html.jg-redesign body.jg .jg-product-card--host .jg-product-copy { min-height:340px; padding:54px 32px; }
    html.jg-redesign body.jg .jg-product-image { min-height:320px; }
    html.jg-redesign body.jg .jg-use-grid { grid-template-columns:1fr; gap:48px; padding:0 22px; }
    html.jg-redesign body.jg .jg-use-head { position:static; }
    html.jg-redesign body.jg .jg-use-list { grid-template-columns:1fr; }
    html.jg-redesign body.jg .jg-service { grid-column:1; min-height:340px; }
}
