@charset "utf-8";
/* 白袍輕鬆貸 event page — 樣式源檔
   封包：/event/loan_doctor/　譜系：信貸（LoanIntro 型）
   改樣式時同步更新 index.html 引用的 ?v= 版本參數，避免瀏覽器沿用舊 CSS 造成爆版 */


  :root{
    --purple:#7b34c6; --purple-dark:#5f21a3; --purple-pale:#f3ecfc;
    --green:#93da49; --green-dark:#55a315; --green-pale:#eef4df;
    --yellow:#ffd84d; --pink:#f76f9e; --pink-dark:#dd4f7f;
    --brown:#993c1d; --gray:#666666; --text:#3a3a3a;
    --disp:"Noto Sans TC",Arial,"微軟正黑體","PingFang TC",sans-serif;
    --body:"Noto Sans TC",Arial,"微軟正黑體","PingFang TC",sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{font-family:var(--body);font-weight:500;color:var(--text);background:#fff;line-height:1.65;overflow-x:hidden;}
  img{max-width:100%;height:auto;} a{text-decoration:none;}
  .wrap{max-width:1100px;margin:0 auto;padding:0 24px;}
  .rv{opacity:0;transform:translateY(34px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.9,.3,1.2);}
  .rv.show{opacity:1;transform:none;}
  @keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg);}}
  @keyframes bob{0%,100%{translate:0 0;}50%{translate:0 -16px;}}
  @keyframes wiggle{0%,100%{rotate:-2deg;}50%{rotate:3deg;}}
  @keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
  @keyframes chPop{to{opacity:1;transform:none;}}
  @keyframes shine{0%{left:-80%;}45%,100%{left:130%;}}
  @keyframes twinkle{0%,100%{opacity:.25;transform:scale(.8) rotate(0);}50%{opacity:1;transform:scale(1.15) rotate(18deg);}}
  @keyframes ring{0%{transform:scale(1);opacity:1;}100%{transform:scale(1.45);opacity:0;}}
  @keyframes ecg{to{stroke-dashoffset:0;}}

  .siteHeader{background:#fff;position:relative;z-index:20;box-shadow:0 1px 0 rgba(0,0,0,.05);}
  .siteHeader .wrap{display:flex;align-items:center;justify-content:space-between;height:62px;}
  .siteHeader .logo img{height:32px;width:auto;display:block;}
  .crumb{font-size:13px;color:#9a92a8;font-weight:500;}
  .crumb b{color:var(--purple);font-weight:700;}

  /* hero */
  .hero{position:relative;overflow:hidden;text-align:center;padding:80px 20px 150px;
    background:
      radial-gradient(110% 70% at 18% 10%,rgba(147,218,73,.16) 0%,transparent 55%),
      radial-gradient(110% 70% at 84% 14%,rgba(255,255,255,.14) 0%,transparent 55%),
      linear-gradient(158deg,#33095c 0%,#5f21a3 52%,#7b34c6 100%);}
  .hero .ecgBg{position:absolute;left:0;right:0;z-index:0;width:100%;height:150px;}
  .hero .ecgBg path{fill:none;stroke-linecap:round;stroke-linejoin:round;}
  .hero .ecgBg .base{stroke:rgba(255,255,255,.16);stroke-width:5;}
  .hero .ecgBg .run{stroke:rgba(214,183,247,.85);stroke-width:5;stroke-dasharray:90 2200;animation:ecgRun 6s linear infinite;}
  .hero .ecgBg.e1{top:14%;opacity:.9;}
  .hero .ecgBg.e2{top:46%;opacity:.75;transform:scaleX(-1);}
  .hero .ecgBg.e2 .run{animation-delay:2s;stroke:rgba(168,224,97,.9);}
  .hero .ecgBg.e3{bottom:8%;opacity:.6;}
  .hero .ecgBg.e3 .run{animation-delay:3.6s;}
  @keyframes ecgRun{from{stroke-dashoffset:2290;}to{stroke-dashoffset:0;}}
  .hero>*{position:relative;z-index:2;}
  .bill{position:absolute;width:84px;height:50px;border:4px solid rgba(255,255,255,.7);border-radius:9px;background:rgba(255,255,255,.14);z-index:1;animation:bob 4.2s ease-in-out infinite;}
  .bill::after{content:"$";position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);font-family:var(--disp);font-weight:900;font-size:24px;color:rgba(255,255,255,.85);}
  .mcap{position:absolute;width:66px;height:28px;border-radius:999px;z-index:1;
    background:linear-gradient(90deg,#b98ae8 50%,#fff 50%);border:3px solid #ffffff;animation:bob 5s ease-in-out infinite;}
  .mcross{position:absolute;width:46px;height:46px;border-radius:13px;z-index:1;background:var(--green);color:#fff;
    font-size:25px;font-weight:900;display:flex;align-items:center;justify-content:center;
    box-shadow:0 5px 0 rgba(85,163,21,.4);animation:bob 4.6s ease-in-out infinite;}
  .spark{position:absolute;z-index:1;color:var(--yellow);animation:twinkle 2.4s ease-in-out infinite;}
  .hero .wave{position:absolute;left:0;right:0;bottom:-1px;z-index:4;display:block;width:100%;height:64px;}
  .heroStage{position:relative;display:inline-block;}
  .cornerTag{position:absolute;left:-76px;top:-32px;z-index:6;rotate:-10deg;font-family:var(--disp);font-weight:900;
    font-size:21px;color:#fff;letter-spacing:.06em;background:linear-gradient(160deg,#a8e061,var(--green));
    padding:8px 24px;border-radius:12px;box-shadow:0 5px 0 var(--green-dark);animation:bob 4.4s ease-in-out infinite;}
  .burst{position:absolute;right:-88px;top:-48px;z-index:6;rotate:14deg;width:98px;height:98px;color:#fff;
    font-family:var(--disp);font-weight:900;font-size:26px;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(160deg,#ff8fb0,#f7437f);
    clip-path:polygon(100% 50%,83.3% 63.8%,85.4% 85.4%,63.8% 83.3%,50% 100%,36.2% 83.3%,14.6% 85.4%,16.7% 63.8%,0% 50%,16.7% 36.2%,14.6% 14.6%,36.2% 16.7%,50% 0%,63.8% 16.7%,85.4% 14.6%,83.3% 36.2%);
    animation:twinkle 2.6s ease-in-out infinite;}
  .popTitle{display:flex;justify-content:center;align-items:flex-end;gap:2px;}
  .pch{position:relative;display:inline-block;font-family:var(--disp);font-weight:900;font-size:112px;line-height:1.18;
    filter:drop-shadow(0 12px 0 rgba(95,33,163,.22));opacity:0;transform:translateY(52px) scale(.55) rotate(-8deg);
    animation:chPop .66s cubic-bezier(.2,1.5,.4,1) forwards;}
  .pch::after{content:attr(data-ch);position:absolute;left:0;top:0;z-index:0;color:#fff;-webkit-text-stroke:26px #fff;}
  .pch::before{content:attr(data-ch);position:absolute;left:0;top:0;z-index:1;color:var(--purple);-webkit-text-stroke:14px var(--purple);}
  .pch b{position:relative;z-index:2;font-weight:900;color:#fff;}
  .pch.acc{font-size:124px;} /* 主標「輕鬆」放大字（原為 HTML inline style，移入 CSS 才吃得到 RWD 斷點）*/
  .pch.acc b{color:var(--yellow);}
  .heroSlogan{margin-top:30px;font-family:var(--disp);font-weight:900;font-size:25px;color:#efe6ff;
    letter-spacing:.14em;opacity:0;animation:fadeUp .7s ease .75s forwards;}
  .heroSlogan .sl{color:var(--green);margin:0 10px;font-size:27px;}
  .goldLine{margin-top:26px;display:flex;align-items:flex-end;justify-content:center;gap:18px;
    opacity:0;animation:fadeUp .7s ease .95s forwards;}
  .goldLabel{font-family:var(--disp);font-weight:900;background:#ffffff;color:var(--purple-dark);font-size:24px;
    padding:9px 22px;border-radius:12px;rotate:-3deg;box-shadow:0 5px 0 rgba(0,0,0,.28);margin-bottom:24px;}
  .goldNum,.goldQi{position:relative;font-family:var(--disp);font-weight:900;line-height:1;filter:drop-shadow(0 10px 0 rgba(95,33,163,.20));}
  .goldNum{font-size:116px;} .goldQi{font-size:54px;margin-bottom:10px;}
  .goldNum::after,.goldQi::after{content:attr(data-t);position:absolute;left:0;top:0;color:#fff;-webkit-text-stroke:20px #fff;z-index:0;}
  .goldNum::before,.goldQi::before{content:attr(data-t);position:absolute;left:0;top:0;color:var(--purple-dark);-webkit-text-stroke:10px var(--purple-dark);z-index:1;}
  .goldNum b,.goldQi b{position:relative;z-index:2;font-weight:900;
    background:linear-gradient(180deg,#fff6d4 5%,#ffd84d 48%,#eda200 92%);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .dashBadge{display:inline-block;position:relative;margin-top:30px;font-family:var(--disp);font-weight:900;font-size:29px;
    letter-spacing:.06em;color:#ffffff;border:3px dashed rgba(255,255,255,.62);border-radius:16px;padding:12px 36px;
    background:rgba(255,255,255,.10);opacity:0;animation:fadeUp .7s ease 1.15s forwards;}
  .dashBadge b{color:#ffc7dc;font-weight:900;}
  .dashBadge::before,.dashBadge::after{content:"";position:absolute;top:50%;transform:translateY(-50%);width:42px;height:16px;
    background:repeating-linear-gradient(90deg,rgba(255,255,255,.85) 0 9px,transparent 9px 16px);border-radius:3px;opacity:.7;}
  .dashBadge::before{left:-60px;} .dashBadge::after{right:-60px;}
  /* 本元素同時掛 .mascotHero .drE；後定義的 .drE(position:relative) 會覆寫 position，
     故此處明寫 relative，left/bottom 係相對位移（非絕對定位），為原始設計之實際渲染結果 */
  /* 主視覺申辦鈕：與右下浮動鈕同樣捲至方案比較區 */
  .heroCtaWrap{margin-top:26px;}
  .heroCta{margin-top:0;font-size:24px;padding:15px 52px;}
  .mascotHero{position:relative;left:6%;bottom:26px;width:172px;z-index:7;
    animation:wiggle 3.6s ease-in-out infinite;transform-origin:bottom center;}
  .drE{position:relative;display:block;height:142px;}
  .drE .coat{position:absolute;left:8%;bottom:0;width:84%;z-index:0;}
  .drE .face{position:absolute;left:17%;top:0;width:66%;z-index:1;display:block;}
  .eDeco{position:absolute;z-index:2;pointer-events:none;animation:bob 5s ease-in-out infinite;}
  .eDeco img{width:100%;display:block;}
  .badgeNote{margin:10px auto 0;max-width:640px;font-size:12px;line-height:1.5;color:rgba(255,255,255,.72);}
  .hookNote{margin:8px auto 0;max-width:680px;font-size:12px;line-height:1.5;color:var(--gray);}

  /* 主卡片 */
  .mainSec{background:#ffffff;background-image:radial-gradient(#f0e9fa 2.4px,transparent 2.4px);
    background-size:30px 30px;padding:56px 0 72px;position:relative;}
  .prodCard{background:#fff;border:2px solid #ece2fa;border-radius:30px;padding:52px 52px 54px;text-align:center;
    box-shadow:0 14px 34px rgba(95,33,163,.08);outline:2px dashed #dff0c4;outline-offset:-12px;}
  .prodCard h2{font-family:var(--disp);font-weight:900;font-size:42px;color:var(--green-dark);letter-spacing:.06em;line-height:1.3;}
  .prodCard .amount{font-family:var(--disp);font-weight:900;font-size:28px;margin-top:12px;color:var(--text);}
  .prodCard .amount b{color:var(--purple);font-size:54px;font-weight:900;padding:0 6px;
    background:linear-gradient(transparent 68%,var(--yellow) 68% 92%,transparent 92%);}
  .ribbonArrow{display:inline-block;position:relative;margin-top:20px;font-family:var(--disp);font-weight:700;
    background:#d9edbc;color:var(--green-dark);font-size:21px;padding:10px 52px 10px 34px;
    clip-path:polygon(0 0,calc(100% - 24px) 0,100% 50%,calc(100% - 24px) 100%,0 100%,14px 50%);}
  .featureRow{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:40px;flex-wrap:wrap;}
  .mascotCard{width:180px;flex:0 0 auto;animation:bob 5s ease-in-out infinite;}
  .mascotCard img{width:100%;display:block;}
  .bubbles{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;}
  .bubble{width:206px;height:206px;border-radius:50%;background:#fff;border:4px solid var(--green-pale);
    box-shadow:0 10px 24px rgba(88,164,26,.18);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    transition:transform .25s cubic-bezier(.2,1.4,.4,1);}
  .bubble:hover{transform:translateY(-10px) scale(1.04);}
  .bubble:nth-child(2){animation:bob 4.6s ease-in-out .5s infinite;}
  .bubble:nth-child(1){border-color:#e6d5f8;} .bubble:nth-child(3){border-color:#ffe9a8;}
  .bubble .tag{font-family:var(--disp);font-weight:900;background:var(--green);color:#fff;font-size:15px;border-radius:999px;padding:3px 18px;margin-bottom:8px;}
  .bubble:nth-child(1) .tag{background:var(--purple);} .bubble:nth-child(3) .tag{background:var(--yellow);color:#6b4a00;}
  .bubble .lab{font-family:var(--disp);font-weight:700;font-size:18px;color:var(--text);}
  .bubble .num{font-family:var(--disp);font-weight:900;font-size:42px;color:var(--purple);line-height:1.1;}
  .bubble .num small{font-size:24px;} .bubble .numS{font-family:var(--disp);font-weight:900;font-size:34px;color:var(--purple);line-height:1.1;}
  .bubble .numS small{font-size:21px;}
  .bubble .numPair{display:flex;flex-direction:column;gap:1px;margin-top:3px;font-family:var(--disp);font-weight:700;font-size:13.5px;color:#7a6a93;line-height:1.1;}
  .bubble .pairRow b{font-family:var(--disp);font-weight:900;font-size:25px;color:var(--purple);}
  .bubble .pairRow small{font-size:12.5px;font-weight:700;}
  .bubble .preLab{display:block;font-family:var(--disp);font-weight:700;font-size:13.5px;color:#7a6a93;line-height:1.1;}
  .bubble:nth-child(1) .num{font-size:34px;}
  .bubble:nth-child(1) .num small{font-size:20px;}
  .bubble:nth-child(1) .cap{font-size:10.2px;max-width:64%;line-height:1.32;}
  .bubble .cap{font-size:11.5px;color:#999;font-weight:500;max-width:74%;margin:0 auto;line-height:1.5;}
  .hookStrip{margin:40px auto 0;max-width:820px;position:relative;overflow:hidden;
    background:linear-gradient(100deg,var(--purple),#9550e0);color:#fff;border-radius:999px;padding:16px 34px;
    font-family:var(--disp);font-weight:900;font-size:24px;box-shadow:0 10px 24px rgba(123,52,198,.30);}
  .hookStrip b{color:#d9f7b8;font-size:27px;font-weight:900;}
  .hookStrip::after{content:"";position:absolute;top:0;left:-80%;width:45%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);animation:shine 3.8s ease-in-out 1s infinite;}
  .chipsLine{margin-top:22px;font-family:var(--disp);font-weight:700;font-size:16px;color:var(--gray);letter-spacing:.05em;}
  .ctaMain{display:inline-block;margin-top:30px;position:relative;overflow:hidden;font-family:var(--disp);font-weight:900;
    font-size:27px;letter-spacing:.1em;color:#fff;background:linear-gradient(180deg,#ff9dbb,var(--pink));
    border-radius:999px;padding:17px 64px;border:4px solid #fff;
    box-shadow:0 8px 0 var(--pink-dark),0 18px 34px rgba(221,79,127,.35);transition:.15s;}
  .ctaMain:hover{transform:translateY(3px);box-shadow:0 5px 0 var(--pink-dark);}
  .ctaMain::after{content:"";position:absolute;top:0;left:-80%;width:45%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);animation:shine 3.4s ease-in-out 2s infinite;}

  /* 方案 VS */
  .plansSec{padding:70px 0 44px;text-align:center;background:#fff;
    background-image:repeating-linear-gradient(115deg,rgba(123,52,198,.028) 0 2px,transparent 2px 30px);}
  .ecgTitle{display:flex;align-items:center;justify-content:center;gap:16px;font-family:var(--disp);font-weight:900;
    font-size:42px;color:var(--green-dark);letter-spacing:.05em;}
  .ecgTitle svg{width:120px;height:26px;flex:0 0 auto;}
  .ecgTitle svg polyline{fill:none;stroke:var(--green);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;
    stroke-dasharray:170;stroke-dashoffset:170;animation:ecg 2.4s ease-out forwards;}
  .vsWrap{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:108px;margin-top:52px;text-align:left;}
  .vsBadge{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:5;width:84px;height:84px;border-radius:50%;
    background:radial-gradient(circle at 35% 30%,#ffe58a,var(--yellow) 60%,#eda200);border:5px solid #fff;
    box-shadow:0 8px 20px rgba(0,0,0,.20);display:flex;align-items:center;justify-content:center;
    font-family:var(--disp);font-weight:900;font-size:34px;color:#7a5b00;rotate:-8deg;animation:bob 4.4s ease-in-out infinite;}
  .vsCard{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:26px;padding:52px 32px 28px;
    box-shadow:0 14px 34px rgba(0,0,0,.10);transition:transform .25s;}
  .vsCard.v7{border:3px solid var(--purple);rotate:-.8deg;} .vsCard.v10{border:3px solid var(--green-dark);rotate:.8deg;}
  .vsCard:hover{transform:translateY(-8px);}
  .vsTab{position:absolute;left:24px;top:-22px;font-family:var(--disp);font-weight:900;font-size:22px;color:#fff;
    padding:8px 28px;border-radius:12px;rotate:-3deg;box-shadow:0 5px 0 rgba(0,0,0,.15);}
  .v7 .vsTab{background:linear-gradient(100deg,var(--purple),#9550e0);}
  .v10 .vsTab{background:linear-gradient(100deg,var(--green-dark),#79c22e);rotate:2deg;}
  .vsIcon{position:absolute;right:22px;top:-30px;width:62px;height:62px;background:#fff;border-radius:50%;
    display:flex;align-items:center;justify-content:center;box-shadow:0 5px 14px rgba(0,0,0,.16);animation:bob 5s ease-in-out infinite;}
  .vsIcon svg{width:38px;height:38px;}
  .vsTagline{font-family:var(--disp);font-weight:900;font-size:30px;}
  .v7 .vsTagline{color:var(--purple);} .v10 .vsTagline{color:var(--green-dark);}
  .vsNum{font-family:var(--disp);font-weight:700;margin-top:4px;font-size:24px;color:var(--text);}
  .vsNum b{font-size:50px;font-weight:900;line-height:1.15;}
  .v7 .vsNum b{color:var(--purple);} .v10 .vsNum b{color:var(--green-dark);}
  .vsMeta{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap;}
  .vsMeta span{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--purple-dark);background:var(--purple-pale);border-radius:999px;padding:5px 18px;}
  .v10 .vsMeta span{color:var(--green-dark);background:var(--green-pale);}
  .vsFine{font-size:13px;color:var(--gray);margin-top:16px;line-height:1.75;border-top:1px dashed #ddd;padding-top:12px;font-weight:400;}
  /* 方案卡條列式優勢 */
  .vsList{list-style:none;margin:16px 0 0;padding:12px 0 0;border-top:1px dashed #ddd;}
  .vsList li{position:relative;padding-left:1.5em;font-size:13.5px;color:#555;line-height:1.8;font-weight:500;margin-bottom:7px;}
  .vsList li::before{content:"✦";position:absolute;left:0;top:0;color:var(--purple);font-size:12px;}
  .v10 .vsList li::before{color:var(--green-dark);}
  /* 線上申請需備文件（流程三卡下方獨立橫幅，避免塞進單張卡造成三卡高度失衡） */
  .docsPanel{margin-top:34px;background:#fff;border:2px dashed #d9cef0;border-radius:22px;padding:26px 30px 24px;text-align:left;}
  .docsPanelTitle{font-family:var(--disp);font-weight:900;font-size:19px;color:var(--purple-dark);text-align:center;margin-bottom:20px;}
  .docsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
  .docsItem{display:flex;gap:11px;align-items:flex-start;}
  .docsNo{flex:0 0 26px;width:26px;height:26px;border-radius:50%;background:var(--purple);color:#fff;
    font-family:var(--disp);font-weight:900;font-size:14px;display:flex;align-items:center;justify-content:center;margin-top:2px;}
  .docsBody{font-size:13px;color:#666;line-height:1.75;font-weight:400;}
  .docsBody b{display:block;font-family:var(--disp);font-weight:700;font-size:15px;color:var(--text);margin-bottom:3px;}
  .docsNote{display:block;margin-top:6px;color:#8a8a94;font-size:12.5px;line-height:1.7;}
  /* 方案卡內申辦鈕（7年期／10年期各自導流） */
  .vsCtaWrap{margin-top:auto;padding-top:22px;}
  .vsCta{display:block;position:relative;overflow:hidden;text-align:center;
    font-family:var(--disp);font-weight:900;font-size:21px;letter-spacing:.06em;color:#fff;
    border-radius:999px;padding:14px 18px;border:3px solid #fff;transition:.15s;}
  .vsCta:hover{transform:translateY(3px);}
  .vsCta::after{content:"";position:absolute;top:0;left:-80%;width:45%;height:100%;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);animation:shine 3.4s ease-in-out 2s infinite;}
  .v7Cta{background:linear-gradient(180deg,#a678e0,var(--purple));
    box-shadow:0 7px 0 var(--purple-dark),0 16px 28px rgba(123,52,198,.32);}
  .v7Cta:hover{box-shadow:0 4px 0 var(--purple-dark);}
  .v10Cta{background:linear-gradient(180deg,#a8e06a,var(--green-dark));
    box-shadow:0 7px 0 #3f7a0c,0 16px 28px rgba(85,163,21,.32);}
  .v10Cta:hover{box-shadow:0 4px 0 #3f7a0c;}
  .plansSec .note{font-size:13px;color:#999;margin-top:26px;font-weight:400;}

  /* 流程 */
  .stepsSec{background:#f6f2fc;background-image:radial-gradient(#ebe1f8 2.4px,transparent 2.4px);
    background-size:30px 30px;padding:66px 0 72px;text-align:center;position:relative;overflow:hidden;}
  .stepsGrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px;margin-top:38px;}
  .stepCard{position:relative;background:#fff;border-radius:20px;padding:30px 22px 26px;box-shadow:0 10px 26px rgba(95,33,163,.12);}
  .stepCard::after{content:"";position:absolute;right:-30px;top:50%;transform:translateY(-50%);border:16px solid transparent;border-left-color:#fff;}
  .stepCard:last-child::after{display:none;}
  .stepIcon{width:54px;height:54px;margin:0 auto 8px;} .stepIcon svg{width:100%;height:100%;}
  .stepPill{display:inline-block;font-family:var(--disp);font-weight:900;background:var(--purple-pale);color:var(--purple);
    border-radius:999px;padding:2px 16px;font-size:14px;margin-bottom:6px;}
  .stepCard h3{font-family:var(--disp);font-weight:900;font-size:22px;color:var(--purple-dark);}
  .stepCard p{font-size:14.5px;color:var(--gray);margin-top:8px;line-height:1.7;font-weight:500;}
  .stepCard .hl{color:var(--green-dark);font-weight:900;}

  /* 好康 */
  .goodSec{background:linear-gradient(160deg,#67309f,#4a2078);color:#fff;padding:66px 0 70px;text-align:center;position:relative;overflow:hidden;}
  .goodSec .eyebrow{display:inline-block;font-family:var(--disp);font-weight:900;background:var(--yellow);color:#6b4a00;
    border-radius:999px;padding:6px 24px;font-size:18px;rotate:-2deg;box-shadow:0 4px 0 rgba(0,0,0,.15);}
  .goodSec h2{font-family:var(--disp);font-weight:900;font-size:42px;margin-top:18px;letter-spacing:.05em;}
  .goodSec .bigRate{font-family:var(--disp);font-weight:700;font-size:28px;margin-top:4px;color:#e6d9fb;}
  .goodSec .bigRate b{color:var(--yellow);font-size:54px;padding:0 4px;font-weight:900;}
  .goodTiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:880px;margin:32px auto 0;}
  .goodTile{border:2px solid rgba(255,255,255,.45);border-radius:18px;padding:20px 12px 18px;background:rgba(255,255,255,.07);transition:transform .2s;}
  .goodTile:hover{transform:translateY(-6px);}
  .goodTile .t{font-family:var(--disp);font-weight:700;font-size:17px;color:#e6d9fb;}
  .goodTile .v{font-family:var(--disp);font-weight:900;font-size:30px;color:var(--yellow);margin-top:4px;line-height:1.25;}
  .goodTile .v.s{font-size:22px;padding-top:5px;}
  .goodSec .ctaOpen{display:inline-block;margin-top:34px;position:relative;overflow:hidden;font-family:var(--disp);font-weight:900;
    font-size:23px;letter-spacing:.1em;color:#fff;background:linear-gradient(180deg,#ff9dbb,var(--pink));
    border-radius:999px;padding:14px 58px;border:4px solid #fff;box-shadow:0 7px 0 var(--pink-dark),0 16px 30px rgba(0,0,0,.3);transition:.15s;}
  .goodSec .ctaOpen:hover{transform:translateY(3px);box-shadow:0 4px 0 var(--pink-dark);}
  .goodSec .cap{font-size:12.5px;color:#bda6dd;margin-top:16px;font-weight:400;}
  .coin{position:absolute;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffe58a,var(--yellow));
    border:4px solid #e8b62a;color:#8a6a00;font-family:var(--disp);font-weight:900;font-size:30px;
    display:flex;align-items:center;justify-content:center;animation:bob 5s ease-in-out infinite;}

  /* 專案說明 */
  .legalSec{padding:14px 0 56px;background:#fff;}
  details.legal summary{list-style:none;cursor:pointer;position:relative;font-family:var(--disp);font-weight:900;
    background:linear-gradient(100deg,#8e5ad0,#a578dd);color:#fff;font-size:22px;letter-spacing:.08em;
    border-radius:14px;padding:16px 30px;box-shadow:0 6px 16px rgba(95,33,163,.22);transition:filter .2s;}
  details.legal summary:hover{filter:brightness(1.05);}
  details.legal summary::-webkit-details-marker{display:none;}
  details.legal summary::after{content:"＋";position:absolute;right:24px;top:50%;transform:translateY(-50%);font-size:26px;}
  details.legal[open] summary::after{content:"－";}
  details.legal .legalBody{background:#f7f6f9;border-radius:0 0 14px 14px;padding:28px 32px 22px;}
  .legalDraftNote{margin:0 0 14px;padding:8px 12px;border-radius:8px;background:#fff3cd;color:#8a6100;font-size:13px;font-weight:700;}
  details.legal ol{padding-left:1.6em;}
  .legalList{list-style:none;counter-reset:lg;padding-left:0;}
  .legalList>li{counter-increment:lg;position:relative;padding-left:2.8em;}
  .legalList>li::before{content:"(" counter(lg,cjk-ideographic) ")";position:absolute;left:0;font-weight:700;color:var(--purple-dark);}
  .legalSub{list-style:none;counter-reset:lgs;padding-left:0;margin-top:8px;}
  .legalSub>li{counter-increment:lgs;position:relative;padding-left:1.9em;margin-bottom:8px;}
  .legalSub>li::before{content:counter(lgs) ".";position:absolute;left:0;font-weight:700;}
  .legalTable{width:100%;border-collapse:collapse;margin:12px 0 4px;font-size:12.5px;}
  .legalTable th,.legalTable td{border:1px solid #dcd5e8;padding:7px 8px;text-align:center;line-height:1.5;}
  .legalTable th{background:#f3ecfc;font-weight:700;color:var(--purple-dark);}
  .legalBody a{color:var(--purple);text-decoration:underline;}
  details.legal li{font-size:13.5px;color:#555;margin-bottom:10px;text-align:justify;font-weight:400;}

  .floatCta{position:fixed;right:28px;bottom:34px;z-index:999;width:92px;height:92px;border-radius:50%;
    background:linear-gradient(160deg,#ff9dbb,var(--pink));color:#fff;font-family:var(--disp);font-weight:900;font-size:20px;line-height:1.3;
    display:flex;align-items:center;justify-content:center;text-align:center;
    box-shadow:0 10px 24px rgba(221,79,127,.5);border:4px solid #fff;transition:.15s;}
  .floatCta::before{content:"";position:absolute;inset:-4px;border-radius:50%;border:3px solid rgba(247,111,158,.55);animation:ring 2s ease-out infinite;}
  .floatCta:hover{transform:scale(1.08);}

  @media screen and (max-width:900px){
    .vsWrap{grid-template-columns:1fr;gap:44px;} .vsCard.v7,.vsCard.v10{rotate:0deg;}
    .vsBadge{display:none;}                 /* 單欄排版時會壓在下方卡片標題上 */
    /* 窄螢幕條款：改左對齊並收緊縮排，兩端對齊會讓字距拉開、右側擁擠不好讀 */
    details.legal li{text-align:left;}
    details.legal .legalBody{padding:20px 16px 16px;}
    .legalList>li{padding-left:2.1em;}
    .legalSub>li{padding-left:1.6em;}
    .legalTable{font-size:11.5px;}
    .legalTable th,.legalTable td{padding:5px 4px;}
    .mascotHero{bottom:0;margin-top:16px;}  /* 取消相對上移，避免壓到上方文字 */
    .goodSec .eDeco,.stepsSec .eDeco{display:none;}  /* 窄螢幕會蓋到存款區註記與需備文件文字 */
    .stepsGrid{grid-template-columns:1fr;gap:26px;}
    .docsGrid{grid-template-columns:1fr;gap:16px;}
    .docsPanel{padding:22px 20px 20px;}
    .stepCard::after{right:50%;top:auto;bottom:-30px;transform:translateX(50%) rotate(90deg);}
    .goodTiles{grid-template-columns:1fr;} .ecgTitle{font-size:30px;} .ecgTitle svg{width:70px;}
    .pch{font-size:60px;} .pch.acc{font-size:66px;} .pch::after{-webkit-text-stroke:15px #fff;} .pch::before{-webkit-text-stroke:8px var(--purple);}
    .cornerTag{left:-20px;top:-40px;font-size:16px;} .burst{right:-30px;top:-52px;width:70px;height:70px;font-size:19px;}
    .goldLabel{font-size:17px;margin-bottom:12px;} .goldNum{font-size:62px;} .goldQi{font-size:32px;margin-bottom:6px;}
    .goldNum::after,.goldQi::after{-webkit-text-stroke:12px #fff;} .goldNum::before,.goldQi::before{-webkit-text-stroke:6px var(--purple-dark);}
    .dashBadge{font-size:18px;padding:9px 18px;} .dashBadge::before,.dashBadge::after{display:none;}
    .prodCard{padding:36px 22px;} .prodCard h2{font-size:30px;} .crumb{display:none;}
  }

  /* 手機（≤480px）：KV 與大字級等比縮小，避免主標／利率數字超出畫面 */
  @media screen and (max-width:480px){
    .wrap{padding:0 16px;}
    .hero{padding:52px 14px 100px;}
    .pch{font-size:40px;} .pch.acc{font-size:44px;}
    .pch::after{-webkit-text-stroke:10px #fff;} .pch::before{-webkit-text-stroke:5px var(--purple);}
    .cornerTag{left:-2px;top:-34px;font-size:12px;padding:5px 12px;}
    .burst{right:-2px;top:-42px;width:46px;height:46px;font-size:13px;}
    .hero .bill,.hero .mcap{transform:scale(.66);}
    .hero .mcross{font-size:18px;}
    .hero .spark{font-size:15px !important;}
    .mascotHero{width:150px;}
    /* 窄螢幕裝飾與文字會靠得很近，把文案層墊高確保可讀 */
    .heroStage,.heroSlogan,.goldLine,.dashBadge{position:relative;z-index:3;}
    .hero .bill,.hero .mcap,.hero .mcross,.hero .spark{opacity:.8;}
    .heroSlogan{margin-top:20px;font-size:17px;}
    .heroCtaWrap{margin-top:18px;}
    .heroCta{font-size:19px;padding:12px 34px;} .heroSlogan .sl{font-size:18px;margin:0 6px;}
    .goldLine{margin-top:18px;gap:10px;}
    .goldLabel{font-size:14px;padding:7px 14px;margin-bottom:14px;}
    .goldNum{font-size:44px;} .goldQi{font-size:24px;margin-bottom:4px;}
    .goldNum::after,.goldQi::after{-webkit-text-stroke:8px #fff;}
    .goldNum::before,.goldQi::before{-webkit-text-stroke:4px var(--purple-dark);}
    .dashBadge{margin-top:20px;font-size:15px;padding:9px 16px;}
    .ecgTitle{font-size:22px;} .ecgTitle svg{width:44px;}
    .prodCard{padding:26px 16px;} .prodCard h2{font-size:22px;}
    .floatCta{right:14px;bottom:20px;width:72px;height:72px;font-size:16px;}
    .vsCta{font-size:18px;padding:13px 14px;}
  }

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none !important;transition:none !important;}
    .rv,.pch,.heroSlogan,.goldLine,.dashBadge{opacity:1;transform:none;}
    .hero .ecgBg .run{display:none;}
  }