/* =========================================================
   01. Font / Variables / Base
   ========================================================= */

@font-face { font-display: swap; }

:root{
      --ink:#05070d;
      --ink-2:#0a1020;
      --navy:#0d1b32;
      --blue:#80d8ff;
      --gold:#d7bb72;
      --gold-2:#f2d98f;
      --cream:#f5f1e8;
      --paper:#fbfaf7;
			--gpaper:#e9d8a4;
      --line:rgba(255,255,255,.14);
      --dark-line:rgba(5,7,13,.1);
      --r-lg:36px;
      --r-md:24px;
      --r-sm:16px;
    }
    * {
  box-sizing:border-box
		}
		html {
			scroll-behavior:smooth;
			background:var(--ink)
		}
		body {
			margin:0;
			font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
			background:var(--paper);
			color:#111827;
			line-height:1.7;
			overflow-x:hidden
		}
		body::before {
			content:"";
			position:fixed;
			inset:0;
			z-index:999;
			pointer-events:none;
			opacity:.14;
			background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")
		}
		a {
			text-decoration:none;
			color:inherit
		}
		img {
			max-width:100%;
			display:block
		}

/* =========================================================
   02. Shared Layout / Utilities
   ========================================================= */

		.hs-wrap {
			margin-inline:auto
		}
		.hs-narrow {
			max-width:880px;
			margin-inline:auto
		}
		.hs-eyebrow {
			display:inline-flex;
			align-items:center;
			gap:10px;
			font-size:16px;
			letter-spacing:.18em;
			text-transform:uppercase;
			color:var(--gold);
			font-weight:800
		}
		.hs-eyebrow::before {
			content:"";
			width:34px;
			height:1px;
			background:linear-gradient(90deg,var(--gold),transparent)
		}
		.hs-num {
			font-size:11px;
			color:rgba(255,255,255,.38);
			letter-spacing:.18em;
			font-weight:800
		}
		.hs-section {
			position:relative;
			padding:45px 0
		}
		.hs-section-light {
			background:var(--paper)
		}
		.hs-section-brown {
			background:var(--gpaper)
		}
		.hs-section-cream {
			background:var(--cream)
		}
		.hs-section-dark {
			background:var(--ink);
			color:white;
			overflow:hidden
		}
		.hs-v-lines {
			position:absolute;
			inset:0;
			pointer-events:none;
			z-index:0;
			background:linear-gradient(90deg,transparent calc(25% - 1px),rgba(255,255,255,.06) calc(25% - 1px),rgba(255,255,255,.06) 25%,transparent 25%),linear-gradient(90deg,transparent calc(50% - 1px),rgba(255,255,255,.05) calc(50% - 1px),rgba(255,255,255,.05) 50%,transparent 50%),linear-gradient(90deg,transparent calc(75% - 1px),rgba(255,255,255,.06) calc(75% - 1px),rgba(255,255,255,.06) 75%,transparent 75%)
		}
		.hs-section-light .hs-v-lines,.hs-section-cream .hs-v-lines {
			background:linear-gradient(90deg,transparent calc(25% - 1px),rgba(5,7,13,.045) calc(25% - 1px),rgba(5,7,13,.045) 25%,transparent 25%),linear-gradient(90deg,transparent calc(50% - 1px),rgba(5,7,13,.035) calc(50% - 1px),rgba(5,7,13,.035) 50%,transparent 50%),linear-gradient(90deg,transparent calc(75% - 1px),rgba(5,7,13,.045) calc(75% - 1px),rgba(5,7,13,.045) 75%,transparent 75%)
		}
		.hs-content {
			position:relative;
			z-index:1
		}

