/* ====================================================================
   Lin-K Technology – Responsive scaling only (preserve original layout)
   將此檔覆蓋 assets/css/index.css ；HTML 毋須改動
   ==================================================================== */

/* ---------- 基本結構，維持原樣 ---------- */
html,body{height:100%;margin:0;padding:0;}
.carousel,.item,.active{height:100%;}
.carousel-inner{height:100%;}
.fill{width:100%;height:100%;background-position:center;background-size:cover;}
footer{margin:50px 0;}

/* ---- Navbar affix 動畫 ---- */
.affix{top:0;width:100%;transition:all .5s ease-in-out;border-color:#3868b6;}
.affix a{color:#fff!important;padding:15px!important;transition:all .5s ease-in-out;}
.affix>a:hover{color:#fff;}
.affix-top a{padding:25px!important;}
.affix+.container-fluid{padding-top:95px;}

/* ---- 章節底色／陰影 ---- */
#about{height:100%;background:#8db3f0da;box-shadow:0 1px 10px grey;}
#products{background:#8db3f0da;}
#services{background:#8db3f0da;box-shadow:0 1px 10px grey;}
#contact>.container-fluid{background:#263eb4;}

/* ---- Buttons ---- */
.app-btn-group{margin-bottom:90px;}
.about.app-btn{font-weight:700;border:none;color:#fff;background:linear-gradient(#3a8bff,#0062ff);border-radius:6px;padding:10px 22px;box-shadow:0 4px 10px rgba(0,0,0,.15);transition:transform .25s,box-shadow .25s;}
button{margin-right:5px;}

/* ---- Product cards ---- */
.product-card{background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.08);padding:32px 24px;text-align:left;height:69%;display:flex;flex-direction:column;}
.product-img{width:80%;height:auto;object-fit:contain;margin:0 auto 24px;}
.product-title{font-size:22px;font-weight:700;margin-bottom:4px;}
.product-sub{font-size:14px;color:#777;margin-bottom:20px;}
.product-func ul{list-style:square;margin-left:18px;font-size:14px;}
.product-more{margin-top:auto;color:#0094ff;font-weight:600;text-decoration:none;}
.product-more:hover{text-decoration:underline;}

/* ---- WHO section ---- */
.who-section{padding:80px 0 100px;background:#fff;}
.who-title{font-size:42px;font-weight:700;margin-bottom:20px;color:#444;}
.who-lead{font-size:22px;color:#666;margin-bottom:40px;}
.who-desc{font-size:20px;color:#666;margin-bottom:25px;}
.who-link a{font-size:22px;color:#0280e4;text-decoration:underline;}
.who-link a:hover{text-decoration:none;}

/* ---- CTA ---- */
.cta-btn{display:inline-flex;align-items:center;gap:16px;margin-top:40px;font-size:28px;font-weight:700;color:#fff;background:#0087c4;padding:20px 36px;border-radius:8px;text-decoration:none;box-shadow:0 6px 16px rgba(0,0,0,.15);transition:transform .25s,box-shadow .25s;}
.cta-btn:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(0,0,0,.25);}    
.cta-icon{display:inline-flex;justify-content:center;align-items:center;width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.2);font-size:28px;}

/* ---- Icons ---- */
.glyphicon{color:#1b1c2f;font-size:4em;}

/* ---- Navbar links ---- */
.navbar-default{background:rgba(62, 62, 65, 0.5);}   /* 手機時會整體縮放，不改顏色 */
.navbar-default .navbar-nav>li>a{color:#b8becf;font-size:25px;}
.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>li>a:hover{color:#1a1f4a;background:transparent;transition:all .3s;}

/* ---- Logo ---- */
#coco{color:#b9bcd8;letter-spacing:25px;font-weight:800;}

/* ---- Paragraph ---- */
p{color:#f9f9f9;font-size:18px;}
#link{font-size:22px;}

/* ---- Carousel caption ---- */
.carousel-caption h3{font-size:4em;}

/* ---- Side drawer base (仍保留，以防萬一用到) ---- */
#side-nav{position:fixed;top:0;left:0;width:280px;height:100vh;background:#fff;overflow-y:auto;padding:40px 28px;box-shadow:4px 0 18px rgba(0,0,0,.15);transform:translateX(-100%);transition:.4s ease;z-index:1050;}
#side-nav.open{transform:translateX(0);}
#menu-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:.3s;z-index:1040;}
#menu-backdrop.show{opacity:1;visibility:visible;}

/* ---- Dropdown (桌機) ---- */
.has-sub{position:relative;}
.sub-menu{position:absolute;top:100%;left:0;width:260px;background:#ffffff;border-radius:8px;box-shadow:0 6px 18px rgb(0, 0, 0);padding:8px 0;list-style:none;margin:18px 0 0;opacity:0;visibility:hidden;transform:translateY(10px);transition:.25s;z-index:999;}
.sub-menu::before{content:'';position:absolute;top:-8px;left:30px;width:16px;height:16px;background:#ffffff;transform:rotate(45deg);box-shadow:-2px -2px 4px rgba(0,0,0,.03);}    
@media(min-width:992px){.has-sub:hover>.sub-menu{opacity:1;visibility:visible;transform:translateY(0);}}
.sub-menu li a{display:block;padding:14px 24px;font-size:18px;color:#000 !important;;text-decoration:none;transition:.2s;}
.sub-menu li a:hover{background:#f5f7fc00;color:#0062ff;}

/* ---- toc 避免固定定位 ---- */
.toc{position:static!important;left:auto;top:auto;width:auto;}

/* ====== 版頭區塊 ====== */
.main-header {
  background: #fff;       /* 需要背景色請自行調整 */
  padding: 24px 0;        /* ↑ 整體高度：上下 padding 決定 */
  border-bottom: 1px solid #ddd;
}

.header-inner {
  display: flex;
  align-items: center;    /* 垂直置中 logo 與 nav */
}

.brand-logo img {
  width: 140px;           /* ★ logo 大小：可改成 120~160 皆可 */
  height: auto;
}

/* 讓 nav 區塊吃滿剩餘寬度 → 再透過 text-align: center 置中 <ul> */
.nav-wrapper {
  flex: 1;
  text-align: center;
}

/* Bootstrap 3 的 nav item 本來 float:left，要取消才能置中 */
.nav-wrapper .nav  { 
  float: none;            /* 取消浮動 */
  display: inline-block;  /* 使其內容可置中 */
}

/* 可選：加大 nav 字體＆字距讓區塊感覺更「大」 */
.nav-wrapper .nav > li > a {
  font-size: 16px;
  padding: 12px 18px;
}
