/* HL3C v47 - banner.png dark hero + original generated realistic collage */
:root{
  --hl3c-ink:#07111f;
  --hl3c-blue:#3b70ff;
  --hl3c-cyan:#43d9df;
  --hl3c-lime:#dffd5c;
  --hl3c-orange:#e07843;
}
.site-header{
  background:rgba(255,255,255,.94)!important;
  backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 10px 28px rgba(15,23,42,.08)!important;
}
.site-header .brand{font-weight:1000!important;letter-spacing:-.04em!important;}
.top-nav a{font-weight:900!important;}

/* Hero：使用 assets/img/banner.png 黑化作背景 */
.hl3c-hero-collage.brand-v4-hero{
  position:relative!important;
  overflow:hidden!important;
  display:block!important;
  min-height:calc(100vh - 74px)!important;
  padding:82px 26px 80px!important;
  background-image:
    radial-gradient(circle at 50% 8%, rgba(73,124,255,.26), transparent 30%),
    radial-gradient(circle at 12% 42%, rgba(67,217,223,.16), transparent 36%),
    radial-gradient(circle at 86% 50%, rgba(223,253,92,.16), transparent 38%),
    linear-gradient(180deg, rgba(5,9,18,.70), rgba(7,12,24,.86)),
    url('../img/banner.png')!important;
  background-size:cover!important;
  background-position:center!important;
  color:#fff!important;
  isolation:isolate;
}
.hl3c-hero-collage.brand-v4-hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.72), transparent 78%);
  opacity:.38;
}
.hl3c-hero-collage.brand-v4-hero::after{
  content:"";position:absolute;left:50%;top:62%;width:1160px;height:430px;z-index:0;pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse at center, rgba(255,255,255,.15), transparent 68%);
  filter:blur(8px);
}
.hl3c-hero-line{position:absolute!important;z-index:1;pointer-events:none;opacity:.45!important;border-color:rgba(255,255,255,.22)!important;}
.hl3c-line-a{width:920px;height:440px;border:1px solid rgba(255,255,255,.22);border-radius:50%;left:-170px;top:120px;transform:rotate(-10deg);}
.hl3c-line-b{width:780px;height:350px;border:1px solid rgba(67,217,223,.18);border-radius:50%;right:-160px;bottom:110px;transform:rotate(8deg);}
.hl3c-hero-dot{position:absolute!important;right:9%;top:32%;width:58px!important;height:58px!important;border-radius:50%;background:rgba(255,255,255,.14);box-shadow:0 0 0 18px rgba(255,255,255,.05), inset 0 0 0 18px rgba(59,112,255,.22);z-index:1;}