/* =========================================================
   03. Buttons / Cards / Glass Effects
   ========================================================= */

		.hs-btn {
			display:inline-flex;
			align-items:center;
			justify-content:center;
			gap:10px;
			border-radius:999px;
			padding:14px 24px;
			font-size:14px;
			font-weight:800;
			transition:.3s ease;
			white-space:nowrap;
			border:1px solid transparent;
			cursor:pointer
		}
		.hs-btn-gold {
			background:linear-gradient(135deg,var(--gold-2),var(--gold));
			color:#090909;
			box-shadow:0 18px 60px rgba(215,187,114,.25)
		}
		.hs-btn-gold:hover {
			transform:translateY(-2px);
			box-shadow:0 24px 80px rgba(215,187,114,.34)
		}
		.hs-btn-glass {
			background:rgba(255,255,255,.08);
			border-color:rgba(255,255,255,.22);
			color:white;
			backdrop-filter:blur(18px)
		}
		.hs-btn-glass:hover {
			background:rgba(255,255,255,.15);
			transform:translateY(-2px)
		}
		.hs-glass {
			background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
			border:1px solid rgba(255,255,255,.16);
			box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 30px 100px rgba(0,0,0,.28);
			backdrop-filter:blur(22px)
		}
		.hs-card-light {
			background:rgba(255,255,255,.72);
			border:1px solid rgba(5,7,13,.08);
			box-shadow:0 22px 70px rgba(5,7,13,.06);
			backdrop-filter:blur(20px)
		}

