/* menu */

/* ------- 基本排版 ------- */
:root{
  --sd-bg:#0c0c0c; --sd-fg:#f5f5f5; --sd-dim:#9a9a9a;
  --sd-accent:#d5ff5b;
  --sd-gap: min(6vw, 64px);
}
html,body{height:100%;}
body.sd-lock{overflow:hidden;}
.sd-header{
	position:fixed; 
	inset:0 auto auto 0; 
	width:100%;
	display:flex; 
	align-items:center; 
	justify-content:space-between;
	padding:20px var(--sd-gap); 
	z-index:50; mix-blend-mode:normal;
}

.sd-logo{
	color:#ffffff;
	text-decoration:none;
	font-weight:700;
	letter-spacing:.5px
}

.sd-logo span{
	color:#ffffff
}

.sd-menu-toggle{
	display:flex; 
	align-items:center; 
	gap:12px; 
	background:transparent; 
	border:0; 
	cursor:pointer;
	color:#ffffff; 
	font-weight:600; 
	letter-spacing:.04em;
}
.sd-burger{
	position:relative; 
	width:24px; 
	height:14px; 
	display:inline-block
}

.sd-burger i{
  position:absolute; 
	left:0; right:0; 
	height:2px; 
	background:#ffffff; 
	border-radius:2px;
	transition:transform .35s ease, top .35s ease, opacity .2s;
}

.sd-burger i:first-child{top:0}
.sd-burger i:last-child{top:12px}

/* ------- 全螢幕選單 ------- */
/* #sd-menu{
  position: fixed;
	inset: 0;
  opacity: 0; pointer-events: none;
  background: var(--sd-bg, #0c0c0c);
  transition: none !important;
} */

#sd-menu.is-open{ opacity:1; pointer-events:auto; }

/* 讓選單在 header 之上，但只佔自身高度 */
#sd-menu{
  position: fixed; left:0; right:0; top:0;
  z-index: 11000;
  height: 0; overflow: hidden;
  background:#0c0c0c; color:#f5f5f5;
  transform: translateY(-100%);
  opacity: 0; pointer-events: none;
  transition: none !important;
}


/* body 鎖捲動 & 漢堡成 X（可依你原本樣式） */
body.sd-lock{ overflow:hidden; }
body.sd-lock .sd-burger i:first-child{ top:6px; transform:rotate(45deg); }
body.sd-lock .sd-burger i:last-child{  top:6px; transform:rotate(-45deg); }

/* 避免被其他樣式干擾 */
#smooth-wrapper{ will-change: transform; }



/* 內容區安全區，避免瀏海擋到 */
#sd-menu .sd-menu__inner{
	padding: calc(100px + env(safe-area-inset-top));

}


.sd-menu__list li {
    overflow: hidden;
}

.sd-menu__list{
	list-style:none; 
	margin:0; padding:0; 
	display:flex; 
	flex-direction:column; 
	gap:16px
}


.sd-menu__list .sd-link{
	display:inline-block; 
	text-decoration:none; 
	color:var(--sd-fg);
	font-size:clamp(28px, 6vw, 80px); 
	line-height:1.05; 
	font-weight:700;
	position:relative; 
	will-change:transform, opacity;
}

.sd-menu__list .sd-link::after{
	content:""; 
	position:absolute; 
	left:0; 
	bottom:-6px; 
	height:2px; 
	width:0; 
	background:var(--sd-accent);
	transition:width .35s ease;
}

.sd-menu__list .sd-link:hover::after{
	width:100%;
}

.sd-menu__meta{
	color:var(--sd-dim); 
	font-size:clamp(12px, 1.4vw, 16px)
}

.sd-menu-close {
    background: transparent;
    border: 1px solid #333;
    color: #bbb;
    padding: 10px 14px;
    border-radius: 999px;
    cursor: pointer;
    position: absolute;
    right: 57px;
    top: 13px;
/* 	  z-index: 10001;  */
  pointer-events: auto;   
}