/* 上方標題區：再寬一點、更大氣 */
.hl3c-hero-copy{
  position:relative!important;z-index:3!important;
  max-width:1280px!important;width:100%!important;margin:0 auto!important;text-align:center!important;
  display:flex!important;flex-direction:column!important;align-items:center!important;
}
.hl3c-hero-copy .brand-v4-kicker{
  color:#b9fff2!important;font-size:14px!important;letter-spacing:.24em!important;font-weight:1000!important;
  margin-bottom:22px!important;text-shadow:0 0 24px rgba(67,217,223,.45);
}
.hl3c-hero-copy .brand-v4-kicker::before{background:#68e4d7!important;box-shadow:0 0 18px rgba(67,217,223,.65)!important;}
.hl3c-hero-copy h1{
  max-width:1220px!important;margin:0 auto!important;color:#fff!important;
  font-size:clamp(52px,6.4vw,112px)!important;line-height:.96!important;letter-spacing:-.075em!important;
  font-weight:1000!important;text-shadow:0 14px 42px rgba(0,0,0,.48),0 0 1px rgba(255,255,255,.45);
}
.hl3c-hero-copy h1 span{
  display:block!important;margin-top:16px!important;font-size:clamp(36px,4.45vw,76px)!important;letter-spacing:-.07em!important;
}
.hl3c-hero-copy p{
  max-width:980px!important;margin:30px auto 0!important;color:rgba(255,255,255,.86)!important;
  font-size:18px!important;line-height:2!important;font-weight:850!important;text-shadow:0 6px 22px rgba(0,0,0,.38);
}
.hl3c-hero-copy p::after{
  content:"";display:block;width:128px;height:3px;border-radius:99px;margin:24px auto 0;
  background:linear-gradient(90deg,transparent,var(--hl3c-cyan),var(--hl3c-lime),transparent);
}

.brand-v4-search{
  position:relative!important;z-index:4!important;margin:32px auto 0!important;width:min(860px,100%)!important;
  background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.30)!important;border-radius:26px!important;
  padding:9px!important;box-shadow:0 24px 64px rgba(0,0,0,.28)!important;backdrop-filter:blur(18px)!important;
}
.brand-v4-search input{
  min-height:58px!important;border-radius:18px!important;background:rgba(255,255,255,.92)!important;color:#111827!important;
  font-size:17px!important;font-weight:850!important;border:0!important;padding-left:24px!important;
}
.brand-v4-search input::placeholder{color:#6b7280!important;font-weight:850!important;}
.brand-v4-search .btn{
  min-height:58px!important;border-radius:18px!important;background:linear-gradient(135deg,#35c7d4,#3b70ff)!important;color:#fff!important;
  font-weight:1000!important;box-shadow:0 14px 34px rgba(59,112,255,.34)!important;
}
.brand-v4-actions{justify-content:center!important;margin-top:26px!important;gap:18px!important;}
.brand-v4-actions .btn{min-height:52px!important;border-radius:999px!important;padding:0 28px!important;font-weight:1000!important;}
.brand-v4-actions .btn:first-child{background:linear-gradient(135deg,#ef8d4f,#d66b3e)!important;color:#fff!important;box-shadow:0 18px 38px rgba(224,120,67,.32)!important;}
.btn.secondary,.brand-v4-actions .secondary{background:rgba(255,255,255,.16)!important;color:#fff!important;border:1px solid rgba(255,255,255,.28)!important;box-shadow:0 18px 38px rgba(0,0,0,.18)!important;backdrop-filter:blur(12px)!important;}
.hl3c-hero-tags{display:flex!important;justify-content:center!important;flex-wrap:wrap!important;gap:12px!important;margin-top:26px!important;}
.hl3c-hero-tags span{
  display:inline-flex!important;align-items:center!important;padding:10px 17px!important;border-radius:999px!important;
  background:rgba(255,255,255,.15)!important;color:#fff!important;border:1px solid rgba(255,255,255,.25)!important;
  font-size:14px!important;font-weight:1000!important;box-shadow:0 10px 28px rgba(0,0,0,.14)!important;backdrop-filter:blur(10px)!important;
}
.hl3c-hero-tags span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--hl3c-lime);margin-right:8px;box-shadow:0 0 16px rgba(223,253,92,.72);}

/* 第二層：參考提供照片的「產品照片拼貼」，但為原創生成圖 */
.hl3c-hero-rental-wall{
  position:relative!important;z-index:4!important;width:min(1240px,100%)!important;max-width:1240px!important;
  min-height:560px!important;margin:44px auto 0!important;overflow:visible!important;
}
.hl3c-motion-ring,.hl3c-motion-streak{display:none!important;}
.hl3c-hero-rental-wall::before{
  content:"";position:absolute;left:50%;top:53%;width:1050px;height:370px;transform:translate(-50%,-50%);z-index:0;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.24), transparent 70%);filter:blur(10px);pointer-events:none;
}
.hl3c-rental-card{
  --t:translate3d(0,0,0);--h:translate3d(0,-24px,0) scale(1.035) rotate(0deg);
  position:absolute!important;display:block!important;overflow:visible!important;text-decoration:none!important;
  border-radius:30px!important;background:#fff!important;padding:10px!important;
  box-shadow:0 28px 66px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.84) inset!important;
  transform:var(--t)!important;transition:transform .62s cubic-bezier(.18,.85,.22,1),box-shadow .62s ease,filter .62s ease!important;
  will-change:transform;z-index:2;animation:hl3cSoftFloat 9s ease-in-out infinite alternate;
}
@keyframes hl3cSoftFloat{from{margin-top:0;}to{margin-top:-10px;}}
.hl3c-rental-card:nth-of-type(2n){animation-duration:10.4s;animation-delay:-2.2s;}
.hl3c-rental-card:nth-of-type(3n){animation-duration:11.8s;animation-delay:-4.1s;}
.hl3c-rental-card img{
  display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;border-radius:22px!important;
  filter:saturate(1.08) contrast(1.02) brightness(1.03);transition:transform .65s cubic-bezier(.18,.85,.22,1),filter .65s ease;
}
.hl3c-rental-card::before{
  content:"";position:absolute;inset:10px;border-radius:22px;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 38%,rgba(0,0,0,.04));
}
.hl3c-rental-card span{
  position:absolute!important;left:20px!important;top:18px!important;bottom:auto!important;right:auto!important;z-index:5!important;
  display:inline-flex!important;align-items:center!important;max-width:calc(100% - 40px)!important;padding:7px 12px!important;border-radius:999px!important;
  background:rgba(255,255,255,.88)!important;color:#0f172a!important;border:1px solid rgba(15,23,42,.10)!important;
  box-shadow:0 10px 24px rgba(15,23,42,.15)!important;font-size:12px!important;line-height:1.2!important;font-weight:1000!important;
  white-space:normal!important;backdrop-filter:blur(10px)!important;pointer-events:none!important;
}
.hl3c-rental-card::after{
  content:attr(data-tip);position:absolute;left:50%;top:calc(100% + 12px);transform:translateX(-50%) translateY(6px);
  min-width:max-content;max-width:280px;padding:9px 14px;border-radius:999px;background:rgba(5,10,20,.92);color:#fff;
  font-size:13px;font-weight:950;line-height:1.3;opacity:0;pointer-events:none;z-index:300;box-shadow:0 12px 24px rgba(0,0,0,.28);
  transition:opacity .25s ease,transform .25s ease;
}
.hl3c-rental-card:hover{z-index:220!important;transform:var(--h)!important;box-shadow:0 44px 100px rgba(0,0,0,.46),0 0 0 1px rgba(255,255,255,.94) inset!important;}
.hl3c-rental-card:hover img{transform:scale(1.025);filter:saturate(1.16) contrast(1.04) brightness(1.06);}
.hl3c-rental-card:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}

