/* 連線總部 共用樣式 */
@font-face{font-family:"jf-openhuninn";src:url("fonts/jf-openhuninn-2.1.woff2") format("woff2");font-weight:normal;font-display:swap}
:root{
  --g1:#46524B; --g2:#7F8B83; --g3:#96A199; --g4:#B4BDB5; --g5:#D2D8D2;
  --shadow:#5C6861;
  --panel:#EFF1EC; --panel-2:#E3E8E0;
  --ink:#2E3733; --ink-2:#5E6B64; --on:#FBFCF9; --hair:#CFD8CC;
  --accent:#7A0000;
  --c-daily:#4A5D70; --c-podcast:#4B695F; --c-akakon:#6E5A7E; --c-akakon-wood:#7D8F5A; --c-design:#63674F;
  --disp:"Cormorant Garamond","Noto Serif TC",serif;
  --han:"jf-openhuninn","Noto Sans TC",sans-serif;
  --body:"jf-openhuninn","Noto Sans TC","Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:var(--g2);color:var(--on);font-family:var(--body);line-height:1.8;
  padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
img{max-width:100%}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:400;text-wrap:balance}
.wrap{max-width:64rem;margin-inline:auto;
  padding-left:max(18px,env(safe-area-inset-left,0px));padding-right:max(18px,env(safe-area-inset-right,0px))}
.caps{font-family:var(--disp);text-transform:uppercase;letter-spacing:.42em;font-size:.72rem;font-weight:600}

/* nav */
nav.hq{position:sticky;top:0;z-index:15;background:var(--g1);border-bottom:1px solid rgba(251,252,249,.22)}
nav.hq .wrap{display:flex;align-items:center;gap:.4rem 1.1rem;padding-block:.75rem;flex-wrap:wrap}
nav.hq .brand{font-family:var(--han);font-size:1rem;letter-spacing:.2em;margin-right:auto;text-decoration:none;font-weight:600;color:var(--on)}
nav.hq a.jump{font-size:.8rem;letter-spacing:.14em;text-decoration:none;color:rgba(251,252,249,.9);padding-bottom:2px;border-bottom:1px solid transparent}
nav.hq a.jump:hover,nav.hq a.jump[aria-current]{color:var(--on);border-bottom-color:var(--on)}

/* 首頁封面 */
.mast .wrap{padding-block:clamp(2.4rem,7vw,4.4rem)}
.cover{background:var(--panel);color:var(--ink);text-align:center;max-width:42rem;margin-inline:auto;
  padding:clamp(2.2rem,7vw,3.8rem) clamp(1.2rem,5vw,3rem);
  box-shadow:-16px -16px 0 var(--g4),18px 18px 0 var(--g1)}
.cover .mark{display:block;width:clamp(9rem,26vw,13rem);height:auto;margin:0 auto 1rem}
.cover h1{font-family:var(--han);font-size:clamp(2.1rem,8vw,3.2rem);letter-spacing:.24em;margin-left:.24em;font-weight:600;line-height:1.2}
.cover .en{margin:.9rem 0 0;color:var(--ink-2)}
.cover .rule{width:3.2rem;height:1px;background:var(--accent);margin:1.4rem auto}
.cover .tag{font-family:var(--han);font-size:clamp(.98rem,3vw,1.1rem);color:var(--ink-2);margin:0}

/* 四大格 */
.tiles-sec{background:var(--g3)}
.tiles-sec .wrap{padding-block:clamp(2.6rem,7vw,4.4rem)}
.tiles-sec .lead{margin:0 0 1.6rem;color:var(--on)}
.tiles{display:flex;flex-direction:column;gap:clamp(1.2rem,3vw,1.8rem)}
.tile{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);text-decoration:none;color:var(--on);background:var(--c);
  min-height:clamp(14rem,24vw,17rem);transition:transform .2s ease,filter .2s ease;min-width:0}
.tile:hover,.tile:focus-visible{transform:translateX(4px);filter:brightness(1.05)}
.tile .ph{position:relative;overflow:hidden;background:var(--panel-2)}
.tile .ph img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.t-daily .ph img{object-position:center top}
@media(max-width:720px){.tile{grid-template-columns:1fr;min-height:0}.tile .ph{aspect-ratio:16/9;min-height:0}}
.tile .tx{padding:clamp(1.3rem,3vw,1.8rem) clamp(1.3rem,3.4vw,2.4rem);display:flex;flex-direction:column;gap:.45rem;flex:1}
.tile .en{color:rgba(251,252,249,.82)}
.tile h2{font-family:var(--han);font-size:clamp(1.45rem,4vw,1.85rem);font-weight:600;letter-spacing:.08em}
.tile p{margin:0;font-size:.93rem;color:rgba(251,252,249,.94)}
.tile .ft{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;padding-top:.8rem;
  border-top:1px solid rgba(251,252,249,.35);font-size:.8rem;letter-spacing:.08em}
