/* ── 手機版共用扇形 stack mixin ── */
/* 套用在 .blog-stack-wrapper 和 .project-stack-wrapper */

/* 手機版 Blog 堆疊卡片 */
@media (max-width: 768px) {
  #blog.section {
    padding-top: 2rem !important;
    padding-bottom: 0.5rem !important;
  }

  #blog .section-title {
    margin-bottom: 0.75rem !important;
  }

  #blog .blog-intro {
    margin-bottom: 0.75rem !important;
  }

  #blog .blog-intro p {
    font-size: 0.88rem !important;
    margin-bottom: 0.5rem !important;
  }

  #blogPostsGrid { display: none !important; }

  .blog-stack-wrapper {
    position: relative;
    width: 100%;
    height: 430px;
    touch-action: pan-y;
    overflow: visible;
    margin-top: 1.25rem;
  }

  .blog-stack-wrapper .blog-post-card {
    position: absolute;
    width: 84%;
    height: 380px;
    left: 50%;
    /* 以卡片底部中心為旋轉軸 — 扇形效果 */
    transform-origin: center bottom;
    transform: translateX(-50%);
    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                opacity 0.4s ease,
                box-shadow 0.4s ease;
    cursor: grab;
    user-select: none;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.1);
    background: #0d0d28;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  }

  /* 前卡：正中，不旋轉 */
  .blog-stack-wrapper .blog-post-card[data-stack="0"] {
    z-index: 3;
    transform: translateX(-50%) rotate(0deg);
    opacity: 1;
    box-shadow: 0 12px 40px rgba(0,245,255,0.10), 0 6px 20px rgba(0,0,0,0.5);
  }
  /* 第 2 張：往左旋 -9deg */
  .blog-stack-wrapper .blog-post-card[data-stack="1"] {
    z-index: 2;
    transform: translateX(-50%) rotate(-9deg);
    opacity: 0.7;
  }
  /* 第 3 張：往右旋 +7deg */
  .blog-stack-wrapper .blog-post-card[data-stack="2"] {
    z-index: 1;
    transform: translateX(-50%) rotate(7deg);
    opacity: 0.45;
  }

  .blog-stack-wrapper .blog-post-card.swipe-left {
    transform: translateX(calc(-50% - 110%)) rotate(-12deg) !important;
    opacity: 0 !important;
    transition: transform 0.35s ease-in, opacity 0.28s ease !important;
  }
  .blog-stack-wrapper .blog-post-card.swipe-right {
    transform: translateX(calc(-50% + 110%)) rotate(12deg) !important;
    opacity: 0 !important;
    transition: transform 0.35s ease-in, opacity 0.28s ease !important;
  }

  .blog-stack-wrapper .blog-post-cover {
    height: 170px;
    overflow: hidden;
    flex-shrink: 0;
  }
  .blog-stack-wrapper .blog-post-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .blog-stack-wrapper .blog-post-content {
    padding: 1rem 1.1rem 0.9rem !important;
  }
  .blog-stack-wrapper .blog-post-card h3 {
    font-size: 0.97rem !important;
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 0.35rem;
  }
  .blog-stack-wrapper .blog-post-date {
    font-size: 0.78rem;
    margin-bottom: 0.4rem;
    opacity: 0.65;
  }
  .blog-stack-wrapper .blog-post-excerpt {
    font-size: 0.8rem;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    opacity: 0.65;
    margin-bottom: 0;
  }

}

/* ── 手機版 合作夥伴 跑馬燈 ── */
@media (max-width: 768px) {
  .partners-section {
    margin-top: 1rem;
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent 0%, white 10%, white 90%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, white 10%, white 90%, transparent 100%);
  }

  .partners-title {
    font-size: 1.1rem !important;
    margin-bottom: 0.6rem !important;
    text-align: center;
  }

  .partners-logos {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0.75rem !important;
    padding: 0.25rem 0 !important;
    animation: partners-marquee 18s linear infinite;
    width: max-content;
  }

  @keyframes partners-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }

  .partner-logo {
    flex: 0 0 auto !important;
    width: auto !important;
    padding: 0.55rem 1rem !important;
    border-radius: 8px !important;
    flex-direction: row !important;
    gap: 0.45rem !important;
    min-height: unset !important;
    height: auto !important;
    white-space: nowrap;
  }

  .partner-logo i {
    font-size: 1rem !important;
  }

  .partner-logo span {
    font-size: 0.75rem !important;
  }

  .partners-note {
    font-size: 0.72rem !important;
    margin-top: 0.75rem !important;
    line-height: 1.5;
  }
}

