/* HL3C v45 - Top title + generated colorful photo collage */
:root{
  --hl3c-ink:#07111f;
  --hl3c-muted:#475569;
  --hl3c-blue:#3267f0;
  --hl3c-teal:#14a394;
  --hl3c-warm:#fff7ed;
  --hl3c-soft:#f2fbf7;
}
body{background:#fff8ef;color:var(--hl3c-ink);}
.site-header{
  background:rgba(255,255,255,.90)!important;
  border-bottom:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 12px 30px rgba(15,23,42,.06)!important;
  backdrop-filter:blur(14px);
}
.site-header .brand{font-weight:1000!important;letter-spacing:-.03em;color:#07111f!important;}
.site-header .brand::first-letter{color:#3267f0;}
.top-nav a{color:#111827!important;font-weight:900!important;}
.top-nav a:hover{color:#3267f0!important;}

.hl3c-hero-collage.brand-v4-hero{
  position:relative!important;
  display:block!important;
  overflow:hidden!important;
  min-height:auto!important;
  padding:88px clamp(22px,4vw,72px) 72px!important;
  background:
    radial-gradient(circle at 15% 15%,rgba(51,103,240,.13),transparent 25%),
    radial-gradient(circle at 78% 24%,rgba(20,163,148,.15),transparent 31%),
    radial-gradient(circle at 55% 96%,rgba(255,191,82,.13),transparent 30%),
    linear-gradient(135deg,#fffaf4 0%,#f7f3e9 46%,#effaf5 100%)!important;
  color:var(--hl3c-ink)!important;
}
.hl3c-hero-collage::before{
  content:"";position:absolute;inset:-8%;pointer-events:none;opacity:.72;
  background:
    linear-gradient(115deg,transparent 0 44%,rgba(51,103,240,.09) 44.15%,transparent 44.45%),
    linear-gradient(28deg,transparent 0 60%,rgba(20,163,148,.10) 60.15%,transparent 60.45%);
  transform:rotate(-1deg);
}
.hl3c-hero-line{position:absolute;border-radius:50%;border:1px solid rgba(15,23,42,.075);pointer-events:none;}
.hl3c-line-a{width:820px;height:390px;left:-100px;top:100px;transform:rotate(-11deg);}
.hl3c-line-b{width:920px;height:420px;right:-140px;bottom:60px;transform:rotate(9deg);border-color:rgba(51,103,240,.09);}
.hl3c-hero-dot{position:absolute;right:10%;top:20%;width:18px;height:18px;border-radius:50%;background:rgba(51,103,240,.16);box-shadow:0 0 0 20px rgba(51,103,240,.06);}

/* 第一層：大標題移到上方，讓拼貼有更大空間 */
.hl3c-hero-copy{
  position:relative;z-index:3;max-width:1120px!important;margin:0 auto!important;text-align:center!important;
  display:flex;flex-direction:column;align-items:center;
}
.brand-v4-kicker{
  display:inline-flex!important;align-items:center;gap:14px;margin:0 0 20px!important;
  color:#2f65ef!important;font-size:14px!important;letter-spacing:.20em!important;font-weight:1000!important;
}
.brand-v4-kicker::before{content:"";width:48px;height:3px;border-radius:99px;background:#14a394;display:inline-block;}
.hl3c-hero-copy h1{
  margin:0!important;color:#030712!important;font-size:clamp(46px,5.8vw,94px)!important;
  line-height:1.06!important;letter-spacing:-.065em!important;font-weight:1000!important;max-width:1120px!important;text-wrap:balance;
}
.hl3c-hero-copy h1 span{display:block;margin-top:12px;color:#030712!important;font-size:.66em!important;letter-spacing:-.055em!important;}
.hl3c-hero-copy p{
  max-width:880px;margin:28px auto 0!important;color:#334155!important;font-size:18px!important;line-height:1.9!important;font-weight:750!important;
}
.brand-v4-search{
  width:min(850px,100%);margin:32px auto 0!important;padding:10px!important;border-radius:24px!important;
  background:rgba(255,255,255,.86)!important;border:1px solid rgba(15,23,42,.08)!important;
  box-shadow:0 20px 50px rgba(15,23,42,.12)!important;backdrop-filter:blur(14px);
}
.brand-v4-search input{
  background:#fff!important;color:#0f172a!important;border:1px solid rgba(15,23,42,.10)!important;border-radius:18px!important;font-weight:800!important;
}
.brand-v4-search input::placeholder{color:#7b8493!important;opacity:1;}
.btn,.brand-v4-search .btn{
  border-radius:999px!important;font-weight:950!important;border:0!important;
  background:linear-gradient(135deg,#227ca7,#3768ee)!important;color:#fff!important;
  box-shadow:0 14px 28px rgba(51,104,240,.24)!important;
}
.brand-v4-actions{justify-content:center!important;margin-top:26px!important;}
.brand-v4-actions .btn:first-child{background:linear-gradient(135deg,#d86f43,#e58a55)!important;}
.btn.secondary,.brand-v4-actions .secondary{background:#172033!important;color:#fff!important;box-shadow:0 14px 30px rgba(15,23,42,.18)!important;}
.hl3c-hero-tags{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:24px;}
.hl3c-hero-tags span{
  display:inline-flex;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.78);
  color:#1f2937;border:1px solid rgba(15,23,42,.08);font-size:14px;font-weight:900;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
}

/* 第二層：生成照片拼貼，色彩更繽紛、加框，重疊較低 */
.hl3c-hero-rental-wall{
  position:relative!important;z-index:4;width:min(1180px,100%)!important;max-width:1180px!important;
  min-height:610px!important;margin:42px auto 0!important;overflow:visible!important;
}
.hl3c-motion-ring{position:absolute;border-radius:50%;border:1px solid rgba(15,23,42,.08);pointer-events:none;animation:hl3cOrbit 18s ease-in-out infinite alternate;}
.hl3c-ring-a{width:760px;height:430px;left:50%;top:40px;transform:translateX(-50%) rotate(-8deg);}
.hl3c-ring-b{width:560px;height:320px;right:2%;bottom:40px;border-color:rgba(51,104,240,.12);animation-delay:-5s;}
.hl3c-motion-streak{position:absolute;height:3px;border-radius:99px;background:linear-gradient(90deg,transparent,rgba(51,104,240,.24),transparent);pointer-events:none;}
.hl3c-streak-a{width:560px;right:10%;top:145px;transform:rotate(-9deg);}
.hl3c-streak-b{width:620px;left:8%;bottom:130px;transform:rotate(-8deg);background:linear-gradient(90deg,transparent,rgba(20,163,148,.24),transparent);}
@keyframes hl3cOrbit{from{translate:0 0;}to{translate:0 -14px;}}

.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:28px!important;background:#fff!important;padding:9px!important;
  box-shadow:0 24px 56px rgba(15,23,42,.18),0 0 0 1px rgba(255,255,255,.92) inset!important;
  transform:var(--t)!important;transition:transform .6s cubic-bezier(.18,.85,.22,1),box-shadow .6s ease,filter .6s ease!important;
  will-change:transform;z-index:2;animation:hl3cFloat 8.2s ease-in-out infinite alternate;
}
.hl3c-rental-card:nth-of-type(2n){animation-duration:9.4s;animation-delay:-2.5s;}
.hl3c-rental-card:nth-of-type(3n){animation-duration:10.2s;animation-delay:-4.2s;}
@keyframes hl3cFloat{from{margin-top:0;}to{margin-top:-12px;}}
.hl3c-rental-card img{
  display:block;width:100%;height:100%;object-fit:cover;border-radius:22px;
  filter:brightness(1.06) saturate(1.16) contrast(1.03);
  transition:transform .65s cubic-bezier(.18,.85,.22,1),filter .65s ease;
}
.hl3c-rental-card::before{
  content:"";position:absolute;inset:9px;border-radius:22px;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 38%,rgba(0,0,0,.08));
}
.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(15,23,42,.92);
  color:#fff;font-size:13px;font-weight:950;line-height:1.3;opacity:0;pointer-events:none;z-index:160;
  box-shadow:0 12px 24px rgba(15,23,42,.24);transition:opacity .25s ease,transform .25s ease;
}
.hl3c-rental-card span{
  position:absolute!important;left:22px!important;top:22px!important;bottom:auto!important;right:auto!important;
  display:inline-flex;align-items:center;max-width:calc(100% - 44px);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,.13)!important;font-size:12px!important;line-height:1.2!important;
  font-weight:1000!important;letter-spacing:.01em!important;white-space:normal!important;z-index:5;pointer-events:none;backdrop-filter:blur(10px);
}
.hl3c-rental-card:hover{z-index:150!important;transform:var(--h)!important;box-shadow:0 38px 92px rgba(15,23,42,.26),0 0 0 1px rgba(255,255,255,.96) inset!important;}
.hl3c-rental-card:hover img{transform:scale(1.025);filter:brightness(1.09) saturate(1.20) contrast(1.04);}
.hl3c-rental-card:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}

/* 參考圖式橫向拼貼：中央大圖，左右上下散開 */
.hl3c-rental-tv{width:310px!important;height:250px!important;left:50%!important;top:46px!important;--t:translateX(-50%) rotate(0deg);--h:translateX(-50%) translateY(-24px) scale(1.035) rotate(0deg);z-index:8;}
.hl3c-rental-projector{width:260px!important;height:205px!important;left:7%!important;top:176px!important;--t:rotate(-3deg);--h:translateY(-24px) scale(1.04) rotate(-1deg);z-index:4;}
.hl3c-rental-screen{width:265px!important;height:210px!important;right:7%!important;top:166px!important;--t:rotate(3deg);--h:translateY(-24px) scale(1.04) rotate(1deg);z-index:4;}
.hl3c-rental-vc{width:290px!important;height:205px!important;left:21%!important;bottom:62px!important;--t:rotate(1.5deg);--h:translateY(-24px) scale(1.04) rotate(.5deg);z-index:7;}
.hl3c-rental-ai{width:270px!important;height:205px!important;right:19%!important;bottom:54px!important;--t:rotate(-1.8deg);--h:translateY(-24px) scale(1.04) rotate(-.6deg);z-index:7;}
.hl3c-rental-ad{width:230px!important;height:190px!important;left:50%!important;bottom:30px!important;--t:translateX(-50%) rotate(.8deg);--h:translateX(-50%) translateY(-24px) scale(1.04) rotate(0deg);z-index:10;}

/* 首頁下方區塊與頁尾：跟上方 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,#fffaf4 0%,#edf8f3 100%)!important;border-top:1px solid rgba(15,23,42,.08);border-bottom:1px solid rgba(15,23,42,.08);}
.brand-v4-scenario-card{background:rgba(255,255,255,.84)!important;border:1px solid rgba(15,23,42,.10)!important;box-shadow:0 18px 42px rgba(15,23,42,.08)!important;color:#111827!important;backdrop-filter:blur(12px);}
.brand-v4-scenario-card h3{color:#111827!important;font-weight:1000!important;}
.brand-v4-scenario-card a{background:#f1f7f4!important;color:#213047!important;border:1px solid rgba(15,23,42,.11)!important;font-weight:900!important;}
.brand-v4-scenario-card a:hover{background:#dfff63!important;color:#07111f!important;}
.brand-v4-trust{background:linear-gradient(135deg,#f7fbff 0%,#fff7ed 100%)!important;}
.brand-v4-trust-card{background:rgba(255,255,255,.84)!important;color:#111827!important;border:1px solid rgba(15,23,42,.10)!important;box-shadow:0 22px 50px rgba(15,23,42,.09)!important;}
.brand-v4-trust-card h2,.brand-v4-trust-card strong{color:#111827!important;}
.brand-v4-trust-card p,.brand-v4-trust-card span{color:#475569!important;}
.site-footer{background:linear-gradient(135deg,#fff8ee 0%,#edf7f2 100%)!important;color:#172033!important;border-top:1px solid rgba(15,23,42,.10)!important;}
.footer-v6{color:#172033!important;}
.footer-v6 h2,.footer-v6 h3,.footer-v6 strong{color:#111827!important;}
.footer-v6 p,.footer-v6 li,.footer-v6 a,.footer-v6-bottom{color:#475569!important;}
.footer-v6 a:hover{color:#3368f0!important;}
.footer-v6-kicker{color:#14a394!important;font-weight:1000!important;}
.footer-v6-service-area{background:rgba(255,255,255,.72)!important;border:1px solid rgba(15,23,42,.10)!important;box-shadow:0 16px 36px rgba(15,23,42,.07)!important;}
.footer-v6-bottom{border-top:1px solid rgba(15,23,42,.10)!important;}

@media (max-width:1050px){
  .hl3c-hero-rental-wall{min-height:560px!important;max-width:820px!important;}
  .hl3c-rental-tv{width:270px!important;height:220px!important;}
  .hl3c-rental-projector{left:1%!important;width:230px!important;height:185px!important;}
  .hl3c-rental-screen{right:1%!important;width:230px!important;height:185px!important;}
  .hl3c-rental-vc{left:12%!important;width:250px!important;height:180px!important;}
  .hl3c-rental-ai{right:12%!important;width:240px!important;height:180px!important;}
  .hl3c-rental-ad{width:205px!important;height:170px!important;}
}
@media (max-width:720px){
  .hl3c-hero-collage.brand-v4-hero{padding:58px 18px 48px!important;}
  .hl3c-hero-copy h1{font-size:42px!important;line-height:1.1!important;letter-spacing:-.055em!important;}
  .hl3c-hero-copy h1 span{font-size:.72em!important;}
  .hl3c-hero-copy p{font-size:15px!important;line-height:1.8!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:32px!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:150px!important;left:50%!important;top:28px!important;}
  .hl3c-rental-projector{width:158px!important;height:126px!important;left:0!important;top:150px!important;}
  .hl3c-rental-screen{width:158px!important;height:126px!important;right:0!important;top:146px!important;}
  .hl3c-rental-vc{width:170px!important;height:128px!important;left:12px!important;bottom:98px!important;}
  .hl3c-rental-ai{width:168px!important;height:128px!important;right:10px!important;bottom:90px!important;}
  .hl3c-rental-ad{width:146px!important;height:116px!important;left:50%!important;bottom:34px!important;}
}