/* =========================================================
   04. Main Visual / Hero Area
   ========================================================= */

		.hs-hero {
			min-height:100svh;
			position:relative;
			background:#03050b;
			color:#ffffff;
			overflow:hidden;
			display:flex;
			align-items:center;
			padding:48px 0 72px;
		}
		.hs-hero-bg {
			position:absolute;
			inset:0;
			z-index:0
		}
		.hs-hero-bg::before {
			content:"";
			position:absolute;
			inset:0;
			background:linear-gradient(90deg,rgba(3,5,11,.98) 0%,rgba(3,5,11,.82) 38%,rgba(3,5,11,.34) 70%,rgba(3,5,11,.58) 100%),linear-gradient(180deg,rgba(3,5,11,.2),#03050b 96%);
			z-index:2
		}
		.hs-hero-bg img {
			width:100%;
			height:100%;
			object-fit:cover;
			opacity:.72;
			filter:saturate(.96) contrast(1.04)
		}
		.hs-orb {
			position:absolute;
			border-radius:999px;
			filter:blur(52px);
			opacity:.58;
			mix-blend-mode:screen;
			pointer-events:none
		}
		.hs-orb-blue {
			width:420px;
			height:420px;
			background:#47cfff;
			right:6%;
			top:18%
		}
		.hs-orb-gold {
			width:300px;
			height:300px;
			background:#d7bb72;
			left:8%;
			bottom:8%;
			opacity:.36
		}
		.hs-hero-grid {
			position:relative;
			z-index:2
		}
		.hs-hero h1 {
			font-size:clamp(42px,7vw,88px);
			line-height:.98;
			letter-spacing:-.07em;
			font-weight:950;
			margin:22px 0 22px;
			max-width:870px
		}
		.hs-hero-highlight {
			display:block;
			background:linear-gradient(135deg,#fff 0%,#eef7ff 42%,#d7bb72 100%);
			-webkit-background-clip:text;
			background-clip:text;
			color:transparent
		}
		.hs-hero-sub {
			font-size:clamp(17px,2.2vw,23px);
			color:rgba(255,255,255,.72);
			max-width:690px;
			line-height:1.7;
			margin:0 0 26px
		}
		.hs-hero-fit {
			display:flex;
			flex-wrap:wrap;
			gap:10px;
			margin:24px 0 34px
		}
		.hs-pill {
			display:inline-flex;
			align-items:center;
			gap:8px;
			border:1px solid rgba(255,255,255,.14);
			background:rgba(255,255,255,.07);
			border-radius:999px;
			color:rgba(255,255,255,.76);
			padding:9px 13px;
			font-size:clamp(16px,2.2vw,21px);
			backdrop-filter:blur(16px)
		}
		.hs-hero-actions {
			display:flex;
			gap:12px;
			flex-wrap:wrap;
			align-items:center
		}
		.hs-hero-visual {
			position:relative;
			min-height:580px
		}
		.hs-portfolio-stack {
			position:absolute;
			inset:auto 0 0 auto;
			width:min(500px,100%);
			height:540px;
			perspective:1200px
		}
		.hs-folio {
			position:absolute;
			border-radius:28px;
			overflow:hidden;
			background:rgba(255,255,255,.08);
			border:1px solid rgba(255,255,255,.2);
			box-shadow:0 30px 100px rgba(0,0,0,.4);
			backdrop-filter:blur(20px)
		}
		.hs-folio img {
			width:100%;
			height:100%;
			object-fit:cover
		}
		.hs-hero-visual{
			position:relative;
			min-height:620px;
		}

		.hs-portfolio-stack{
			position:absolute;
			right:0;
			top:160px;
			width:520px;
			height:520px;
		}

		.MainHdPic01{
			width:420px;
			height:420px;
			transform:scale(1.1);
			margin-top:-55px;
			right:-100px;
		}
		
		.hs-float-ui {
			position:absolute;
			z-index:7;
			border-radius:18px;
			padding:14px 16px;
			background:rgb(255 213 107 / 50%);
			border:1px solid rgba(255,255,255,.17);
			backdrop-filter:blur(24px);
			box-shadow:0 20px 70px rgba(0,0,0,.3);
			color:white
		}
		.hs-float-ui strong {
			display:block;
			font-size:13px;
			color:#fff;
			margin-bottom:2px
		}
		.hs-float-ui span {
			font-size:11px;
			color:rgba(255,255,255,.55)
		}
		.hs-float-1 {
			right:0;
			top:24px
		}
		.hs-float-2 {
			left:0;
			top:280px
		}
		.hs-float-3 {
			right:32px;
			bottom:0
		}
		.hs-stats {
			background:rgba(255,255,255,.1);
			border:1px solid rgba(255,255,255,.12);
			border-radius:25px;
			overflow:hidden;
			margin-top:35px
		}
		.hs-stat {
			padding:22px 20px;
			background:rgba(255,255,255,.06);
			backdrop-filter:blur(18px)
		}
		.hs-stat b {
			display:block;
			font-size:clamp(24px,3vw,38px);
			line-height:1;
			color:white;
			letter-spacing:-.04em
		}
		.hs-stat-label {
			display:block;
			font-size:clamp(18px,2.2vw,12px);
			color:rgba(255,255,255,.52);
			margin-top:8px
		}
		
		.hs-kicker-title {
			font-size:clamp(32px,4.5vw,56px);
			line-height:1.15;
			letter-spacing:-.06em;
			font-weight:950;
			margin:18px 0
		}
		.hs-lead {
			font-size:18px;
			color:#4b5563;
			max-width:1024px
		}
		
		.hs-track-card {
			position:relative;
			padding:30px;
			border-radius:var(--r-lg);
			min-height:390px;
			overflow:hidden
		}
		.hs-track-card::after {
			content:"";
			position:absolute;
			inset:0;
			border-radius:inherit;
			pointer-events:none;
			background:linear-gradient(135deg,rgba(255,255,255,.35),transparent 34%,rgba(255,255,255,.16) 70%,transparent)
		}
		.hs-track-card h3 {
			font-size:30px;
			letter-spacing:-.04em;
			margin:12px 0 12px
		}
		.hs-track-card p {
			color:#5b6575;
			margin-bottom:24px;
			font-size:clamp(16px,2.2vw,18px);
		}
		.hs-track-card ul {
			list-style:none;
			padding:0;
			margin:0;
			display:grid;
			gap:5px
		}
		.hs-track-card li {
			display:flex;
			gap:10px;
			align-items:flex-start;
			color:#1f2937;
			font-size:clamp(16px,2.2vw,18px);
		}
		.hs-track-card li iconify-icon {
			margin-top:4px;
			flex:0 0 auto
		}
		.hs-tw-card {
			background:linear-gradient(160deg,#eefaff,#dcefff)
		}
		.hs-abroad-card {
			background:linear-gradient(160deg,#fff7de,#f4e3aa)
		}
		
		.hs-why-photo {
			border-radius:44px;
			overflow:hidden;
			position:relative;
			box-shadow:0 34px 120px rgba(5,7,13,.18);
			height: clamp(300px, 78vw, 620px);
		}
		.hs-why-photo img {
			width:100%;
			height:120%;
			object-fit:cover
		}
		.hs-why-photo::after {
			content:"";
			position:absolute;
			inset:0;
			background:linear-gradient(180deg,transparent 44%,rgba(5,7,13,.22))
		}
		.hs-why-badge {
			position:absolute;
			left:24px;
			right:24px;
			bottom:24px;
			color:white;
			border-radius:28px;
			padding:22px
		}
		.hs-why-badge strong {
			font-size:38px;
			line-height:1
		}
		.hs-why-badge span {
			display:block;
			color:rgba(255,255,255,1.00);
			font-size:13px;
			margin-top:5px;
			letter-spacing: 1px;
		}
		.hs-why-list {
			display:grid;
			gap:14px
		}
		.hs-why-item {
			display: grid;
			grid-template-columns: 25px 1fr;
			gap: 16px;
			align-items: start;
			border-radius: 20px;
			padding: 18px;
		}
		.hs-why-item iconify-icon {
			font-size:28px;
			color:var(--gold)
		}
		.hs-why-item h3 {
			font-size:20px;
			font-weight:900;
			letter-spacing:-.035em;
			margin:0 0 6px
		}
		.hs-why-item p {
			margin:0;
			color:#566071;
			font-size:clamp(16px,2vw,18px);
		}

/* =========================================================
   07. Parallax / Philosophy / Field Cards
   ========================================================= */

		.hs-parallax-band {
			min-height:54svh;
			display:flex;
			align-items:center;
			position:relative;
			overflow:hidden;
			color:white;
			background:#03050b
		}
		.hs-parallax-img {
			position:absolute;
			inset:-14% 0;
			width:100%;
			height:128%;
			object-fit:cover;
			opacity:.56
		}
		.hs-parallax-band::after {
			content:"";
			position:absolute;
			inset:0;
			background:linear-gradient(90deg,rgba(3,5,11,.92),rgba(3,5,11,.52) 50%,rgba(3,5,11,.9)),linear-gradient(180deg,#03050b,transparent 18%,transparent 78%,#03050b)
		}
		.hs-parallax-copy {
			position:relative;
			z-index:2;
			max-width:760px
		}
		.hs-parallax-copy h2 {
			font-size:clamp(28px, 5vw, 58px);
			line-height:1.15;
			letter-spacing:-.07em;
			font-weight:950;
			margin:18px 0
		}
		.hs-parallax-copy p {
			font-size:20px;
			color:rgba(255,255,255,.7);
			max-width:880px
		}
		.hs-value {
			border-radius:20px;
			padding:15px;
			background:white;
			border:1px solid rgba(5,7,13,.08)
		}
		.hs-value .hs-tag {
			font-size:12px;
			color:var(--gold);
			font-weight:900;
			letter-spacing:.12em
		}
		.hs-value h3 {
			font-size:22px;
			line-height:1.2;
			margin:10px 0 6px
		}
		.hs-value p {
			color:#5c6471;
			font-size:clamp(16px,2.2vw,21px);
			margin-bottom: 0;
		}
		
		.hs-field {
			position:relative;
			border-radius:20px;
			overflow:hidden;
			/*min-height:320px;*/
			padding:22px;
			display:flex;
			flex-direction:column;
			justify-content:flex-end;
			background:#000;
		}
		.hs-field img {
			position:absolute;
			inset:0;
			width:100%;
			height:100%;
			object-fit:cover;
			opacity:.52;
			transition:.7s ease
		}
		.hs-field:hover img {
			transform:scale(1.08);
			opacity:.9
		}
		.hs-field::after {
			content:"";
			position:absolute;
			inset:0;

			background:
				-webkit-linear-gradient(
					180deg,
					rgba(0,0,0,.75) 0%,
					rgba(0,0,0,.78) 35%,
					rgba(0,0,0,.88) 68%,
					rgba(0,0,0,.98) 100%
				);
		}
		.hs-field > * {
			position:relative;
			z-index:1
		}
		.hs-field-num {
			font-size:12px;
			color:var(--gold);
			font-weight:900;
			letter-spacing:.14em
		}
		.hs-field h3 {
			font-size:clamp(26px, 4vw, 30px);
			line-height:1.05;
			margin:8px 0;
			color:white;
			font-weight:800;
			text-shadow:0 2px 12px rgba(0,0,0,.45);
		}

		.hs-field p {
			font-size:clamp(18px,1.8vw,21px);
			line-height:1.5;
			color:rgba(255,255,255,.84);
			margin:0;
			text-shadow:0 2px 12px rgba(0,0,0,.65);
		}

/* =========================================================
   08. Network / Timeline / Results
   ========================================================= */
		.hs-map-grid {
			position:absolute;
			inset:0;
			opacity:.45;
			background-image:radial-gradient(circle at 20% 30%,rgba(128,216,255,.9) 0 2px,transparent 3px),radial-gradient(circle at 65% 24%,rgba(215,187,114,.95) 0 2px,transparent 3px),radial-gradient(circle at 72% 58%,rgba(128,216,255,.9) 0 2px,transparent 3px),radial-gradient(circle at 38% 62%,rgba(255,255,255,.75) 0 2px,transparent 3px),radial-gradient(circle at 52% 44%,rgba(215,187,114,.8) 0 2px,transparent 3px);
			background-size:100% 100%
		}
		.hs-logos {
			margin-top:34px
		}
		.hs-logo-chip {
			border-radius:999px;
			padding:12px 17px;
			background:rgba(255,255,255,.08);
			border:1px solid rgba(255,255,255,.13);
			color:rgba(255,255,255,.78);
			font-weight:800;
			font-size:13px;
			backdrop-filter:blur(18px)
		}
		.hs-results{
			margin-top:44px;
		}

		.hs-result-card{

			height:100%;

			padding:26px;

			border-radius:30px;

			display:flex;
			flex-direction:column;
			justify-content:space-between;

			min-height:180px;
		}
		.hs-result-card-auto{
			height:100%;
			padding:12px;
			border-radius:20px;

			display:flex;
			flex-direction:column;
			justify-content:space-between;
		}

		.hs-result-school{
	
			font-size:clamp(21px,3vw,28px);

			line-height:1;
			font-weight:800;

			letter-spacing:-.05em;
		}

		.hs-result-award{

			margin-top:10px;

			font-size:clamp(14px,1.8vw,18px);
			font-weight:900;

			color:var(--gold);
		}

		.hs-result-name{

			margin-top:24px;
			padding-top:18px;

			border-top:1px solid rgba(255,255,255,.12);

			font-size:13px;
			color:rgba(255,255,255,.58);
		}
		.hs-case-grid {
			margin-top:20px;
		}

		.hs-case {
			height:100%;
			border-radius:30px;
			overflow:hidden;
			background:#fff;
			border:1px solid rgba(5,7,13,.08);
			box-shadow:0 10px 40px rgba(0,0,0,.04);
		}

		.hs-case img {
			width:100%;
			height:clamp(180px,38vw,300px);
			object-fit:cover;
			display:block;
		}

		.hs-case-body {
			padding:22px;
		}

		.hs-case h3 {
			font-size:20px;
			margin:0 0 8px;
		}

		.hs-case p {
			margin:0;
			color:#5c6471;
			font-size:14px;
			line-height:1.8;
		}

/* =========================================================
   09. CTA / Sticky Bar / Reveal
   ========================================================= */

		.hs-cta {
			position:relative;
			overflow:hidden;
			background:#03050b;
			color:white;
			text-align:center;
			padding:120px 0
		}
		.hs-cta::before {
			content:"";
			position:absolute;
			inset:0;
			background:radial-gradient(circle at 50% 0%,rgba(128,216,255,.25),transparent 38%),radial-gradient(circle at 48% 65%,rgba(215,187,114,.18),transparent 44%)
		}
		.hs-cta h2 {
			font-size:clamp(38px,5vw,72px);
			line-height:1.05;
			letter-spacing:-.07em;
			font-weight:950;
			margin:16px 0
		}
		.hs-cta p {
			font-size:18px;
			color:rgba(255,255,255,.86);
			max-width:980px;
			margin:0 auto 0px
		}
		.hs-reveal {
			opacity:0;
			transform:translateY(36px)
		}
		
		
  	
		.hs-parallax-img-inner{ transform:none !important;}
		

		

/* =========================================================
   10. Bootstrap 5 Integration Adjustments
   ========================================================= */
.hs-track-card,
.hs-value,
.hs-field,
.hs-result-card,
.hs-result-card-auto,
.hs-case,
.hs-why-photo {
  box-sizing: border-box;
}

.hs-case,
.hs-value {
  height: 100%;
}

/* =========================================================
   12. Form Verify Code
   ========================================================= */
.verify-box {
    margin-bottom: 6px;
  }
  .verify-code {
    display: inline-block;
    width: 90px;
    padding: 6px 8px;
    border: 1px solid #ccc;
    background: #fff;
    font-size: 20px;
    letter-spacing: 3px;
    text-align: center;
    font-weight: bold;
    border-radius: 4px;
    user-select: none;
  }
  .verify-refresh {
    margin-left: 8px;
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #666;
  }
  .verify-refresh:hover {
    color: #333;
  }


/* =========================================================
   13. Student Work Video / Owl Carousel
   ========================================================= */

.StWorkVedi{
  width:100%;
  height:clamp(180px, 28vw, 365px);
  border-radius:15px;
  overflow:hidden;
  object-fit:cover;
  display:block;
}
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-prev {border-radius:300px; padding:9px 15px; background-color: #32384e;margin: 5px 20% 5px 10%; }
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-next {border-radius:300px; padding:9px 15px;background-color: #32384e;margin: 5px 10% 5px 20%; }
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-prev:hover {background-color: #d57049;}
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-next:hover {background-color: #d57049;}
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-prev.disabled { opacity:0.2; }
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-nav div.owl-next.disabled { opacity:0.2; }
.owl-carousel.owl-theme.St_Videos.owl-loaded > div.owl-controls > div.owl-dots {margin-top: -35px;}

/* =========================================================
   14. HS Student Results Slider
   ========================================================= */
.hs-result-link{
	display:block;
	text-decoration:none;
	color:inherit;
	height:100%;
}
#Sd_slides .item{
  height:100%;
  padding:4px;
}

#Sd_slides .hs-result-card{

  height:clamp(200px, 24vw, 230px);
  padding:20px;
  border-radius:18px;

  display:flex;
  flex-direction:column;
  justify-content:space-between;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.10),
      rgba(255,255,255,.04)
    );

  border:1px solid rgba(255,255,255,.14);

  backdrop-filter:blur(22px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 20px 80px rgba(0,0,0,.28);

  overflow:hidden;
}

#Sd_slides .hs-result-school{

  font-size:clamp(24px, 2.2vw, 38px);

  line-height:.95;
  font-weight:700;

  letter-spacing:1px;

  color:#fff;
}

#Sd_slides .hs-result-award{

  margin-top:14px;

  font-size:clamp(18px, 1.3vw, 24px);

  font-weight:800;

  color:#d7bb72;

  line-height:1.3;
}

#Sd_slides .hs-result-name{

  padding-top:18px;
  margin-top:24px;

  border-top:1px solid rgba(255,255,255,.12);

  font-size:clamp(16px,2.4vw,16px);
  line-height:1.2;

  color:rgba(255,255,255,.68);
}


/* Owl Nav */

#Sd_slides .owl-nav{
  margin-top:24px;
  text-align:center;
}

#Sd_slides .owl-prev,
#Sd_slides .owl-next{

  width:46px;
  height:46px;

  border-radius:999px !important;

  background:rgba(255,255,255,.08) !important;

  border:1px solid rgba(255,255,255,.14) !important;

  color:#fff !important;

  transition:.3s ease;
}

#Sd_slides .owl-prev:hover,
#Sd_slides .owl-next:hover{

  background:#d7bb72 !important;

  color:#05070d !important;
}