.hl3c-rental-tv{width:360px!important;height:250px!important;left:50%!important;top:26px!important;--t:translateX(-50%) rotate(0deg);--h:translateX(-50%) translateY(-24px) scale(1.035) rotate(0deg);z-index:8!important;}
.hl3c-rental-projector{width:285px!important;height:205px!important;left:6%!important;top:148px!important;--t:rotate(-4deg);--h:translateY(-24px) scale(1.04) rotate(-1deg);z-index:4!important;}
.hl3c-rental-screen{width:285px!important;height:205px!important;right:6%!important;top:150px!important;--t:rotate(4deg);--h:translateY(-24px) scale(1.04) rotate(1deg);z-index:4!important;}
.hl3c-rental-vc{width:315px!important;height:205px!important;left:18%!important;bottom:74px!important;--t:rotate(2deg);--h:translateY(-24px) scale(1.04) rotate(.5deg);z-index:7!important;}
.hl3c-rental-ai{width:305px!important;height:205px!important;right:18%!important;bottom:72px!important;--t:rotate(-2deg);--h:translateY(-24px) scale(1.04) rotate(-.5deg);z-index:7!important;}
.hl3c-rental-ad{width:245px!important;height:190px!important;left:50%!important;bottom:34px!important;--t:translateX(-50%) rotate(.8deg);--h:translateX(-50%) translateY(-24px) scale(1.04) rotate(0deg);z-index:10!important;}