.tile .go{font-family:var(--disp);text-transform:uppercase;letter-spacing:.28em;font-weight:600;font-size:.72rem;white-space:nowrap}
.t-daily{--c:var(--c-daily)} .t-podcast{--c:var(--c-podcast)} .t-design{--c:var(--c-design)}
.t-akakon{--c:var(--c-akakon);box-shadow:inset 0 -6px 0 var(--c-akakon-wood)}

/* 子頁 */
.hero{background:var(--c,var(--g1))}
.hero .wrap{padding-block:clamp(2.6rem,8vw,4.6rem)}
.hero .crumb{font-size:.78rem;letter-spacing:.12em;color:rgba(251,252,249,.85);text-decoration:none}
.hero h1{font-family:var(--han);font-size:clamp(2rem,7vw,3rem);font-weight:600;letter-spacing:.16em;margin-top:.6rem}
.hero .lede{font-family:var(--han);font-size:clamp(1rem,3vw,1.15rem);max-width:36rem;margin:.9rem 0 0;color:rgba(251,252,249,.94)}
.badge{display:inline-block;margin-left:.7rem;vertical-align:.3em;font-family:var(--body);font-size:.7rem;letter-spacing:.14em;
  padding:.16rem .6rem;border:1px solid rgba(251,252,249,.6);color:var(--on)}
.body-sec .wrap{padding-block:clamp(2.2rem,6vw,3.6rem)}
.card{background:var(--panel);color:var(--ink);padding:clamp(1.6rem,5vw,3rem);box-shadow:14px 14px 0 var(--shadow)}
.card h2{font-family:var(--han);font-size:1.3rem;font-weight:600;letter-spacing:.06em;margin-bottom:.4rem}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(13.5rem,1fr));gap:1.3rem 2rem;margin-top:1.4rem}
.cols>div{min-width:0}
.cols h3{font-family:var(--han);font-size:.98rem;font-weight:600;margin-bottom:.25rem}
.cols p{margin:0;font-size:.9rem;color:var(--ink-2);line-height:1.75}
.rows{margin-top:1.6rem;border-top:1px solid var(--hair)}
.row{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem 1rem;padding-block:.85rem;border-bottom:1px solid var(--hair)}
.row .no{font-size:.74rem;letter-spacing:.12em;color:var(--ink-2);min-width:6rem;font-variant-numeric:tabular-nums}
.row .ti{font-family:var(--han);font-weight:600;flex:1;min-width:10rem}
.row .mt{font-size:.78rem;color:var(--ink-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.row .sub{flex-basis:100%;font-size:.84rem;color:var(--ink-2);order:3}
.row a.ti{text-decoration:none}
.row a.ti:hover{text-decoration:underline;text-underline-offset:.25em}
.note{font-size:.82rem;color:var(--ink-2);margin:1rem 0 0}
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.1rem;margin-top:1.4rem;align-items:start}
figure{margin:0}
figure img{display:block;width:100%;box-shadow:8px 8px 0 var(--panel-2)}
figcaption{font-size:.78rem;color:var(--ink-2);margin-top:.45rem;letter-spacing:.04em}
.shot{margin-top:1.4rem}
.shot img{display:block;width:100%;box-shadow:10px 10px 0 var(--g4)}
.cta{display:inline-block;margin-top:1.6rem;font-family:var(--disp);text-transform:uppercase;letter-spacing:.3em;font-size:.74rem;font-weight:600;
  text-decoration:none;border:1px solid var(--accent);color:var(--accent);padding:.65rem 1.5rem}
.cta:hover{background:var(--panel-2)}
.back{display:inline-block;margin-top:1.8rem;font-size:.84rem;letter-spacing:.1em;text-decoration:none;color:var(--on);border-bottom:1px solid rgba(251,252,249,.6)}

footer.hq{background:var(--g1)}
footer.hq .wrap{padding-block:clamp(2.2rem,6vw,3.2rem);display:flex;flex-wrap:wrap;gap:.5rem 2rem;align-items:baseline;font-size:.8rem;color:rgba(251,252,249,.9)}
footer.hq .mk{font-family:var(--han);letter-spacing:.16em;font-weight:600;color:var(--on)}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
html{scroll-behavior:smooth}
footer.hq{scroll-margin-top:0}
footer.hq .mail a{color:var(--on);text-decoration:none;border-bottom:1px solid rgba(251,252,249,.5)}
footer.hq .mail a:hover{border-bottom-color:var(--on)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}