/* Mobile */


/* =========================================================
   15. FAQ Section
   ========================================================= */

.sec-faq-dark {
  position:relative;
  overflow:hidden;
  background:#05070d;
  color:#fff;
}

.sec-faq-dark::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(5,7,13,.78), rgba(5,7,13,.94)),
    url("images/client/course/3d/faq-bg.jpg") center / cover no-repeat;
  opacity:1;
}

.faq-section {
  position:relative;
  z-index:1;
  padding:clamp(70px, 8vw, 120px) 0;
}

.faq-title {
  font-size:clamp(34px, 4vw, 52px);
  font-weight:900;
  line-height:1.1;
  letter-spacing:.04em;
  color:#d7bb72;
}


.faq-accordion {
  max-width:clamp(920px, 76vw, 1320px);
  margin:32px auto 0;
  border:1px solid rgba(215,187,114,.45);
  border-radius:6px;
  overflow:hidden;
  background:rgba(20,20,20,.92);
}

.faq-accordion .accordion-item {
  border:0;
  border-bottom:1px solid rgba(215,187,114,.55);
  background:transparent;
  color:#fff;
}

.faq-accordion .accordion-item:last-child {
  border-bottom:0;
}

.faq-accordion .accordion-header {
  margin:0;
}

.faq-accordion .accordion-button {
  padding:clamp(18px, 1.6vw, 24px) clamp(20px, 2vw, 32px);
  background:rgba(28,28,28,.96);
  color:#d7bb72;
  font-size:clamp(17px, 1.25vw, 22px);
  font-weight:800;
  line-height:1.5;
  letter-spacing:.04em;
  box-shadow:none;
}