/* 讓整顆按鈕含文字都能被點到，壓過可能的覆蓋層 */
.sd-menu-toggle{
  position: relative;
  z-index: 10002;
  pointer-events: auto;
}

.sd-menu-toggle * { pointer-events: none; }

.sd-header{ z-index: 999999; }
body.sd-lock .sd-header{ pointer-events:none; }
#smooth-wrapper{ will-change: transform; }

/* 建議用 body.sd-lock 控制漢堡動畫，避免兄弟順序問題 */
body.sd-lock .sd-burger i:first-child{ top:6px; transform:rotate(45deg) }
body.sd-lock .sd-burger i:last-child{  top:6px; transform:rotate(-45deg) }
body.sd-lock .sd-menu-text{ opacity:.6 }
/* 讓被推動的元素位移更順滑 */
.sd-header,
body > div[data-elementor-post-type="page"] { will-change: transform; }




.footer-title-1 h1,
.footer-title-1 h2,
.footer-title-1 h3,
.footer-title-1 h4,
.footer-title-1 h5,
.footer-title-1 h6,
.footer-title-1 span,
.footer-title-1 p {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5em !important;
    font-family: var(--font-stack-text);
}


.footer-title-2 h1,
.footer-title-2 h2,
.footer-title-2 h3,
.footer-title-2 h4,
.footer-title-2 h5,
.footer-title-2 h6,
.footer-title-2 span,
.footer-title-2 p {
    font-size: 0.9rem;
    font-weight: 300;
    line-height: 1.5rem !important;
    font-family: var(--font-stack-text);
}

.header-logo, .header-logo .elementor-widget-container {
    display: flex;
    align-items: center;
}


.menu .elementor-widget-container {
    display: flex;
    align-items: center;
}

/*button*/

.button {
    line-height: 1;
    text-decoration: none;
    display: inline-flex;
    border: none;
    cursor: pointer;
    align-items: center;
	gap: 10px;
    color: #1F1F1F;
    font-weight: 600;
    padding: 5px 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background-color 0.3s;
    background: #ffffff00;
}

.button__icon-wrapper {
    flex-shrink: 0;
    position: relative;
    color: #1F1F1F;
    display: grid;
    place-items: center;
    overflow: hidden;
    height: 20px;
    width: 20px;
}

.button__icon-svg--copy {
  position: absolute;
  transform: translate(-150%, 150%);
}

.button:hover .button__icon-svg:first-child {
  transition: transform 0.3s ease-in-out;
  transform: translate(150%, -150%);
}

.button:hover .button__icon-svg--copy {
  transition: transform 0.3s ease-in-out 0.1s;
  transform: translate(0);
}

.button svg.button__icon-svg {
    stroke: #000;
    width: 100%;
    height: 100%;
}



.button__icon-wrapper-border-w {
    position: relative;
    width: 30px;
    height: 30px;
    background-color: white;
    border-radius: 50%;
    overflow: hidden;
    stroke: #000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button-border-w {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid white;
    background-color: transparent;
    color: white;
    padding: 10px 14px 10px 25px;
    border-radius: 9999px;
    cursor: pointer;
    position: relative;
    transition: all 0.3s ease;
    font-size: 16px;
    gap: 100px;
}

.button-border-w svg.button__icon-svg {
    stroke: #000;
    width: 100%;
    height: 100%;
}

.button__icon-svg--copy-border-w {
  position: absolute;
  transform: translate(-150%);
}

.button-border-w:hover .button__icon-svg-border-w:first-child {
  transition: transform 0.3s ease-in-out;
  transform: translate(150%);
}

.button-border-w:hover .button__icon-svg--copy-border-w {
  transition: transform 0.3s ease-in-out 0.1s;
  transform: translate(0);
}

.button-border-w:hover .button__icon-svg--copy-border-w {
    stroke: #FFF;
}

.button-border-w:hover .button__icon-wrapper-border-w{
    background-color: var(--e-global-color-f8bd203);
}

.button-border-w:hover span{
    color: var(--e-global-color-f8bd203);
}

.button-border-w:hover{
    border-color: var(--e-global-color-f8bd203);
}