/* ── 手機版 見證區塊 橫排條列 ── */
@media (max-width: 768px) {
  /* 橫幅條列：星星＋人名一行，引言完整展開 */
  .testimonials-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.55rem;
    padding: 0.25rem 0 0.5rem;
  }

  .testimonial-card {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.35rem;
    padding: 0.7rem 0.9rem !important;
    border-radius: 10px !important;
    min-height: unset !important;
    height: auto !important;
  }

  /* 上排：星星 + 人名同一行 */
  .testimonial-header {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0 !important;
  }

  .testimonial-header .fa-quote-left {
    display: none !important;
  }

  .testimonial-rating .fa-star {
    font-size: 0.65rem !important;
  }

  .testimonial-author {
    padding-top: 0 !important;
    border-top: none !important;
    margin-top: 0 !important;
  }

  .testimonial-author strong {
    font-size: 0.65rem !important;
    white-space: nowrap;
    color: var(--primary, #00f5ff);
  }

  .testimonial-author span {
    display: none !important;
  }

  /* 引言文字完整顯示，不截斷 */
  .testimonial-text {
    font-size: 0.72rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    opacity: 0.88;
    overflow: visible !important;
    display: block !important;
    -webkit-line-clamp: unset !important;
  }
}

/* ── 手機版 團隊成就 縮小：單層跑馬燈 ── */
@media (max-width: 768px) {
  /* 只顯示第一層，隱藏另外兩層 */
  .achievements-marquee-layer:nth-child(2),
  .achievements-marquee-layer:nth-child(3) {
    display: none !important;
  }

  #achievements.section {
    padding-top: 2.5rem;
    padding-bottom: 1.5rem;
  }

  .achievements-marquee-wrapper {
    padding: 0.5rem 0 !important;
    gap: 0 !important;
  }

  .achievements-marquee-track {
    gap: 0.75rem !important;
    animation-duration: 30s !important;
  }

  .achievement-card {
    min-width: 150px !important;
    max-width: 190px !important;
    padding: 0.6rem 0.8rem !important;
    gap: 0.5rem !important;
    border-radius: 10px !important;
  }

  .achievement-icon {
    width: 28px !important;
    height: 28px !important;
    font-size: 0.8rem !important;
    flex-shrink: 0;
  }

  .achievement-content h3 {
    font-size: 0.68rem !important;
    margin-bottom: 0.15rem !important;
    line-height: 1.35;
    white-space: normal !important;
  }

  .award-type {
    font-size: 0.6rem !important;
  }
}

/* ── 手機版 Projects 扇形堆疊 ── */
@media (max-width: 768px) {
  .project-carousel { display: none !important; }

  #projects.section {
    padding-top: 3rem;
    padding-bottom: 1rem;
  }

  .project-stack-wrapper {
    position: relative;
    width: 100%;
    height: 400px;
    touch-action: pan-y;
    overflow: visible;
    margin-bottom: 0;
  }

  .project-stack-card {
    position: absolute;
    width: 84%;
    height: 380px;
    left: 50%;
    transform-origin: center bottom;
    transform: translateX(-50%);
    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                opacity 0.4s ease,
                box-shadow 0.4s ease;
    cursor: grab;
    user-select: none;
    overflow: hidden;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,0.1);
    background: #0d0d28;
    box-shadow: 0 8px 32px rgba(0,0,0,0.4);
  }

  .project-stack-card[data-stack="0"] {
    z-index: 3;
    transform: translateX(-50%) rotate(0deg);
    opacity: 1;
    box-shadow: 0 12px 40px rgba(0,245,255,0.10), 0 6px 20px rgba(0,0,0,0.5);
  }
  .project-stack-card[data-stack="1"] {
    z-index: 2;
    transform: translateX(-50%) rotate(-9deg);
    opacity: 0.7;
  }
  .project-stack-card[data-stack="2"] {
    z-index: 1;
    transform: translateX(-50%) rotate(7deg);
    opacity: 0.45;
  }
  .project-stack-card[data-stack="3"],
  .project-stack-card[data-stack="4"],
  .project-stack-card[data-stack="5"] {
    display: none;
  }

  .project-stack-card.swipe-left {
    transform: translateX(calc(-50% - 110%)) rotate(-12deg) !important;
    opacity: 0 !important;
    transition: transform 0.35s ease-in, opacity 0.28s ease !important;
  }
  .project-stack-card.swipe-right {
    transform: translateX(calc(-50% + 110%)) rotate(12deg) !important;
    opacity: 0 !important;
    transition: transform 0.35s ease-in, opacity 0.28s ease !important;
  }

  .project-stack-card img {
    width: 100%;
    height: 195px;
    object-fit: cover;
    display: block;
  }

  .project-stack-card .card-content {
    padding: 0.9rem 1.1rem;
  }

  .project-stack-card .card-content h3 {
    font-size: 1.1rem;
    margin-bottom: 0.3rem;
    color: var(--primary, #00f5ff);
  }

  .project-stack-card .card-content p {
    font-size: 0.83rem;
    opacity: 0.7;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #ccc;
  }
}