.faq-accordion .accordion-button:not(.collapsed) {
  background:rgba(36,36,36,.98);
  color:#f2d98f;
  box-shadow:none;
}

.faq-accordion .accordion-button:focus {
  box-shadow:none;
  border-color:transparent;
}

.faq-accordion .accordion-button::after {
  width:18px;
  height:18px;
  background-size:18px;
  filter:invert(79%) sepia(32%) saturate(552%) hue-rotate(358deg) brightness(94%) contrast(88%);
}

.faq-accordion .accordion-body {
  padding:clamp(18px, 1.8vw, 28px) clamp(20px, 2vw, 32px);
  background:rgba(12,12,12,.92);
  color:rgba(255,255,255,.72);
  font-size:clamp(15px, 1vw, 17px);
  line-height:1.9;
  letter-spacing:.04em;
}


/* 桌機 */

/* =========================================================
   15. Responsive / Mobile First Overrides
   Base = Mobile 0–479px
   注意：HTML 已使用 Bootstrap row/col，這裡避免再覆寫 grid-template。
   ========================================================= */

.hs-section {
  padding: 30px 0;
}

.hs-wrap,
.hs-narrow {
  width: min(100% - 28px, 1180px);
}

.hs-hero {
  padding-top: 0;
}

.hs-hero h1 {
  font-size: 44px;
}