/* 下方區塊跟深色 Hero 搭配，但避免過暗 */
.brand-v4-section{background:#fff8ef!important;color:#111827!important;}
.brand-v4-section-head span{color:#14a394!important;font-weight:1000!important;letter-spacing:.16em!important;}
.brand-v4-section-head h2{color:#111827!important;font-weight:1000!important;}
.brand-v4-section-head p{color:#475569!important;font-weight:750!important;}
.brand-v4-scenarios{background:linear-gradient(135deg,#0e1727 0%,#173231 100%)!important;color:#fff!important;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.10);}
.brand-v4-scenarios .brand-v4-section-head span{color:#b9fff2!important;}
.brand-v4-scenarios .brand-v4-section-head h2{color:#fff!important;}
.brand-v4-scenarios .brand-v4-section-head p{color:rgba(255,255,255,.72)!important;}
.brand-v4-scenario-card{background:rgba(255,255,255,.11)!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 20px 52px rgba(0,0,0,.20)!important;color:#fff!important;backdrop-filter:blur(14px);}
.brand-v4-scenario-card h3{color:#fff!important;font-weight:1000!important;}
.brand-v4-scenario-card a{background:rgba(255,255,255,.13)!important;color:rgba(255,255,255,.9)!important;border:1px solid rgba(255,255,255,.20)!important;font-weight:900!important;}
.brand-v4-scenario-card a:hover{background:#dffd5c!important;color:#07111f!important;}
.site-footer{background:linear-gradient(135deg,#101827 0%,#162f31 100%)!important;color:rgba(255,255,255,.78)!important;border-top:1px solid rgba(255,255,255,.12)!important;}
.footer-v6 h2,.footer-v6 h3,.footer-v6 strong{color:#fff!important;}
.footer-v6 p,.footer-v6 li,.footer-v6 a,.footer-v6-bottom{color:rgba(255,255,255,.72)!important;}
.footer-v6 a:hover{color:#b9fff2!important;}
.footer-v6-kicker{color:#b9fff2!important;font-weight:1000!important;}
.footer-v6-service-area{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 16px 36px rgba(0,0,0,.16)!important;}
.footer-v6-bottom{border-top:1px solid rgba(255,255,255,.12)!important;}

@media (max-width:1050px){
  .hl3c-hero-collage.brand-v4-hero{padding-top:64px!important;}
  .hl3c-hero-rental-wall{min-height:560px!important;max-width:840px!important;}
  .hl3c-rental-tv{width:300px!important;height:215px!important;}
  .hl3c-rental-projector{left:0!important;width:245px!important;height:180px!important;}
  .hl3c-rental-screen{right:0!important;width:245px!important;height:180px!important;}
  .hl3c-rental-vc{left:11%!important;width:270px!important;height:180px!important;}
  .hl3c-rental-ai{right:11%!important;width:260px!important;height:180px!important;}
  .hl3c-rental-ad{width:215px!important;height:165px!important;}
}
@media (max-width:720px){
  .hl3c-hero-collage.brand-v4-hero{padding:54px 18px 46px!important;min-height:auto!important;}
  .hl3c-hero-copy h1{font-size:42px!important;line-height:1.08!important;letter-spacing:-.06em!important;}
  .hl3c-hero-copy h1 span{font-size:.74em!important;line-height:1.12!important;}
  .hl3c-hero-copy p{font-size:15px!important;line-height:1.85!important;}
  .brand-v4-search{display:block!important;}
  .brand-v4-search input{width:100%!important;margin-bottom:8px!important;}
  .brand-v4-search .btn{width:100%!important;}
  .hl3c-hero-rental-wall{min-height:520px!important;max-width:380px!important;margin-top:34px!important;}
  .hl3c-rental-card{border-radius:18px!important;padding:6px!important;}
  .hl3c-rental-card img,.hl3c-rental-card::before{border-radius:14px!important;}
  .hl3c-rental-card span{font-size:10px!important;padding:6px 8px!important;left:12px!important;top:12px!important;}
  .hl3c-rental-tv{width:190px!important;height:140px!important;left:50%!important;top:28px!important;}
  .hl3c-rental-projector{width:158px!important;height:122px!important;left:0!important;top:142px!important;}
  .hl3c-rental-screen{width:158px!important;height:122px!important;right:0!important;top:142px!important;}
  .hl3c-rental-vc{width:170px!important;height:126px!important;left:12px!important;bottom:102px!important;}
  .hl3c-rental-ai{width:168px!important;height:126px!important;right:10px!important;bottom:96px!important;}
  .hl3c-rental-ad{width:146px!important;height:112px!important;left:50%!important;bottom:34px!important;}
}