.hs-hero-sub {
  font-size: 16px;
}

.hs-hero-grid {
  row-gap: 18px;
  column-gap: 0;
}

.hs-hero-visual {
  display: none !important;
}

.hs-stats {
  border-radius: 20px;
}

.hs-stat {
  padding: 18px;
}

.hs-why-photo {
  border-radius: 25px;
}

.hs-kicker-title,
.hs-parallax-copy h2,
.hs-cta h2 {
  letter-spacing: -.055em;
}

.hs-parallax-band {
  min-height: 40svh;
}

#portfolio .hs-parallax-copy{
	position:relative;
	z-index:2;
}

.hs-track-card,
.hs-result-card {
  border-radius: 24px;
}


#Sd_slides .hs-result-card {
  padding: 24px;
  border-radius: 24px;
}

#Sd_slides .hs-result-school {
  font-size: clamp(24px, 2.2vw, 38px);
}

#Sd_slides .hs-result-award {
  font-size: 18px;
}

.faq-accordion {
  margin-top: 24px;
  border-radius: 4px;
}

.faq-accordion .accordion-button {
  align-items: flex-start;
  padding: 18px 16px;
}

.faq-accordion .accordion-body {
  padding: 18px 16px 22px;
}

/* 480–767px / Large Mobile */
@media (min-width: 480px) and (max-width: 767px) {
}

/* 768–979px / Tablet */
@media (min-width: 768px) and (max-width: 979px) {
  .hs-section {
    padding: 45px 0;
  }

  .hs-hero {
    padding: 48px 0 72px;
  }

  .hs-hero h1 {
    font-size: clamp(42px, 7vw, 88px);
  }

  .hs-hero-sub {
    font-size: clamp(17px, 2.2vw, 23px);
  }

  .hs-hero-visual {
    display: none !important;
  }

  .faq-accordion {
    margin-top: 32px;
    border-radius: 6px;
  }

  .faq-accordion .accordion-button {
    align-items: center;
    padding: clamp(18px, 1.6vw, 24px) clamp(20px, 2vw, 32px);
  }

  .faq-accordion .accordion-body {
    padding: clamp(18px, 1.8vw, 28px) clamp(20px, 2vw, 32px);
  }
}

/* 980–1199px / Small Desktop */
@media (min-width: 980px) and (max-width: 1199px) {
  .hs-hero-grid {
    row-gap: 0;
    column-gap: 0;
  }

  .hs-section {
    padding: 45px 0;
  }

  .hs-hero {
    padding: 48px 0 72px;
  }

  .hs-hero h1 {
    font-size: clamp(42px, 7vw, 88px);
  }

  .hs-hero-sub {
    font-size: clamp(17px, 2.2vw, 23px);
  }

  .hs-hero-visual {
    display: block !important;
    min-height: 520px;
  }

  .hs-field {
    min-height: 320px;
  }
}

/* 1200px+ / Desktop */
@media (min-width: 1200px) {
  .hs-hero-grid {
    row-gap: 0;
    column-gap: 0;
  }

  .hs-section {
    padding: 45px 0;
  }

  .hs-hero {
    padding: 48px 0 72px;
  }

  .hs-hero h1 {
    font-size: clamp(42px, 7vw, 88px);
  }

  .hs-hero-sub {
    font-size: clamp(17px, 2.2vw, 23px);
  }

  .hs-hero-visual {
    display: block !important;
    min-height: 580px;
  }

  .hs-field {
    min-height: 320px;
  }

  .faq-accordion {
    margin-top: 32px;
    border-radius: 6px;
  }

  .faq-accordion .accordion-button {
    align-items: center;
    padding: clamp(18px, 1.6vw, 24px) clamp(20px, 2vw, 32px);
  }

  .faq-accordion .accordion-body {
    padding: clamp(18px, 1.8vw, 28px) clamp(20px, 2vw, 32px);
  }
}

/* 1400px+ / Large Desktop */
@media (min-width: 1400px) {
}

/* 1600px+ / Ultra Wide */
@media (min-width: 1600px) {
}