/* ============================================
   OPS UI v1.0 CSS PACK
   ============================================ */
   :root{
    --ops-green:#0E3B2E;      /* OPS 그린 */
    --ops-navy:#0B1B2B;       /* OPS 네이비 */
    --ops-gold:#F3C94B;       /* 골드 (메인 포인트) */
    --ops-lime:#7CFF6B;       /* 라임 (보조 포인트) */
    --ops-bg:#F6F7F9;         /* 운영화면 배경 (밝은 톤) */
    --ops-card:#FFFFFF;
    --ops-text:#111827;
    --ops-muted:#6B7280;
    --ops-line:#E5E7EB;
  }
  
  body.ops-ui{
    background:var(--ops-bg);
    color:var(--ops-text);
  }
  
  /* 상단 바 (운영화면 공통) */
  .ops-topbar{
    position:sticky; top:0; z-index:1100;
    background:rgba(255,255,255,0.92);
    backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid var(--ops-line);
  }
  .ops-topbar .ops-brand{
    font-weight:800;
    color:var(--ops-green);
    letter-spacing:-0.2px;
  }
  .ops-topbar .ops-title{
    font-weight:700;
    color:#374151;
  }
  
  /* 페이지 컨테이너 (모바일 기준) */
  .ops-container{
    max-width:420px;
    margin:0 auto;
    padding:10px 12px 78px; /* 하단 네비게이션 공간 확보 */
  }
  
  /* PC 모드 반응형 */
  @media (min-width: 992px) {
    .ops-container {
      max-width: 1200px;
      padding: 24px 32px 24px; /* PC 모드에서는 하단 네비게이션 padding 제거 */
    }
    
    /* 사이드바가 없을 때 ops-container의 max-width 확대 */
    body.landing-nav-page .app-shell-no-sidebar .ops-container,
    .app-shell-no-sidebar .ops-container {
      max-width: 95% !important;
      width: 100% !important;
      padding: 24px 32px 24px !important;
    }
    
    .ops-card {
      border-radius: 20px;
      box-shadow: 0 8px 24px rgba(17, 24, 39, 0.08);
    }
    
    .ops-card-header {
      padding: 16px 20px;
    }
    
    .ops-card-header .ops-h {
      font-size: 18px;
    }
    
    .ops-card-body {
      padding: 20px;
    }
    
    .ops-btn-primary,
    .ops-btn-ghost {
      padding: 12px 20px;
      font-size: 15px;
    }
    
    /* 캘린더 PC 모드 스타일 */
    .calendar-grid {
      gap: 0.5rem;
    }
    
    .calendar-day-header {
      font-size: 1rem;
      padding: 0.75rem 0;
    }
    
    .calendar-day {
      padding: 0.5rem;
      border-radius: 12px;
    }
    
    .calendar-day span {
      font-size: 1rem;
    }
    
    .calendar-header {
      margin-bottom: 1.5rem;
      padding: 1rem 0;
    }
    
    .calendar-header h5 {
      font-size: 1.5rem;
    }
    
    /* 프로필 이미지 PC 모드 */
    .profile-image,
    .profile-placeholder {
      width: 80px;
      height: 80px;
    }
    
    .profile-placeholder {
      font-size: 2rem;
    }
    
    /* 활동 아이템 PC 모드 */
    .activity-item {
      padding: 1rem 0;
      font-size: 15px;
    }
    
    /* 설정 아이템 PC 모드 */
    .setting-item {
      padding: 1rem 0;
      font-size: 15px;
    }
    
    .setting-item:hover {
      margin: 0 -20px;
      padding-left: 20px;
      padding-right: 20px;
    }
    
    /* 라운드 아이템 PC 모드 */
    .round-item {
      padding: 1rem;
    }
    
    /* 게시글 아이템 PC 모드 */
    .post-item {
      padding: 1rem;
    }
    
    /* 라운드 카드 PC 모드 */
    .round-card {
      padding: 1rem;
      border-radius: 12px;
      margin-bottom: 1rem;
    }
    
    /* 상태 배지 PC 모드 */
    .status-badge {
      padding: 0.375rem 0.75rem;
      font-size: 0.875rem;
    }
  }
  
  /* (주석 인코딩 깨짐: 내용 복구 필요) */
  .ops-card{
    background:var(--ops-card);
    border:1px solid var(--ops-line);
    border-radius:16px;
    box-shadow:0 6px 18px rgba(17,24,39,0.06);
  }
  .ops-card + .ops-card{ margin-top:12px; }
  .ops-card-header{
    padding:10px 12px;
    border-bottom:1px solid var(--ops-line);
    display:flex; align-items:center; justify-content:space-between;
  }
  .ops-card-header .ops-h{
    margin:0;
    font-size:15px;
    font-weight:800;
    color:#0F172A;
  }
  .ops-card-body{ padding:12px; }
  
  /* 버튼 (운영화면 공통) */
  .ops-btn-primary{
    background:linear-gradient(135deg,var(--ops-green),#15803D);
    color:#fff; border:none;
    border-radius:12px;
    padding:10px 14px;
    font-weight:800;
  }
  .ops-btn-ghost{
    background:#fff;
    border:1px solid var(--ops-line);
    border-radius:12px;
    padding:10px 14px;
    font-weight:700;
    color:#111827;
  }
  
  /* 하단 네비게이션 (기존 클래스 유지, 모바일에서만 OPS 스타일 적용) */
  .bottom-nav{
    position:fixed !important;
    bottom:0; left:0; right:0;
    z-index:1000;
    background:rgba(255,255,255,0.96) !important;
    backdrop-filter: blur(10px);
    border-top:1px solid var(--ops-line) !important;
    box-shadow:0 -6px 18px rgba(17,24,39,0.08) !important;
    display:none !important; /* (주석 인코딩 깨짐: 내용 복구 필요) */
  }
  @media (max-width: 991px){
    .bottom-nav{ display:block !important; }
    body{ padding-bottom:72px; }
    body.modal-open{ padding-bottom:0; }
    /* 모달이 열려있을 때 네비게이션과 하단 메뉴 숨기기 */
    body.modal-open #bottomNav,
    body.modal-open #topNavbar,
    body.modal-open #landingTopNavLoggedIn {
      display: none !important;
      visibility: hidden !important;
      z-index: -1 !important;
    }
  }
  /* 모든 화면 크기에서 모달이 열려있을 때 네비게이션 숨기기 */
  body.modal-open #bottomNav,
  body.modal-open #topNavbar,
  body.modal-open #landingTopNavLoggedIn {
    display: none !important;
    visibility: hidden !important;
    z-index: -1 !important;
  }
  .bottom-nav-container{
    height:68px !important;
    padding:0 10px !important;
    display: flex !important;
    justify-content: space-around !important;
    align-items: center !important;
  }
  .bottom-nav-item{
    color:var(--ops-muted) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    flex: 1 !important;
  }
  .bottom-nav-thumbnail{
    width:36px !important; height:36px !important;
    border-radius:12px !important;
    box-shadow:0 2px 8px rgba(0,0,0,0.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 4px !important;
  }
  .bottom-nav-item.active{
    color:var(--ops-muted) !important;
  }
  .bottom-nav-item.active i{
    color:#0d6efd !important;
    font-size:20px !important;
  }
  .bottom-nav-item.active .bottom-nav-thumbnail{
    transform:scale(1.08) !important;
    box-shadow:0 6px 14px rgba(14,59,46,0.22) !important;
  }
  
  /* 아이콘/라벨 크기 고정 (기존 기준 유지) */
  .bottom-nav-item i{ font-size:18px !important; }
  .bottom-nav-label{ 
    font-size:10px !important; 
    font-weight:700 !important;
    color:var(--ops-muted) !important;
  }
  .bottom-nav-item.active .bottom-nav-label{
    color:var(--ops-muted) !important;
  }
  
  /* ============================================
     모바일 사이드바 스타일
     ============================================ */
  .mobile-sidebar {
      position: fixed;
      top: 0;
      left: -200px;
      width: 200px;
      height: 100vh;
      background: #fff;
      z-index: 999;
      transition: left 0.3s ease;
      box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
      padding: 1.5rem;
      overflow-y: auto;
  }
  
  .mobile-sidebar.active {
      left: 0;
  }
  
  .mobile-sidebar-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.5);
      z-index: 998;
      display: none;
  }
  
  .mobile-sidebar-overlay.active {
      display: block;
  }
  
  .mobile-sidebar-close {
      position: absolute;
      top: 1rem;
      right: 1rem;
      background: none;
      border: none;
      font-size: 1.5rem;
      cursor: pointer;
      color: #333;
  }
  
  .mobile-sidebar-menu {
      list-style: none;
      padding: 0;
      margin: 0;
  }
  
  .mobile-sidebar-menu li {
      margin-bottom: 0.1rem;
  }
  
  .mobile-sidebar-menu a {
      display: block;
      padding: 0.75rem 1rem;
      color: #333;
      text-decoration: none;
      border-radius: 8px;
      transition: background 0.2s;
  }
  
  .mobile-sidebar-menu a:hover {
      background: #f0f0f0;
  }
  
  .mobile-sidebar-menu a i {
      margin-right: 0.5rem;
      width: 20px;
      text-align: center;
  }
  
  .mobile-sidebar-menu a.submenu {
      padding-left: 2.5rem;
      position: relative;
  }
  
  .mobile-sidebar-menu a.submenu::before {
      content: "└";
      position: absolute;
      left: 1.5rem;
      color: #999;
  }
  
  .mobile-sidebar .club-header {
      width: 98%;
      max-width: 98%;
      margin: 0.2rem auto;
      padding: 0.5rem 0.5rem;
      display: block !important;
      text-align: center;
      border-bottom: 1px solid #eee;
      padding-bottom: 1rem;
      margin-bottom: 1rem;
  }
  
  .mobile-sidebar .club-icon {
      width: 100px;
      height: 100px;
      margin: 0 auto 0.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #f5f5f5;
      border-radius: 50%;
  }
  
  .mobile-sidebar .club-icon i {
      font-size: 3rem;
      color: #666;
  }
  
  .mobile-sidebar .club-name {
      font-size: 1.1rem;
      font-weight: 700;
      color: #333;
      margin-bottom: 0.25rem;
  }
  
  .mobile-sidebar .club-subtitle {
      font-size: 0.9rem;
      color: #666;
      line-height: 1.4;
  }
  
  /* ============================================
     index.php 랜딩페이지 전용 스타일
     ============================================ */
  /* 랜딩페이지 전용 CSS 변수 및 스타일 (OPS 변수와 충돌 방지 목적) */
  body.index-page {
      /* Primary Colors */
      --landing-primary-deep-green: #1a472a;
      --landing-primary-dark-navy: #0a1929;
      --landing-navy-level-1: #0a1929;      /* (주석 인코딩 깨짐: 내용 복구 필요) */
      --landing-navy-level-2: #1a2332;      /* (주석 인코딩 깨짐: 내용 복구 필요) */
      --landing-navy-level-3: #2a3441;      /* 카드 배경 */
      
      /* Accent Colors */
      --landing-accent-gold: #e8c547;
      --landing-accent-gold-light: #f4d03f;
      --landing-accent-lime: #7cb342;
      
      /* Text Colors */
      --landing-text-white: #ffffff;
      --landing-text-light: rgba(255, 255, 255, 0.9);
      --landing-text-muted: rgba(255, 255, 255, 0.7);
      
      /* Background Colors */
      --landing-bg-card: rgba(255, 255, 255, 0.08);
      --landing-bg-card-hover: rgba(255, 255, 255, 0.12);
      
      /* Overlay */
      --landing-overlay-hero: rgba(11, 42, 36, 0.6);
      
      /* 스타일 */
      font-family: 'Noto Sans KR', 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
      overflow-x: hidden;
      background: var(--landing-primary-dark-navy);
      color: var(--landing-text-white);
  }
  
  /* ============================================
     Hero Section (메인 영역 - 골프 사진 배경)
     ============================================ */
  .hero-section {
      position: relative;
      width: 100%;
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      margin-top: 0;
  }
  
  .hero-background {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url('/image/photo/단체사진1.jpg');
      background-size: cover;
      background-position: center;
      background-attachment: fixed;
      z-index: 0;
  }
  
  .hero-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100px;
      background: linear-gradient(180deg, rgba(10, 25, 41, 0.4) 0%, transparent 100%);
      z-index: 1;
      pointer-events: none;
  }
  
  .hero-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: var(--landing-overlay-hero);
      z-index: 1;
      pointer-events: none;
  }
  
  .hero-content {
      position: relative;
      z-index: 2;
      text-align: center;
      padding: 2rem;
      max-width: 1200px;
      margin: 0 auto;
  }
  
  /* PC 모드에서 텍스트를 중앙보다 약간 위로 */
  @media (min-width: 992px) {
      .hero-content {
          margin-top: -8vh;
      }
  }
  
  /* 랜딩페이지에서는 hero-content의 margin-top 오버라이드 */
  @media (min-width: 992px) {
      body.index-page .hero-content {
          margin-top: 8vh !important;
      }
  }
  
  /* Eyebrow 브랜드 문구 */
  .hero-eyebrow {
      font-size: clamp(0.75rem, 1.5vw, 0.95rem);
      font-weight: 600;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--landing-accent-gold);
      margin-bottom: 1.5rem;
      animation: fadeInUp 1s ease-out 0.1s both;
      text-shadow: 0 2px 10px rgba(232, 197, 71, 0.3);
  }
  
  .hero-eyebrow-brand {
      display: block;
      margin-bottom: 0.3rem;
  }
  
  .hero-eyebrow-tagline {
      font-size: clamp(0.7rem, 1.2vw, 0.85rem);
      font-weight: 400;
      letter-spacing: 0.05em;
      text-transform: none;
      color: rgba(255, 255, 255, 0.9);
      opacity: 0.95;
  }
  
  .hero-main-copy {
      font-size: clamp(2.5rem, 6vw, 5rem);
      font-weight: 900;
      line-height: 1.2;
      margin-bottom: 1rem;
      color: var(--landing-text-white);
      text-shadow: 0 4px 30px rgba(0, 0, 0, 0.6), 0 2px 10px rgba(0, 0, 0, 0.4);
      animation: fadeInUp 1s ease-out;
      letter-spacing: -0.02em;
  }
  
  .hero-sub-copy {
      font-size: clamp(1.2rem, 2.8vw, 1.8rem);
      font-weight: 500;
      line-height: 1.6;
      margin-bottom: 3.5rem;
      color: var(--landing-text-light);
      text-shadow: 0 2px 15px rgba(0, 0, 0, 0.4);
      animation: fadeInUp 1s ease-out 0.3s both;
  }
  
  .hero-cta-buttons {
      display: flex;
      gap: 2rem;
      justify-content: center;
      flex-wrap: wrap;
      align-items: center;
      animation: fadeInUp 1s ease-out 0.6s both;
  }
  
  .btn-hero-primary {
      padding: 1.5rem 4rem;
      font-size: 1.3rem;
      font-weight: 700;
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, var(--landing-accent-gold-light) 100%);
      border: none;
      border-radius: 50px;
      color: var(--landing-primary-dark-navy);
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.7rem;
      text-align: center;
      box-shadow: 0 15px 40px rgba(232, 197, 71, 0.6), 0 5px 20px rgba(232, 197, 71, 0.4);
      transition: all 0.3s ease;
      cursor: pointer;
  }
  
  .btn-hero-primary:hover {
      transform: translateY(-8px) scale(1.05);
      box-shadow: 0 20px 50px rgba(232, 197, 71, 0.7), 0 8px 25px rgba(232, 197, 71, 0.5);
      color: var(--landing-primary-dark-navy);
  }
  
  .btn-hero-secondary {
      padding: 1.5rem 4rem;
      font-size: 1.3rem;
      font-weight: 600;
      background: transparent;
      border: 2px solid var(--landing-accent-lime);
      border-radius: 50px;
      color: var(--landing-text-white);
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.7rem;
      text-align: center;
      backdrop-filter: blur(10px);
      transition: all 0.3s ease;
  }
  
  .btn-hero-secondary:hover {
      background: rgba(124, 179, 66, 0.2);
      border-color: var(--landing-accent-lime);
      border-width: 3px;
      transform: translateY(-8px);
      box-shadow: 0 15px 35px rgba(124, 179, 66, 0.4);
      color: var(--landing-text-white);
  }
  
  .scroll-indicator {
      position: absolute;
      bottom: 3rem;
      left: 50%;
      transform: translateX(-50%);
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0.5rem;
      cursor: pointer;
  }
  
  .scroll-indicator i {
      font-size: 2.5rem;
      color: var(--landing-accent-gold);
      text-shadow: 0 2px 10px rgba(232, 197, 71, 0.5);
  }
  
  .scroll-indicator-text {
      font-size: 0.9rem;
      font-weight: 600;
      color: var(--landing-text-light);
      letter-spacing: 0.1em;
      text-transform: uppercase;
  }
  
  @keyframes bounce {
      0%, 100% { transform: translateX(-50%) translateY(0); }
      50% { transform: translateX(-50%) translateY(15px); }
  }
  
  /* ============================================
     섹션 공통 스타일
     ============================================ */
  .section {
      padding: 5rem 1rem;
      position: relative;
  }
  
  .section-title {
      font-size: clamp(2rem, 4vw, 3rem);
      font-weight: 800;
      text-align: center;
      margin-bottom: 1rem;
      color: var(--landing-text-white);
  }
  
  .section-subtitle {
      font-size: clamp(1rem, 2vw, 1.2rem);
      text-align: center;
      color: var(--landing-text-light);
      margin-bottom: 3rem;
  }
  
  /* ============================================
     Problem 섹션 (Landing v2.0: 단색/그라데이션만)
     ============================================ */
  .problem-section {
      position: relative;
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
      color: #fff;
      overflow: hidden;
  }
  .problem-section > * { position: relative; z-index: 1; }

  /* 레거시: benefits-section (v2에서 problem으로 대체, 배경이미지 제거) */
  .benefits-section {
      position: relative;
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
      overflow: hidden;
  }
  .benefits-section::before,
  .benefits-section::after { display: none !important; }
  .benefits-section > * { position: relative; z-index: 1; }
  
  .benefits-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
      gap: 2rem;
      max-width: 1200px;
      margin: 0 auto;
  }
  
  .benefit-card {
      background: var(--landing-bg-card);
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 20px;
      padding: 2.5rem 2rem;
      text-align: center;
      backdrop-filter: blur(10px);
      transition: all 0.3s ease;
      opacity: 0;
      transform: translateY(30px);
  }
  
  .benefit-card.fade-in {
      opacity: 1;
      transform: translateY(0);
  }
  
  .benefit-card:hover {
      transform: translateY(-10px);
      background: var(--landing-bg-card-hover);
      border-color: var(--landing-accent-gold);
      box-shadow: 0 10px 30px rgba(232, 197, 71, 0.25);
  }
  
  .benefit-icon {
      font-size: 3.5rem;
      margin-bottom: 1.5rem;
      color: var(--landing-accent-gold);
  }
  
  .benefit-title {
      font-size: 1.3rem;
      font-weight: 700;
      margin-bottom: 1rem;
      color: var(--landing-text-white);
  }
  
  .benefit-description {
      font-size: 1rem;
      color: var(--landing-text-light);
      line-height: 1.6;
  }
  
  /* ============================================
     Before / After 비교 섹션 (그린 배경)
     ============================================ */
  .comparison-section {
      position: relative;
      background: var(--landing-navy-level-2);
      overflow: hidden;
  }
  
  .comparison-section::before { display: none; }
  .comparison-section::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
      z-index: 0;
  }
  
  .comparison-section > * {
      position: relative;
      z-index: 1;
  }
  
  .comparison-container {
      max-width: 1200px;
      margin: 0 auto;
  }
  
  .comparison-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 2rem;
      margin-top: 3rem;
  }
  
  .comparison-card {
      background: rgba(255, 255, 255, 0.12);
      border-radius: 20px;
      padding: 3rem 2rem;
      border: 2px solid rgba(255, 255, 255, 0.2);
      backdrop-filter: blur(15px);
      opacity: 0;
      transform: translateY(30px);
  }
  
  .comparison-card.fade-in {
      opacity: 1;
      transform: translateY(0);
  }
  
  .comparison-card.before {
      border-left: 4px solid rgba(255, 255, 255, 0.3);
  }
  
  .comparison-card.after {
      border-left: 4px solid var(--landing-accent-lime);
  }
  
  .comparison-header {
      font-size: 1.8rem;
      font-weight: 800;
      margin-bottom: 2rem;
      text-align: center;
  }
  
  .comparison-card.before .comparison-header {
      color: rgba(255, 255, 255, 0.7);
  }
  
  .comparison-card.after .comparison-header {
      color: var(--landing-accent-lime);
  }
  
  .comparison-item {
      display: flex;
      align-items: flex-start;
      gap: 1rem;
      margin-bottom: 1.5rem;
      padding: 1rem;
      background: rgba(255, 255, 255, 0.03);
      border-radius: 10px;
  }
  
  .comparison-item-icon {
      font-size: 1.5rem;
      flex-shrink: 0;
  }
  
  .comparison-card.before .comparison-item-icon {
      color: rgba(255, 255, 255, 0.5);
  }
  
  .comparison-card.after .comparison-item-icon {
      color: var(--landing-accent-lime);
  }
  
  .comparison-item-text {
      flex: 1;
      font-size: 1.1rem;
      line-height: 1.6;
      color: var(--landing-text-light);
  }
  
  .comparison-emphasis {
      text-align: center;
      margin-top: 3rem;
      padding: 2rem;
      background: rgba(212, 175, 55, 0.1);
      border-radius: 15px;
      border: 1px solid rgba(212, 175, 55, 0.3);
  }
  
  .comparison-emphasis-text {
      font-size: clamp(1.2rem, 2.5vw, 1.8rem);
      font-weight: 700;
      color: var(--landing-accent-gold);
      line-height: 1.8;
  }
  
  /* ============================================
     AI 기능 소개 섹션 (단체 스코어카드 배경)
     ============================================ */
  .ai-features-section {
      position: relative;
      background: var(--landing-navy-level-2);
      overflow: hidden;
  }
  
  .ai-features-section::before { display: none; }
  .ai-features-section::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(245,248,250,1) 0%, rgba(236,242,246,1) 100%);
      z-index: 0;
  }
  
  .ai-features-section > * {
      position: relative;
      z-index: 1;
  }

  /* ============================================
     동호회 구독 혜택 섹션 (티박스 배경)
     ============================================ */
  .subscription-benefit-section {
      position: relative;
      background: var(--landing-navy-level-2);
      overflow: hidden;
  }
  
  .subscription-benefit-section::before,
  .subscription-benefit-section::after { display: none; }
  .subscription-benefit-section {
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
  }
  
  .subscription-benefit-section > * {
      position: relative;
      z-index: 1;
  }

  /* 클럽 대시보드 섹션 헤더 표준 색상 */
  body.club-dashboard-page .club-section-row > div:nth-child(1) .section-header {
      background: linear-gradient(135deg, #43A047 0%, #66BB6A 100%) !important;
      color: #ffffff !important;
  }
  body.club-dashboard-page .club-section-row > div:nth-child(2) .section-header {
      background: linear-gradient(135deg, #1E88E5 0%, #42A5F5 100%) !important;
      color: #ffffff !important;
  }
  body.club-dashboard-page .club-section-row > div:nth-child(3) .section-header {
      background: linear-gradient(135deg, #7E57C2 0%, #9575CD 100%) !important;
      color: #ffffff !important;
  }
  body.club-dashboard-page .club-section-row > div:nth-child(4) .section-header {
      background: linear-gradient(135deg, #00897B 0%, #26A69A 100%) !important;
      color: #ffffff !important;
  }
  body.club-dashboard-page .club-section-row .section-header a {
      color: inherit !important;
  }
  
  .ai-features-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 3rem;
      max-width: 1200px;
      margin: 0 auto;
  }
  
  .ai-feature-card {
      background: var(--landing-bg-card);
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 25px;
      padding: 3rem 2.5rem;
      text-align: center;
      backdrop-filter: blur(10px);
      transition: all 0.3s ease;
      opacity: 0;
      transform: translateY(30px);
  }
  
  .ai-feature-card.fade-in {
      opacity: 1;
      transform: translateY(0);
  }
  
  .ai-feature-card:hover {
      transform: translateY(-15px) scale(1.02);
      background: var(--landing-bg-card-hover);
      border-color: var(--landing-accent-gold);
      box-shadow: 0 15px 40px rgba(232, 197, 71, 0.3);
  }
  
  .ai-feature-icon {
      font-size: 4.5rem;
      margin-bottom: 2rem;
      color: var(--landing-accent-gold);
  }
  
  .ai-feature-title {
      font-size: 1.8rem;
      font-weight: 800;
      margin-bottom: 1.5rem;
      color: var(--landing-text-white);
  }
  
  .ai-feature-description {
      font-size: 1.1rem;
      color: var(--landing-text-light);
      line-height: 1.8;
      margin-bottom: 1.5rem;
  }
  
  .ai-feature-tagline {
      font-size: 1.2rem;
      font-weight: 600;
      color: var(--landing-accent-gold);
      font-style: italic;
      padding-top: 1.5rem;
      border-top: 1px solid rgba(212, 175, 55, 0.3);
  }
  
  /* ============================================
     요금제 섹션 (골프장 배경)
     ============================================ */
  .pricing-section {
      position: relative;
      background: var(--landing-navy-level-2);
      overflow: hidden;
  }
  
  .pricing-section::before { display: none; }
  .pricing-section::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
      z-index: 0;
  }
  
  .pricing-section > * {
      position: relative;
      z-index: 1;
  }
  
  .pricing-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 2.5rem;
      max-width: 1200px;
      margin: 0 auto;
  }
  
  .pricing-card {
      background: var(--landing-bg-card);
      border: 1px solid rgba(255, 255, 255, 0.12);
      border-radius: 25px;
      padding: 3rem 2.5rem;
      text-align: center;
      backdrop-filter: blur(10px);
      transition: all 0.3s ease;
      opacity: 0;
      transform: translateY(30px);
      position: relative;
  }
  
  .pricing-card.fade-in {
      opacity: 1;
      transform: translateY(0);
  }
  
  .pricing-card.featured {
      border: 3px solid var(--landing-accent-gold);
      box-shadow: 0 0 50px rgba(232, 197, 71, 0.4), 0 10px 40px rgba(232, 197, 71, 0.3);
      transform: scale(1.05) translateY(-10px);
  }
  
  .pricing-card.featured.fade-in {
      transform: scale(1.05) translateY(-10px);
  }
  
  /* 프로모션 카드 (요금제 카드와 동일한 카드 스타일, 그라데이션 강조) */
  .pricing-card.promotion-card {
      background: linear-gradient(135deg, #ff6b6b 0%, #feca57 100%);
      border: 1px solid rgba(255, 255, 255, 0.25);
      color: #fff;
  }
  .pricing-card.promotion-card .pricing-plan-name {
      color: #fff;
      font-size: 1.4rem;
      word-wrap: break-word;
      overflow-wrap: break-word;
  }
  .pricing-card.promotion-card .pricing-price.promotion-price {
      font-size: 1.6rem;
      font-weight: 800;
      color: #fff;
      margin-bottom: 0.5rem;
  }
  .pricing-card.promotion-card .pricing-features li {
      color: rgba(255, 255, 255, 0.95);
      border-bottom-color: rgba(255, 255, 255, 0.2);
  }
  .pricing-card.promotion-card .pricing-features li i {
      color: #fff;
  }
  .pricing-card.promotion-card .promotion-memo {
      white-space: pre-line;
      word-wrap: break-word;
      overflow-wrap: break-word;
      font-size: 0.9rem;
      line-height: 1.5;
  }
  .promotion-badge {
      position: absolute;
      top: -18px;
      right: 25px;
      background: rgba(255, 255, 255, 0.95);
      color: #e65100;
      padding: 0.5rem 1rem;
      border-radius: 25px;
      font-size: 0.9rem;
      font-weight: 700;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  }
  .promotion-badge i {
      margin-right: 0.35rem;
  }
  
  .pricing-badge {
      position: absolute;
      top: -18px;
      right: 25px;
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, var(--landing-accent-gold-light) 100%);
      color: var(--landing-primary-dark-navy);
      padding: 0.7rem 1.5rem;
      border-radius: 25px;
      font-size: 1rem;
      font-weight: 800;
      box-shadow: 0 6px 20px rgba(232, 197, 71, 0.5);
      letter-spacing: 0.05em;
  }
  
  .pricing-plan-name {
      font-size: 1.8rem;
      font-weight: 800;
      margin-bottom: 1rem;
      color: var(--landing-text-white);
  }
  
  .pricing-price {
      font-size: 3.5rem;
      font-weight: 900;
      color: var(--landing-accent-gold);
      margin-bottom: 0.5rem;
      line-height: 1;
  }
  
  .pricing-price-unit {
      font-size: 1.2rem;
      font-weight: 500;
      color: var(--landing-text-muted);
      margin-left: 0.3rem;
  }
  .pricing-original-price { text-decoration: line-through; opacity: 0.7; margin-left: 0.5rem; }
  
  .pricing-features {
      list-style: none;
      padding: 0;
      margin: 2rem 0;
      text-align: left;
  }
  
  .pricing-features li {
      padding: 0.8rem 0;
      border-bottom: 1px solid rgba(255, 255, 255, 0.08);
      color: var(--landing-text-light);
      display: flex;
      align-items: center;
      gap: 0.8rem;
  }
  
  .pricing-features li:last-child {
      border-bottom: none;
  }
  
  .pricing-features li i {
      color: var(--landing-accent-lime);
      font-size: 1.1rem;
      flex-shrink: 0;
  }
  
  .pricing-cta {
      margin-top: 2.5rem;
  }
  
  .btn-pricing {
      width: 100%;
      padding: 1.2rem 2rem;
      font-size: 1.1rem;
      font-weight: 700;
      border-radius: 15px;
      text-decoration: none;
      display: inline-block;
      transition: all 0.3s ease;
      border: none;
  }
  
  .btn-pricing-primary {
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, var(--landing-accent-gold-light) 100%);
      color: var(--landing-primary-dark-navy);
      box-shadow: 0 8px 25px rgba(232, 197, 71, 0.4);
  }
  
  .btn-pricing-primary:hover {
      transform: translateY(-3px);
      box-shadow: 0 12px 35px rgba(232, 197, 71, 0.5);
      color: var(--landing-primary-dark-navy);
  }
  
  .btn-pricing-secondary {
      background: rgba(255, 255, 255, 0.1);
      color: var(--landing-text-white);
      border: 2px solid rgba(255, 255, 255, 0.2);
  }
  
  .btn-pricing-secondary:hover {
      background: rgba(255, 255, 255, 0.15);
      border-color: rgba(255, 255, 255, 0.3);
      transform: translateY(-3px);
  }
  
  /* ============================================
     포지셔닝 선언 섹션 (시상식 배경)
     ============================================ */
  .positioning-section {
      position: relative;
      background: var(--landing-navy-level-1);
      text-align: center;
      padding: 8rem 2rem;
      overflow: hidden;
  }
  
  .positioning-section::before { display: none; }
  .positioning-section::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%);
      z-index: 0;
  }
  
  .positioning-section > * {
      position: relative;
      z-index: 1;
  }
  
  .positioning-text {
      font-size: clamp(1.8rem, 4vw, 3.5rem);
      font-weight: 900;
      line-height: 1.8;
      color: var(--landing-text-white);
      max-width: 1000px;
      margin: 0 auto;
      opacity: 0;
      transform: translateY(30px);
  }
  
  .positioning-text.fade-in {
      opacity: 1;
      transform: translateY(0);
  }
  
  .positioning-text .highlight {
      color: var(--landing-accent-gold);
      display: block;
      margin-top: 1rem;
  }
  
  /* ============================================
     최종 CTA 섹션 (골프 사진 배경 - 블러 처리)
     ============================================ */
  .final-cta-section {
      position: relative;
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
  }
  
  .final-cta-section::before {
      content: '';
      position: absolute;
      top: -20px;
      left: -20px;
      width: calc(100% + 40px);
      height: calc(100% + 40px);
      background-image: url('/image/photo/단체사진3.jpg');
      background-size: cover;
      background-position: center;
      background-attachment: fixed;
      filter: blur(2px) brightness(0.95);
      z-index: 0;
  }
  
  .final-cta-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(11, 42, 36, 0.6);
      z-index: 1;
  }
  
  .final-cta-content {
      position: relative;
      z-index: 2;
      text-align: center;
      padding: 2rem;
      max-width: 800px;
      margin: 0 auto;
  }
  
  .final-cta-title {
      font-size: clamp(2rem, 4vw, 3.5rem);
      font-weight: 900;
      margin-bottom: 2rem;
      color: var(--landing-text-white);
      text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  }
  
  .final-cta-buttons {
      display: flex;
      gap: 1.5rem;
      justify-content: center;
      flex-wrap: wrap;
      align-items: center;
      margin-top: 3rem;
  }
  
  /* ============================================
     애니메이션
     ============================================ */
  @keyframes fadeInUp {
      from {
          opacity: 0;
          transform: translateY(40px);
      }
      to {
          opacity: 1;
          transform: translateY(0);
      }
  }
  
  /* ============================================
     PC 모드 전용 스타일
     ============================================ */
  @media (min-width: 992px) {
      .hero-main-copy {
          font-size: 4.5rem;
      }
  
      .hero-sub-copy {
          font-size: 1.6rem;
      }
  
      .btn-hero-primary {
          padding: 1.6rem 4.5rem;
          font-size: 1.35rem;
      }
  
      .btn-hero-secondary {
          padding: 1.6rem 4.5rem;
          font-size: 1.35rem;
      }
  
      .hero-cta-buttons {
          gap: 2.5rem;
      }
  }
  
  /* ============================================
     반응형 스타일
     ============================================ */
  @media (max-width: 991px) {
      .hero-main-copy {
          font-size: 2rem;
      }
  
      .hero-sub-copy {
          font-size: 1.1rem;
      }
  
      .btn-hero-primary,
      .btn-hero-secondary {
          padding: 1rem 2rem;
          font-size: 1rem;
          width: 100%;
          max-width: 300px;
      }
  
      .hero-cta-buttons {
          flex-direction: column;
          align-items: center;
      }
  
      .comparison-grid {
          grid-template-columns: 1fr;
      }
  
      .benefits-grid {
          grid-template-columns: 1fr;
      }
  
      .ai-features-grid {
          grid-template-columns: 1fr;
      }
  
      .pricing-grid {
          grid-template-columns: 1fr;
      }
  
      .pricing-card.featured {
          transform: scale(1);
      }
  
      .pricing-card.featured.fade-in {
          transform: translateY(0);
      }
  
      .section {
          padding: 3rem 1rem;
      }
  
      .positioning-section {
          padding: 4rem 1.5rem;
      }
  }
  
  /* ============================================
     랜딩페이지 전용 상단 네비게이션
     ============================================ */
  .landing-top-nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
      background: #FFFFFF;
      border-bottom: 1px solid rgba(0, 0, 0, 0.06);
      padding: 0.75rem 2rem;
      display: flex;
      align-items: center;
      justify-content: space-between;
      transition: all 0.3s ease;
      height: 60px;
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  }
  
  .landing-top-nav.scrolled {
      background: #FFFFFF;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
      height: 55px;
      padding: 0.65rem 2rem;
  }
  
  .landing-logo {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      text-decoration: none;
      color: var(--landing-primary-dark-navy);
  }
  
  .landing-logo img {
      width: 40px;
      height: 40px;
      object-fit: contain;
  }
  
  .landing-logo-text {
      font-size: 1.5rem;
      font-weight: 800;
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, #f4d03f 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }

  /* 랜딩 전용 변수 미적용 페이지용 보정 */
  body.landing-nav-page .landing-logo-text {
      background: linear-gradient(135deg, #D4AF37 0%, #f4d03f 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      color: transparent;
  }
  
  .landing-nav-buttons {
      display: flex;
      align-items: center;
      gap: 1rem;
  }

  .landing-icon-btn {
      position: relative;
      padding: 0.6rem 0.9rem;
      border-radius: 50%;
      min-width: 40px;
      justify-content: center;
  }

  .landing-icon-btn i {
      font-size: 1.1rem;
  }

  .landing-message-badge {
      position: absolute;
      top: -4px;
      right: -4px;
      min-width: 18px;
      height: 18px;
      padding: 0 5px;
      border-radius: 9px;
      background: #dc3545;
      color: #fff;
      font-size: 0.65rem;
      line-height: 18px;
      text-align: center;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  }
  
  .btn-landing-nav {
      padding: 0.75rem 1.5rem;
      font-size: 1rem;
      font-weight: 600;
      border-radius: 25px;
      text-decoration: none;
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
  }
  
  .btn-landing-nav-primary {
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, #f4d03f 100%) !important;
      color: var(--landing-primary-dark-navy) !important;
      border: none !important;
  }
  
  .btn-landing-nav-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 5px 15px rgba(212, 175, 55, 0.4);
      color: var(--landing-primary-dark-navy) !important;
      background: linear-gradient(135deg, var(--landing-accent-gold) 0%, #f4d03f 100%) !important;
  }
  
  /* major_features.php와 service_intro.php의 상단 네비게이션 버튼 강제 적용 */
  .landing-top-nav .btn-landing-nav-primary {
      background: linear-gradient(135deg, #e8c547 0%, #f4d03f 100%) !important;
      color: #0a1929 !important;
      border: none !important;
  }
  
  .landing-top-nav .btn-landing-nav-primary:hover {
      background: linear-gradient(135deg, #e8c547 0%, #f4d03f 100%) !important;
      color: #0a1929 !important;
      transform: translateY(-2px);
      box-shadow: 0 5px 15px rgba(212, 175, 55, 0.4);
  }
  
  .btn-landing-nav-secondary {
      background: transparent;
      color: #4a5568;
      border: 1px solid rgba(0, 0, 0, 0.1);
  }
  
  .btn-landing-nav-secondary:hover {
      background: rgba(26, 71, 42, 0.05);
      border-color: var(--landing-primary-deep-green);
      color: var(--landing-primary-deep-green);
  }
  
  /* PC 모드에서 사이드바 숨김 */
  @media (min-width: 992px) {
      body.index-page .mobile-sidebar,
      body.index-page .mobile-sidebar-overlay,
      body.index-page .mobile-sidebar-close {
          display: none !important;
      }
  
      /* 기존 네비게이션 바 숨김 */
      body.index-page #topNavbar {
          display: none !important;
      }

      /* Hero 섹션은 네비게이션 높이 보정 */
      body.index-page .hero-section {
          margin-top: 60px !important;
          min-height: calc(100vh - 60px) !important;
          align-items: flex-start !important;
          padding-top: 0 !important;
      }
      
      /* Hero 콘텐츠 위치 조정 - 네비게이션 아래에서 시작 */
      body.index-page .hero-content {
          margin-top: 8vh !important;
      }

      body.dashboard-page #topNavbar {
          display: none !important;
      }

      body.dashboard-page .main-content {
          padding-top: 60px;
      }

      body.landing-nav-page #topNavbar {
          display: none !important;
      }

      body.landing-nav-page .main-content {
          padding-top: 60px;
      }
  }

  @media (max-width: 991px) {
      body.dashboard-page .landing-top-nav {
          display: none !important;
      }

      body.landing-nav-page .landing-top-nav {
          display: none !important;
      }
  }

  /* 라운드 통계 탭: 비활성 탭 숨김 */
  body.rounds-stats-page #roundsStatsTabContent > .tab-pane {
      display: none;
  }

  body.rounds-stats-page #roundsStatsTabContent > .tab-pane.active {
      display: block;
  }

  /* rounds-stats 탭 내 리스트 테이블: 섹션 너비 100% (전체/수상/베스트/올해/이번달/자주가는골프장/골프비용) - 모든 뷰포트 */
  body.rounds-stats-page .main-content .p-2.p-md-3,
  body.rounds-stats-page .main-content .container-fluid.px-0,
  body.rounds-stats-page #roundsStatsTabContent,
  body.rounds-stats-page #roundsStatsTabContent > .tab-pane {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box;
  }
  body.rounds-stats-page #roundsStatsTabContent .gl-section,
  body.rounds-stats-page #roundsStatsTabContent .gl-sections {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box;
  }
  body.rounds-stats-page #roundsStatsTabContent .gl-section__body {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box;
      overflow-x: hidden !important; /* 가로 스크롤 방지 */
  }
  body.rounds-stats-page #roundsStatsTabContent .table-responsive {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box;
      overflow-x: auto !important; /* 테이블이 넘칠 때만 스크롤 */
      overflow-y: hidden !important;
  }
  body.rounds-stats-page #roundsStatsTabContent .table-responsive .table {
      width: 100% !important;
      min-width: 0 !important; /* min-width 제거 */
      max-width: 100% !important;
      box-sizing: border-box;
      table-layout: auto; /* 자동 레이아웃으로 컬럼이 섹션에 맞춰 조정 */
  }
  
  /* 골프비용 탭: 모바일에서 상태 컬럼 숨기기 */
  @media (max-width: 768px) {
      /* 골프비용 탭의 상태 컬럼 숨기기 - 모든 가능한 선택자 사용 */
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(6),
      #roundsStatsTabContent #golf-cost .table tbody td:nth-child(6),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(6),
      #roundsStatsTabContent #golf-cost table tbody td:nth-child(6),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(6),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table tbody td:nth-child(6),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(6),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table tbody td:nth-child(6),
      .tab-pane#golf-cost .table thead th:nth-child(6),
      .tab-pane#golf-cost .table tbody td:nth-child(6),
      .tab-pane#golf-cost table thead th:nth-child(6),
      .tab-pane#golf-cost table tbody td:nth-child(6) {
          display: none !important;
          width: 0 !important;
          padding: 0 !important;
          margin: 0 !important;
          visibility: hidden !important;
      }
      
      /* 상태 컬럼이 숨겨지므로 다른 컬럼들의 너비 조정 */
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(1),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(1),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(1),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(1) { 
          width: 14% !important; 
      }
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(2),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(2),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(2),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(2) { 
          width: 18% !important; 
      }
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(3),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(3),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(3),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(3) { 
          width: 28% !important; 
      }
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(4),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(4),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(4),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(4) { 
          width: 28% !important; 
      }
      #roundsStatsTabContent #golf-cost .table thead th:nth-child(5),
      #roundsStatsTabContent #golf-cost table thead th:nth-child(5),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost .table thead th:nth-child(5),
      body.rounds-stats-page #roundsStatsTabContent #golf-cost table thead th:nth-child(5) { 
          width: 12% !important; 
      }
  }
  
  /* 모바일에서는 padding-top 조정 */
  @media (max-width: 991px) {
      body.rounds-stats-page #roundsStatsTabContent > .tab-pane.active {
          padding-top: 0;
      }
      
      /* rounds-stats-page 반응형 레이아웃 */
      body.rounds-stats-page .content-wrap {
          max-width: 100% !important;
          width: 100% !important;
          margin: 0 !important;
          padding-left: 0 !important;
          padding-right: 0 !important;
      }
      
      body.rounds-stats-page .main-content {
          width: 100% !important;
          max-width: 100% !important;
          padding-left: 0 !important;
          padding-right: 0 !important;
      }
      
      body.rounds-stats-page .p-2,
      body.rounds-stats-page .p-md-3 {
          padding: 0.5rem !important;
      }
      
      body.rounds-stats-page .container-fluid {
          padding-left: 0.5rem !important;
          padding-right: 0.5rem !important;
          width: 100% !important;
          max-width: 100% !important;
      }
      
      /* 탭 네비게이션 반응형 */
      body.rounds-stats-page .top-sub-menu {
          width: 100% !important;
          max-width: 100% !important;
          margin: 0 !important;
          padding: 0 !important;
          overflow-y: hidden !important;
          overflow-x: hidden !important;
          max-height: none !important;
          height: auto !important;
      }
      
      body.rounds-stats-page .top-sub-menu-mobile {
          width: 100% !important;
          justify-content: center !important;
          align-items: center !important;
          overflow-x: auto !important;
          overflow-y: hidden !important;
          -webkit-overflow-scrolling: touch;
          max-height: none !important;
          height: auto !important;
          scrollbar-width: none !important;
          -ms-overflow-style: none !important;
      }
      body.rounds-stats-page .top-sub-menu-mobile::-webkit-scrollbar {
          display: none !important;
          width: 0 !important;
          height: 0 !important;
      }
      
      body.rounds-stats-page .nav-tabs {
          flex-wrap: nowrap;
          overflow-x: auto !important;
          overflow-y: hidden !important;
          -webkit-overflow-scrolling: touch;
          display: flex !important;
          width: max-content;
          min-width: 100%;
          max-height: none !important;
          height: auto !important;
          scrollbar-width: none !important;
          -ms-overflow-style: none !important;
      }
      body.rounds-stats-page .nav-tabs::-webkit-scrollbar {
          display: none !important;
          width: 0 !important;
          height: 0 !important;
      }
      
      body.rounds-stats-page .nav-tabs .nav-item {
          flex-shrink: 0;
      }
      
      body.rounds-stats-page .top-sub-menu-btn {
          font-size: 0.8rem !important;
          padding: 0.5rem 0.6rem !important;
          white-space: nowrap;
          min-width: auto;
      }
      
      body.rounds-stats-page .top-sub-menu-btn .tab-label {
          font-size: 0.75rem;
          line-height: 1.2;
      }
      
      body.rounds-stats-page .top-sub-menu-btn i {
          font-size: 0.9rem;
      }
      
      /* 테이블 반응형 */
      body.rounds-stats-page .table-responsive {
          width: 100%;
          overflow-x: auto;
          -webkit-overflow-scrolling: touch;
      }
      
      body.rounds-stats-page .table {
          font-size: 0.85rem;
          min-width: 0 !important; /* 섹션 100%에 맞추기 위해 min-width 제거 */
          width: 100% !important;
      }
      
      body.rounds-stats-page .table th,
      body.rounds-stats-page .table td {
          padding: 0.5rem 0.4rem;
      }
      
      /* gl-sections 반응형 */
      body.rounds-stats-page .gl-sections {
          grid-template-columns: 1fr !important;
          gap: 0.75rem;
          width: 100%;
          max-width: 100%;
      }
      
      /* gl-section 반응형 */
      body.rounds-stats-page .gl-section {
          width: 100%;
          max-width: 100%;
      }
      
      body.rounds-stats-page .gl-section__body {
          padding: 12px 10px;
      }
      
      /* gl-stat-grid 반응형 */
      body.rounds-stats-page .gl-stat-grid {
          grid-template-columns: repeat(3, 1fr);
          gap: 0.4rem;
      }
      
      body.rounds-stats-page .gl-stat-card {
          padding: 0.5rem 0.4rem;
      }
      
      body.rounds-stats-page .gl-stat-title {
          font-size: 0.65rem;
      }
      
      body.rounds-stats-page .gl-stat-value {
          font-size: 1.2rem;
      }
      
      /* 필터 버튼 반응형 */
      body.rounds-stats-page .gl-scroll-wrap {
          width: 100%;
          overflow-x: auto;
          -webkit-overflow-scrolling: touch;
      }
      
      body.rounds-stats-page .gl-scroll-nav {
          display: none; /* 모바일에서는 화살표 버튼 숨김 */
      }
      
      /* 폼 요소 반응형 */
      body.rounds-stats-page .form-select,
      body.rounds-stats-page .form-control {
          font-size: 0.85rem;
      }
      
      body.rounds-stats-page .row {
          margin-left: -0.25rem;
          margin-right: -0.25rem;
      }
      
      body.rounds-stats-page .row > * {
          padding-left: 0.25rem;
          padding-right: 0.25rem;
      }
      
      /* 버튼 그룹 반응형 */
      body.rounds-stats-page .btn-group {
          flex-wrap: wrap;
      }
      
      body.rounds-stats-page .btn-group .btn {
          font-size: 0.8rem;
          padding: 0.4rem 0.6rem;
      }
  }
  
  /* 뷰포트 높이 1080px 이하일 때 콘텐츠 잘림 방지 */
  @media (min-width: 992px) and (max-height: 1080px) {
      body.index-page .hero-section {
          margin-top: 60px !important;
          min-height: auto !important;
          height: auto !important;
          align-items: flex-start !important;
          padding-top: 2rem !important;
          padding-bottom: 2rem !important;
          overflow-x: hidden !important;
          overflow-y: auto !important;
      }
      
      body.index-page .hero-content {
          margin-top: 2rem !important;
          margin-bottom: 2rem !important;
      }
  }
  
  @media (max-width: 991px) {
      /* 모바일에서는 PC 탑바 숨김 */
      body.index-page .landing-top-nav {
          display: none !important;
      }
  
      /* Hero 섹션: 상단 고정 네비(#topNavbar, height 60px) 존재를 전제로 padding-top: 60px 유지 */
      body.index-page .hero-section {
          margin-top: 0;
          padding-top: 60px;
      }
  
      body.index-page #sidebar {
          display: none !important;
      }
      
      body.index-page .sidebar-overlay {
          display: none !important;
      }
      
      /* 모바일 네비게이션 바 표시 (랜딩페이지에서만) */
      body.index-page #topNavbar {
          display: flex !important;
          position: fixed !important;
          top: 0 !important;
          left: 0 !important;
          right: 0 !important;
          z-index: 1000 !important;
          background: white !important;
      }
      
      /* 모바일 사이드바 기본 숨김 (햄버거 메뉴 클릭 시 표시) */
      body.index-page .mobile-sidebar {
          display: block !important;
          left: -200px !important;
          visibility: visible !important;
          position: fixed !important;
          z-index: 999 !important;
      }
      
      body.index-page .mobile-sidebar.active {
          left: 0 !important;
          visibility: visible !important;
      }
      
      /* 모바일 사이드바 오버레이 기본 숨김 */
      body.index-page .mobile-sidebar-overlay {
          display: none !important;
      }
      
      body.index-page .mobile-sidebar-overlay.active {
          display: block !important;
      }
  }

  /* 모바일: 랜딩 네비 적용 페이지 여백 축소 */
  @media (max-width: 991px) {
      /* rounds-stats-page는 제외 (중간사이즈에서 padding-top 필요) */
      body.landing-nav-page:not(.rounds-stats-page) .ops-container {
          padding: 0.5rem 0.5rem 4rem !important;
      }
      /* 마이페이지: 하단 여백 축소 */
      body.my-page.landing-nav-page .ops-container {
          padding-bottom: 1rem !important;
      }
      /* 홈/일정 페이지: 하단 여백 제거 */
      body.home-page.landing-nav-page .ops-container,
      body.schedule-page.landing-nav-page .ops-container {
          padding-bottom: 0 !important;
      }
      /* rounds-stats-page의 .p-2.p-md-3는 중간사이즈에서 padding-top 필요하므로 제외 */
      body.landing-nav-page:not(.rounds-stats-page) .p-2.p-md-3 {
          padding: 0.1rem !important;
      }
  }

  /* 모바일: 강제 여백 축소(최후 우선순위) */
  @media (max-width: 991px) {
      body.landing-nav-page .app-content .main-content .p-2,
      body.landing-nav-page .app-content .main-content .p-3 {
          padding: 0.1rem !important;
      }
      /* rounds-stats-page의 .p-2.p-md-3는 중간사이즈에서 padding-top 필요하므로 제외 */
      body.landing-nav-page:not(.rounds-stats-page) .app-content .main-content .p-2.p-md-3 {
          padding: 0.1rem !important;
      }
      /* rounds-stats-page는 제외 (중간사이즈에서 padding-top 필요) */
      body.landing-nav-page:not(.rounds-stats-page) .ops-container {
          padding: 0.5rem 0.5rem 4rem !important;
      }
      /* 마이페이지: 하단 여백 축소 */
      body.my-page.landing-nav-page .ops-container {
          padding-bottom: 1rem !important;
      }
      /* 홈/일정 페이지: 하단 여백 제거 */
      body.home-page.landing-nav-page .ops-container,
      body.schedule-page.landing-nav-page .ops-container {
          padding-bottom: 0 !important;
      }
  }
  
  /* 중간사이즈: 통계 탭(rounds-stats-page) - 일원화 (상단 간격은 공통 .top-sub-menu + * margin-top 사용) */
  @media (min-width: 769px) and (max-width: 991px) {
      /* app-content padding-top 제거 (18px + margin-top 116px 이중 적용 막음) */
      body.rounds-stats-page.landing-nav-page .app-content {
          padding-top: 0 !important;
      }
      /* 하단네비 여유만 유지 (좌/우/상단은 공통 규칙·rounds-stats 기본값 사용) */
      body.rounds-stats-page.landing-nav-page .main-content > .top-sub-menu + .p-2.p-md-3,
      body.rounds-stats-page.landing-nav-page .main-content > .top-sub-menu ~ .p-2.p-md-3 {
          padding-bottom: 4rem !important;
      }
  }
  
  /* (주석 인코딩 깨짐: 내용 복구 필요) */
  .footer {
      background: var(--landing-primary-dark-navy);
      text-align: center;
      padding: 2rem 1rem;
      color: var(--landing-text-light);
      font-size: 0.9rem;
  }

/* ============================================
   네비게이션 바 스타일 (navbar.php용)
   ============================================ */
.navbar {
    background: white;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: 0;
    z-index: 999;
    padding: 0;
    margin: 0;
    width: 100%;
}

.navbar .container-fluid {
    padding: 0.5rem 1rem;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
    width: 100%;
}

.navbar .navbar-nav {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0;
    margin-left: auto;
}

/* PC 모드 네비게이션 바 높이 증가 (모바일보다 더 크게) */
@media (min-width: 992px) {
    .navbar {
        min-height: 3.5rem;
        padding: 0.5rem 0;
    }
    .navbar .container-fluid {
        padding: 0.5rem 1.5rem;
        min-height: 3.5rem;
    }
    /* PC 모드에서 햄버거 메뉴 버튼 숨기기 (동호회 관리 페이지용) */
    .sidebar-toggle {
        display: none !important;
    }
    /* user 페이지(ops-ui)에서는 표시 */
    body.ops-ui .sidebar-toggle {
        display: flex !important;
    }
}

/* 모바일 네비게이션 (round.php와 동일 스타일) */
@media (max-width: 991px) {
    /* 모바일에서 기존 초록색 sidebar 숨기기 (navbar.php의 밝은 계열 mobile-sidebar만 사용) */
    #sidebar,
    .sidebar-overlay {
        display: none !important;
    }
    
    #topNavbar {
        position: fixed !important;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(20px);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        padding: 0.8rem 0.5rem;
        min-height: 2.5rem;
        height: auto;
        transition: transform 0.3s ease-in-out;
        transform: translateY(0);
    }
    
    /* 스크롤 시 네비게이션바 숨김 */
    #topNavbar.navbar-hidden {
        transform: translateY(-100%);
    }
    
    /* 네비게이션바 아래 콘텐츠가 덮이지 않도록 여백 설정 */
    /* 네비게이션 바 높이: 실제 높이는 약 56-60px 정도 */
    /* .main-content에 padding-top 주면 네비 위에 갭 생김 → 네비 다음 형제에만 margin-top 적용 */
    body.landing-nav-page .main-content {
        padding-top: 0 !important;
    }
    
    body.landing-nav-page .app-content {
        padding-top: 18px !important; /* 기본 padding만 유지 */
    }
    
    body.landing-nav-page .content-wrap {
        padding-top: 0 !important;
    }
    
    /* landing-nav-page의 경우: 네비게이션 바 다음 요소에 초기 margin-top 설정 (JavaScript가 실행되기 전에도 보호) */
    /* 매우 구체적인 선택자로 모든 경우를 커버 - 최우선 적용 (p-2/p-3/p-4 등 본문 래퍼 클래스 모두 포함) */
    body.landing-nav-page .main-content #topNavbar + div,
    body.landing-nav-page .main-content #topNavbar + div.p-2,
    body.landing-nav-page .main-content #topNavbar + div.p-3,
    body.landing-nav-page .main-content #topNavbar + div.p-md-3,
    body.landing-nav-page .main-content #topNavbar + div.p-md-4,
    body.landing-nav-page .main-content #topNavbar ~ div.p-2,
    body.landing-nav-page .main-content #topNavbar ~ div.p-3,
    body.landing-nav-page .main-content #topNavbar ~ div.p-md-3,
    body.landing-nav-page .main-content #topNavbar ~ div.p-md-4,
    body.landing-nav-page .main-content > #topNavbar + div {
        margin-top: 60px !important; /* 초기값, JavaScript에서 실제 높이로 조정 */
    }
    
    /* 추가 보호: 모든 div 요소에 적용 */
    @media (max-width: 991px) {
        body.landing-nav-page .main-content #topNavbar + * {
            margin-top: 60px !important;
        }
    }
    
    /* 일반 페이지의 경우: 본문 콘텐츠에 padding-top 적용 */
    body:not(.index-page):not(.landing-nav-page) .main-content {
        padding-top: 60px !important;
    }
    
    body:not(.index-page):not(.landing-nav-page) .app-content {
        padding-top: calc(18px + 60px) !important;
    }
    
    body:not(.index-page):not(.landing-nav-page) .ops-container {
        padding-top: calc(10px + 60px) !important;
    }
    
    body:not(.index-page):not(.landing-nav-page) .content-wrap {
        padding-top: 60px !important;
    }
    
    /* ============================================
       탑 서브 메뉴 - 점선 완전 제거 (모든 화면 크기)
       ============================================ */
    .top-sub-menu,
    .top-sub-menu *,
    .top-sub-menu-mobile,
    .top-sub-menu-mobile *,
    .top-sub-menu .nav-tabs,
    .top-sub-menu .nav-tabs *,
    .top-sub-menu-mobile .nav-tabs,
    .top-sub-menu-mobile .nav-tabs *,
    .top-sub-menu .nav-item,
    .top-sub-menu-mobile .nav-item {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }
    
    /* top-sub-menu-btn는 border 제거하되, active 상태의 border-bottom은 유지 */
    .top-sub-menu-btn {
        outline: none !important;
        border: none !important;
        box-shadow: none !important;
    }
    
    .top-sub-menu-btn.active,
    .top-sub-menu-btn.btn-primary.active,
    .top-sub-menu-btn.btn-outline-dark.active {
        border-bottom: 3px solid #0d6efd !important; /* active 상태의 border-bottom만 유지 */
    }
    
    /* 상단 서브 메뉴 스타일 (통합) */
    .top-sub-menu {
        transition: top 0.3s ease-in-out, background-color 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        overflow-y: hidden !important; /* 세로 스크롤바 방지 */
    }
    
    /* 769px~991px 사이에서 탑 서브 메뉴가 네비게이션 아래에 보이도록 */
    @media (min-width: 769px) and (max-width: 991px) {
        .top-sub-menu {
            position: fixed !important;
            left: 0 !important;
            right: 0 !important;
            z-index: 999 !important;
            background-color: rgb(255, 255, 255) !important;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
            overflow-y: hidden !important;
            overflow-x: hidden !important;
            max-height: none !important;
            height: auto !important;
        }
        
        .top-sub-menu .top-sub-menu-mobile {
            justify-content: center !important;
            align-items: center !important;
            overflow-y: hidden !important;
            overflow-x: auto !important;
            max-height: none !important;
            height: auto !important;
        }
        
        .top-sub-menu .nav-tabs,
        .top-sub-menu-mobile .nav-tabs {
            overflow-y: hidden !important;
            overflow-x: auto !important;
            max-height: none !important;
            height: auto !important;
        }
        
        /* 사이드바가 열려있을 때는 사이드바가 탑서브메뉴 위에 표시되도록 */
        body:has(.sidebar.show) .top-sub-menu {
            z-index: 998 !important;
        }
        
        /* 중간사이즈: 탑서브메뉴 페이지에서 main-content padding-top 제거 (x2 방지) */
        /* 본문 margin-top만 사용하므로 padding 60px + margin 116px 이중 적용 막음 */
        body:not(.index-page):not(.landing-nav-page) .main-content:has(.top-sub-menu) {
            padding-top: 0 !important;
        }
        
        /* 중간사이즈: 탑서브메뉴 본문 margin-top (라운드/스태프/통계 일원화) */
        body:not(.index-page) .main-content > .top-sub-menu + *,
        body:not(.index-page) .main-content > .top-sub-menu ~ * {
            margin-top: 116px; /* navbar ~56px + 탑서브 ~60px, JS가 정확값으로 override 가능 */
        }
    }
    
    /* 모든 화면 크기에서 사이드바가 열려있을 때 탑서브메뉴 위에 표시되도록 */
    .sidebar.show {
        z-index: 1001 !important;
    }
    
    .sidebar-overlay.show {
        z-index: 1000 !important;
    }
    
    /* 모바일에서도 사이드바가 탑서브메뉴 위에 표시되도록 */
    @media (max-width: 991px) {
        .sidebar.show {
            z-index: 1001 !important;
        }
        
        .sidebar-overlay.show {
            z-index: 1000 !important;
        }
        
        .top-sub-menu {
            z-index: 999 !important;
        }
        
        body:has(.sidebar.show) .top-sub-menu {
            z-index: 998 !important;
        }
        
        /* 본문이 탑 서브 메뉴 아래에 나타나도록 - 여백 제거 (모바일 768px 이하만) */
        /* 769~991px 중간사이즈에서는 margin-top: 0 적용 안 함 → JS가 navbar+탑서브 높이만큼 margin-top 설정 */
        @media (max-width: 768px) {
            .top-sub-menu + *,
            .top-sub-menu ~ * {
                margin-top: 0 !important;
            }
            body:not(.index-page):not(.dashboard-page) .main-content > .top-sub-menu + *,
            body:not(.index-page):not(.dashboard-page) .main-content > .top-sub-menu ~ * {
                margin-top: 0 !important;
            }
            body.landing-nav-page .main-content > .top-sub-menu + *,
            body.landing-nav-page .main-content > .top-sub-menu ~ * {
                margin-top: 0 !important;
            }
        }
        
        /* 본문 영역의 세로 스크롤바 방지 */
        body.rounds-stats-page .main-content,
        body.rounds-stats-page .app-content,
        body.rounds-stats-page .content-wrap,
        body.rounds-stats-page .ops-container {
            overflow-y: visible !important;
            overflow-x: hidden !important;
            max-height: none !important;
            height: auto !important;
        }
    }
    
    /* 기존 mobile-navbar 스타일 유지 (하위 호환성) */
    .navbar.mobile-navbar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(20px);
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
        padding: 0.8rem 0.5rem;
        min-height: 2.5rem;
        height: auto;
        transition: transform 0.3s ease-in-out;
        transform: translateY(0);
    }
    
    .navbar.mobile-navbar.navbar-hidden {
        transform: translateY(-100%);
    }
    
    .navbar.mobile-navbar .container-fluid {
        display: grid;
        grid-template-columns: 36px 1fr auto;
        align-items: center;
        gap: 0.2rem;
        position: relative;
        padding: 0 0.5rem !important;
        height: 100%;
        min-height: auto;
    }
    
    /* 모바일 네비게이션바의 container-fluid padding 오버라이드 */
    #topNavbar .container-fluid {
        padding: 0 0.5rem !important;
    }
    
    .navbar.mobile-navbar .navbar-nav {
        gap: 0;
        margin-right: 0;
    }
    
    .navbar.mobile-navbar .mobile-logo-section {
        display: flex;
        align-items: center;
        vertical-align: middle;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    /* 모바일에서 햄버거/오른쪽 아이콘도 정확히 세로 중앙 정렬 */
    .navbar.mobile-navbar .sidebar-toggle,
    .navbar.mobile-navbar .navbar-icon-btn {
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

.navbar-icon-btn {
    transition: transform 0.2s ease;
}

.navbar-icon-btn:hover {
    transform: scale(1.1);
    opacity: 0.8;
}

.navbar-icon-btn:active {
    transform: scale(0.95);
}

.sidebar-toggle {
    background: none;
    border: none;
    padding: 0.5rem;
    font-size: 1.5rem;
    color: #333;
    cursor: pointer;
    outline: none;
    box-shadow: none;
    z-index: 10000;
}

.sidebar-toggle:focus {
    outline: none;
    box-shadow: none;
}

.sidebar-toggle:hover {
    opacity: 0.7;
}

/* 모바일에서 사이드바 토글 버튼 크기 줄이기 */
@media (max-width: 991px) {
    .sidebar-toggle {
        padding: 0.25rem !important;
        font-size: 1.1rem !important;
    }
    
    .navbar-icon-btn {
        padding: 0.2rem !important;
        font-size: 1rem !important;
    }
}

/* 골프라운지 로고 및 텍스트 스타일 */
.golf-logo-glow {
    width: 24px;
    height: 24px;
    background: linear-gradient(135deg, #1e3c72 0%, #2a5298 50%, #7e8ba3 100%);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 15px rgba(30, 60, 114, 0.6), 
                0 0 30px rgba(42, 82, 152, 0.4),
                inset 0 2px 4px rgba(255, 255, 255, 0.3);
    position: relative;
    animation: logoPulse 2s ease-in-out infinite;
}

.golf-logo-glow::before {
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background: linear-gradient(45deg, #00d4ff, #5b86e5, #36d1dc, #5b86e5);
    border-radius: 8px;
    z-index: -1;
    opacity: 0.7;
    animation: logoRotate 3s linear infinite;
}

.golf-logo-glow i {
    font-size: 14px;
    color: #fff;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.8),
                 0 0 20px rgba(0, 212, 255, 0.6);
    animation: logoShine 2s ease-in-out infinite;
}

.golf-text-gradient {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    text-shadow: none;
    animation: gradientShift 3s ease infinite;
    filter: drop-shadow(0 2px 4px rgba(102, 126, 234, 0.3));
    position: relative;
    display: flex;
    align-items: center;
    line-height: 1;
}

.mobile-logo-text {
    font-size: 1rem;
    font-weight: 700;
}

.golf-text-gradient::after {
    content: "골프라운지";
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    opacity: 0.5;
    z-index: -1;
    filter: blur(2px);
    animation: gradientShift 3s ease infinite;
}

@keyframes logoPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 15px rgba(30, 60, 114, 0.6), 
                    0 0 30px rgba(42, 82, 152, 0.4),
                    inset 0 2px 4px rgba(255, 255, 255, 0.3);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 20px rgba(30, 60, 114, 0.8), 
                    0 0 40px rgba(42, 82, 152, 0.6),
                    inset 0 2px 4px rgba(255, 255, 255, 0.4);
    }
}

@keyframes logoRotate {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes logoShine {
    0%, 100% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0.8;
        transform: scale(1.1);
    }
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* 쪽지 모달: 탭 메뉴와 목록 사이 간격 제거 및 반응형 스타일 */
#messageModal .nav-tabs {
    margin-bottom: 0 !important;
}
#messageModal .tab-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
#messageModal .tab-pane {
    padding-top: 0 !important;
}
#messageModal #receivedMessages,
#messageModal #sentMessages {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 쪽지 모달 반응형 스타일 (관리자 페이지 기준) - 세로 크기 소폭 축소 */
@media (max-width: 991px) {
    #messageModal .modal-body {
        min-height: calc(100vh - 115px) !important;
        max-height: calc(100vh - 95px) !important;
    }
    /* 내부 콘텐츠(쪽지 목록/작성)만 세로 확대, 모달 창 크기는 유지 */
    #messageModal #receivedMessages,
    #messageModal #sentMessages {
        min-height: calc(100vh - 190px) !important;
        max-height: calc(100vh - 190px) !important;
    }
    #messageModal #compose {
        min-height: calc(100vh - 190px) !important;
    }
}

/* 백드롭은 모달보다 아래에 두기 (클릭이 모달에 전달되도록) */
body > .modal-backdrop {
    z-index: 1040 !important;
}
body > .modal-backdrop:last-of-type {
    z-index: 1050 !important;
}

/* 모든 Bootstrap 모달: 백드롭(1050)보다 위에 표시되어 클릭·포커스 가능 */
body > .modal.show,
.modal.show {
    z-index: 1060 !important;
    pointer-events: auto !important;
}
body > .modal.show .modal-dialog,
body > .modal.show .modal-content,
.modal.show .modal-dialog,
.modal.show .modal-content {
    pointer-events: auto !important;
}

/* 게시글 보기 모달 */
#postViewModal.modal.show {
    z-index: 1060 !important;
    pointer-events: auto !important;
}
#postViewModal.modal.show .modal-dialog,
#postViewModal.modal.show .modal-content {
    pointer-events: auto !important;
}

/* 멤버정보/쪽지 모달: 다른 모달 위에서 열릴 때 */
#memberInfoModal.modal.show,
#messageModal.modal.show {
    z-index: 1070 !important;
    pointer-events: auto !important;
}
#memberInfoModal.modal.show .modal-dialog,
#memberInfoModal.modal.show .modal-content,
#messageModal.modal.show .modal-dialog,
#messageModal.modal.show .modal-content {
    pointer-events: auto !important;
}

/* 쪽지 모달: 마이페이지 등에서 뷰포트 기준 중앙 배치(아래로 치우침 방지) */
#messageModal.modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    overflow-x: hidden;
    overflow-y: auto;
}
#messageModal.modal .modal-dialog {
    margin: 1.75rem auto !important;
    min-height: auto;
}

/* ============================================
   사용자 페이지 공통 스타일 (home.php, schedule.php, my.php 등)
   ============================================ */

/* 라운드 아이템 */
.round-item {
    padding: 0.75rem;
    border-bottom: 1px solid var(--ops-line);
    cursor: pointer;
    transition: background-color 0.2s;
}

.round-item:hover {
    background-color: rgba(14, 59, 46, 0.05);
}

.round-item:last-child {
    border-bottom: none;
}

/* 프로필 이미지 */
.profile-image {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--ops-line);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.profile-image[style*="cursor: pointer"]:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.profile-placeholder {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ops-green), #15803D);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    flex-shrink: 0;
}

/* 활동 아이템 */
.activity-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--ops-line);
}

.activity-item:last-child {
    border-bottom: none;
}

/* 설정 아이템 */
.setting-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.875rem 0;
    border-bottom: 1px solid var(--ops-line);
    cursor: pointer;
    transition: background-color 0.2s;
}

.setting-item:last-child {
    border-bottom: none;
}

.setting-item:hover {
    background-color: rgba(14, 59, 46, 0.05);
    margin: 0 -12px;
    padding-left: 12px;
    padding-right: 12px;
}

/* 상태 배지 */
.status-badge {
    display: inline-block;
    padding: 0.25rem 0.5rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.status-badge.status-00 {
    background-color: #e3f2fd;
    color: #1976d2;
}

.status-badge.status-01 {
    background-color: #fff3e0;
    color: #f57c00;
}

.status-badge.status-02,
.status-badge.status-03 {
    background-color: #e8f5e9;
    color: #388e3c;
}

.status-badge.status-99 {
    background-color: #ffebee;
    color: #d32f2f;
}

/* 연단체 일정 배지 (사전공지/본공지=연하게, 라운드예정) - 일자 배경색과 동일 톤 */
.status-badge.status-annual-pre {
    background-color: #f5f1fa;
    color: #9575cd;
}
.status-badge.status-annual-main {
    background-color: #faf0fb;
    color: #ba68c8;
}
.status-badge.status-annual-round {
    background-color: #e8eaf6;
    color: #5c6bc0;
}

/* 작업 아이템 */
.task-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem;
    border-bottom: 1px solid var(--ops-line);
    cursor: pointer;
    transition: background-color 0.2s;
}

.task-item:hover {
    background-color: rgba(14, 59, 46, 0.05);
}

.task-item:last-child {
    border-bottom: none;
}

.task-item .badge {
    background-color: var(--ops-green);
    color: white;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

/* 게시글 아이템 */
.post-item {
    padding: 0.75rem;
    border-bottom: 1px solid var(--ops-line);
    cursor: pointer;
    transition: background-color 0.2s;
}

.post-item:hover {
    background-color: rgba(14, 59, 46, 0.05);
}

.post-item:last-child {
    border-bottom: none;
}

.new-badge {
    display: inline-block;
    background-color: #F2C94C;
    color: #1F2937;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.4rem;
    border-radius: 10px;
    margin-left: 0.5rem;
    vertical-align: middle;
}

.notice-badge {
    display: inline-block;
    background-color: #E11D48;
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.4rem;
    border-radius: 10px;
    vertical-align: middle;
}

/* 캘린더 스타일 */
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0.5rem 0;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.25rem;
}

.calendar-day-header {
    text-align: center;
    font-weight: 700;
    font-size: 0.85rem;
    color: var(--ops-muted);
    padding: 0.5rem 0;
}
.calendar-day-header:first-child {
    color: #d32f2f;
}
.calendar-day-header:last-child {
    color: #1976d2;
}

.calendar-day {
    aspect-ratio: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 0.25rem;
    border: 1px solid var(--ops-line);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s;
    background-color: var(--ops-card);
    position: relative;
}

.calendar-day:hover {
    background-color: rgba(14, 59, 46, 0.05);
    border-color: var(--ops-green);
}

.calendar-day.today {
    background-color: rgba(14, 59, 46, 0.1);
    border-color: var(--ops-green);
    font-weight: 700;
}

.calendar-day.selected {
    background-color: var(--ops-green);
    color: white;
    border-color: var(--ops-green);
}

.calendar-day.has-rounds {
    border-color: var(--ops-green);
}

.calendar-day span {
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

/* 요일·공휴일 폰트 색상: 토요일 파란색, 일요일·공휴일 빨간색 */
.calendar-day.saturday span {
    color: #1976d2;
}
.calendar-day.sunday span,
.calendar-day.holiday span {
    color: #d32f2f;
}
.calendar-day.selected span {
    color: white;
}

/* 라운드 점 표시 */
.round-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

.round-dot.status-00 {
    background-color: #1976d2;
}

.round-dot.status-01 {
    background-color: #f57c00;
}

.round-dot.status-02,
.round-dot.status-03 {
    background-color: #388e3c;
}

.round-dot.status-99 {
    background-color: #d32f2f;
}

/* 연단체 일정 (라운드 예정/사전공지/본공지) */
.round-dot.status-A {
    background-color: #5c6bc0;
}

/* 라운드 카드 */
.round-card {
    padding: 0.75rem;
    border: 1px solid var(--ops-line);
    border-radius: 8px;
    margin-bottom: 0.75rem;
    cursor: pointer;
    transition: all 0.2s;
    background-color: var(--ops-card);
}

.round-card:hover {
    background-color: rgba(14, 59, 46, 0.05);
    border-color: var(--ops-green);
    box-shadow: 0 2px 8px rgba(14, 59, 46, 0.1);
}

.round-card:last-child {
    margin-bottom: 0;
}

.round-card.round-card--annual {
    cursor: default;
}

.round-card.round-card--annual:hover {
    background-color: var(--ops-card);
    border-color: var(--ops-line);
    box-shadow: none;
}

/* 모바일 반응형 */
@media (max-width: 991px) {
    .calendar-day {
        padding: 0.15rem;
        font-size: 0.8rem;
    }
    
    .calendar-day span {
        font-size: 0.8rem;
    }
    
    .round-dot {
        width: 5px;
        height: 5px;
    }
    
    .round-card {
        padding: 0.5rem;
    }
}

/* ============================================
   동호회 카드 가로 스크롤 (my_groups.php)
   ============================================ */
.groups-scroll-container {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
    padding: 0.5rem 0;
    position: relative;
}

.groups-scroll-container::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

.groups-scroll-wrapper-inner {
    display: flex;
    gap: 1rem;
    padding: 0 0.5rem;
    min-width: min-content;
}

.group-card-item {
    flex: 0 0 auto;
    width: 200px;
    min-width: 200px;
    max-width: 200px;
}

.group-card-item .card {
    transition: transform 0.2s, box-shadow 0.2s;
    border: 1px solid var(--ops-line);
}

.group-card-item .card:hover {
    transform: translateY(-4px);
    box-shadow: 0 4px 12px rgba(14, 59, 46, 0.15);
}

/* 스크롤 인디케이터 (화살표 버튼) */
.groups-scroll-wrapper {
    position: relative;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.gl-section__body .groups-scroll-wrapper {
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 32px);
}

@media (min-width: 992px) {
    .gl-section__body .groups-scroll-wrapper {
        margin-left: -32px;
        margin-right: -32px;
        width: calc(100% + 64px);
    }
}

.groups-scroll-wrapper .scroll-indicator {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--ops-line);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    opacity: 0;
    pointer-events: none;
}

.groups-scroll-wrapper .scroll-indicator.visible {
    opacity: 1;
    pointer-events: auto;
}

.groups-scroll-wrapper .scroll-indicator:hover {
    background: var(--ops-green);
    color: white;
    border-color: var(--ops-green);
    box-shadow: 0 4px 12px rgba(14, 59, 46, 0.3);
    transform: translateY(-50%) scale(1.1);
}

.groups-scroll-wrapper .scroll-indicator.left {
    left: 0;
}

.groups-scroll-wrapper .scroll-indicator.right {
    right: 0;
}

/* card-body 내부에서 groups-scroll-wrapper 정렬 보정 */
.card-body .groups-scroll-wrapper {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
    position: relative;
}

.groups-scroll-wrapper .scroll-indicator i {
    font-size: 1rem;
    color: var(--ops-green);
    transition: color 0.3s;
}

.groups-scroll-wrapper .scroll-indicator:hover i {
    color: white;
}

/* 페이드 효과 (스크롤 가능한 방향 표시) */
.groups-scroll-container.fade-left::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    background: linear-gradient(to right, rgba(246, 247, 249, 0.95), transparent);
    pointer-events: none;
    z-index: 5;
}

.groups-scroll-container.fade-right::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 30px;
    background: linear-gradient(to left, rgba(246, 247, 249, 0.95), transparent);
    pointer-events: none;
    z-index: 5;
}

/* 모바일 반응형 */
@media (max-width: 991px) {
    .group-card-item {
        width: 160px;
        min-width: 160px;
        max-width: 160px;
    }
    
    .groups-scroll-wrapper .scroll-indicator {
        width: 36px;
        height: 36px;
    }
    
    .groups-scroll-wrapper .scroll-indicator.left {
        left: 5px;
    }
    
    .groups-scroll-wrapper .scroll-indicator.right {
        right: 5px;
    }
    
    .groups-scroll-wrapper .scroll-indicator i {
        font-size: 0.9rem;
    }
}

/* =========================
   Section Header Gradient (Auto Sequence)
   - header only
   - repeat every 5 sections
========================= */

.gl-sections {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 1rem;
}

@media (min-width: 992px) {
    .gl-sections {
        grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    }
}

body.rankings-page .gl-sections,
body.rankings-page .gl-section,
body.rankings-page .gl-section__body {
    min-width: 0;
}

body.rankings-page .gl-sections {
    grid-template-columns: 1fr;
    width: 100%;
}

@media (max-width: 575.98px) {
    body.rankings-page .gl-sections {
        grid-template-columns: 1fr;
    }
 
    body.rankings-page .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
 
    body.rankings-page table {
        width: 100%;
    }
}

/* my_groups: 섹션 레이아웃은 항상 1열 고정 */
body.my-groups-page .gl-sections{
  grid-template-columns: 1fr;
}

.gl-section {
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,0.06);
    background: #fff;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    height: 100%;
}

.gl-section__header {
    padding: 12px 16px;
    color: #ffffff;
    font-weight: 700;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* 1) Green */
.gl-sections > .gl-section:nth-child(5n+1) > .gl-section__header,
.row .gl-section:nth-child(5n+1) > .gl-section__header,
.gl-section:nth-of-type(5n+1) > .gl-section__header {
  background: linear-gradient(135deg, #43A047 0%, #66BB6A 100%);
}

/* 2) Blue */
.gl-sections > .gl-section:nth-child(5n+2) > .gl-section__header,
.row .gl-section:nth-child(5n+2) > .gl-section__header,
.gl-section:nth-of-type(5n+2) > .gl-section__header {
  background: linear-gradient(135deg, #1E88E5 0%, #42A5F5 100%);
}

/* 3) Purple */
.gl-sections > .gl-section:nth-child(5n+3) > .gl-section__header,
.row .gl-section:nth-child(5n+3) > .gl-section__header,
.gl-section:nth-of-type(5n+3) > .gl-section__header {
  background: linear-gradient(135deg, #7E57C2 0%, #9575CD 100%);
}

/* 4) Mint */
.gl-sections > .gl-section:nth-child(5n+4) > .gl-section__header,
.row .gl-section:nth-child(5n+4) > .gl-section__header,
.gl-section:nth-of-type(5n+4) > .gl-section__header {
  background: linear-gradient(135deg, #00897B 0%, #26A69A 100%);
}

/* 5) Orange */
.gl-sections > .gl-section:nth-child(5n+5) > .gl-section__header,
.row .gl-section:nth-child(5n+5) > .gl-section__header,
.gl-section:nth-of-type(5n+5) > .gl-section__header {
  background: linear-gradient(135deg, #FB8C00 0%, #FFB74D 100%);
}

/* gl-sections 밖에 있는 단독 gl-section(첫 번째 섹션) - Deep Brand Green Gradient 폰트 사이즈를 1단계 크게 */
.gl-section:not(.gl-sections > .gl-section) > .gl-section__header {
    background: linear-gradient(135deg, #6472df 0%, #8694ec 100%);
    font-size: 16px;
}

.gl-section__body {
    padding: 16px;
    flex: 1;
}

/* 라운드정보 섹션: 아래 섹션과의 간격 넓힘 */
.round-info-section {
    margin-bottom: 1.25rem;
}

/* =========================
   OPS UI - Card/Table/Filter Standards
========================= */
.gl-section__title {
    font-weight: 700;
    font-size: 0.95rem;
}

.gl-section__actions .btn {
    font-size: 0.75rem;
    font-weight: 600;
}

.gl-card-pastel-1 {
    background: #DCEBFF;
}

.gl-card-pastel-2 {
    background: #FFE2C5;
}

.gl-card-pastel-3 {
    background: #D7F2E4;
}

.gl-card-pastel-4 {
    background: #E2DDFF;
}

.gl-card-pastel-5 {
    background: #FFE0EE;
}

.gl-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.gl-stat-grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 991px) {
    .gl-stat-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.4rem;
    }
    .gl-stat-grid--4 {
        grid-template-columns: repeat(4, 1fr);
    }
}

.gl-stat-card {
    border-radius: 12px;
    padding: 0.6rem 0.5rem;
    text-align: center;
    border: 1px solid rgba(0, 0, 0, 0.04);
}

.gl-stat-title {
    font-size: 0.7rem;
    color: #475569;
    margin-bottom: 0.2rem;
    font-weight: 600;
}

.gl-stat-value {
    font-size: 1.1rem;
    font-weight: 800;
    color: #0f172a;
}

.gl-stat-value--lg {
    font-size: 1.6rem;
}

.gl-mini-card {
    border-radius: 12px;
    padding: 0.7rem;
    text-align: center;
    color: #FFFFFF;
}

.gl-mini-title {
    font-size: 0.72rem;
    margin-bottom: 0.35rem;
    opacity: 0.9;
    font-weight: 600;
}

.gl-mini-value {
    font-size: 1.35rem;
    font-weight: 800;
}

@media (max-width: 991px) {
    .gl-mini-card {
        padding: 0.6rem;
    }
    .gl-mini-title {
        font-size: 0.65rem;
    }
    .gl-mini-value {
        font-size: 1.1rem;
    }
}

.gl-table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.gl-table thead th {
    background: #F1F5F9;
    color: #334155;
    font-weight: 700;
    font-size: 0.78rem;
    border-bottom: 1px solid #E2E8F0;
    padding: 0.5rem 0.6rem;
    text-align: center;
}

.gl-table tbody td {
    padding: 0.55rem 0.6rem;
    border-bottom: 1px solid #F1F5F9;
    font-size: 0.82rem;
    color: #0f172a;
}

.gl-table tbody tr:nth-child(even) td {
    background: #FAFBFC;
}

.gl-table tbody tr:hover td {
    background: #F8FAFC;
}

.gl-table tbody tr.table-active td,
.gl-table tbody tr.active td,
.gl-table tbody tr.selected td {
    background: #C8DCFF !important;
}

.gl-table .gl-table-muted {
    color: #64748b;
}

.gl-table--compact thead th,
.gl-table--compact tbody td {
    padding: 0.4rem 0.5rem;
    font-size: 0.75rem;
}

/* 최근 라운드 테이블 좌우 여백 줄이기 */
.gl-recent-rounds-table {
    margin-left: -8px;
    margin-right: -8px;
}

@media (min-width: 992px) {
    .gl-recent-rounds-table {
        margin-left: -12px;
        margin-right: -12px;
    }
}

.gl-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.gl-filter-item {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.gl-filter-label {
    font-size: 0.72rem;
    font-weight: 700;
    color: #475569;
}

.gl-chip-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.gl-chip {
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #475569;
    border-radius: 999px;
    padding: 0.3rem 0.7rem;
    font-size: 0.72rem;
    font-weight: 600;
}

.gl-chip.is-active {
    background: #1E88E5;
    border-color: #1E88E5;
    color: #FFFFFF;
}

@media (max-width: 991px) {
    .gl-filter-grid {
        grid-template-areas:
            "group group"
            "period status";
        grid-template-columns: 2fr 1fr;
        gap: 0.6rem;
    }
    .gl-filter-item--group {
        grid-area: group;
    }
    .gl-filter-item--period {
        grid-area: period;
    }
    .gl-filter-item--status {
        grid-area: status;
    }
}

.gl-progress {
    height: 8px;
    border-radius: 6px;
    background: #E5E7EB;
    overflow: hidden;
}

.gl-progress__bar {
    height: 100%;
    background: #16a34a;
    width: 0;
    transition: width 0.3s ease;
}

.gl-progress__bar--gradient {
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
}

.gl-modal-iframe .modal-body {
    padding: 0.35rem;
}

/* 프로필 수정 모달 제외한 iframe 모달 기본 높이 */
.gl-modal-iframe:not(#profileEditModal) .modal-body iframe {
    width: 100%;
    border: none;
    height: 70vh;
}

@media (max-width: 991px) {
    .gl-modal-iframe:not(#profileEditModal) .modal-body iframe {
        height: 80vh;
    }
}

.gl-profile-modal-body {
    min-height: 700px;
    padding: 0;
    margin: 0;
    max-height: calc(90vh - 120px);
    overflow-y: auto;
}

.gl-profile-modal-iframe {
    width: 100%;
    height: 100%;
    border: none;
    margin: 0;
    padding: 0;
    display: block;
}

#profileEditModal .modal-body,
#profileEditModal.gl-modal-iframe .modal-body {
    padding: 0;
    padding-bottom: 0;
    padding-top: 0;
    margin-bottom: 0;
    margin-top: 0;
}

#profileEditModal .modal-header {
    margin-bottom: 0;
    padding-bottom: 0.5rem;
}

#profileEditModal .modal-content {
    padding-bottom: 0;
}

.modal .modal-header {
    background: linear-gradient(135deg, #6472df 0%, #8694ec 100%);
    color: #ffffff;
    border: none;
}

.modal .modal-header .btn-close {
    filter: invert(1);
}

.gl-modal-body-scroll {
    max-height: 500px;
    overflow-y: auto;
}

body.board-modal-view #post_view_detail_btn {
    display: none !important;
}

body.home-page #post_view_detail_btn {
    display: none !important;
}

body.board-modal-view .bottom-nav {
    display: none !important;
}

.modal-dialog {
    max-height: 90vh;
}

.modal-content {
    max-height: 90vh;
}

.modal-body {
    overflow-y: auto;
}

.gl-chip-scroll {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.gl-chip-scroll__track {
    display: flex;
    gap: 0.4rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding: 0.1rem 0;
    scrollbar-width: none;
}

.gl-chip-scroll__track::-webkit-scrollbar {
    display: none;
}

.gl-chip-scroll__nav {
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #475569;
}

.gl-chip-scroll__nav:disabled {
    opacity: 0.4;
}

.gl-scroll-wrap {
    position: relative;
}

.gl-section__body .gl-scroll-wrap {
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 32px);
}

@media (min-width: 992px) {
    .gl-section__body .gl-scroll-wrap {
        margin-left: -32px;
        margin-right: -32px;
        width: calc(100% + 64px);
    }
}

.gl-scroll-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    border: 1px solid #E2E8F0;
    background: #FFFFFF;
    color: #334155;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
}

.gl-scroll-nav.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.gl-scroll-nav.left {
    left: 0;
}

.gl-scroll-nav.right {
    right: 0;
}

.club-cards-scroll {
    display: flex;
    gap: 0.6rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    padding: 0.4rem 0.2rem;
    scrollbar-width: none;
}

.club-cards-scroll::-webkit-scrollbar {
    display: none;
}

.club-card-item {
    flex: 0 0 220px;
}

@media (max-width: 991px) {
    .club-card-item {
        flex: 0 0 48%;
    }
}

.gl-scroll-wrap .gl-chip-scroll__track {
    padding: 0.1rem 36px;
}

.gl-scroll-wrap .gl-chip-scroll__track .btn {
    min-width: 64px;
    padding: 0.2rem 0.45rem;
    font-size: 0.68rem;
    white-space: nowrap;
}

.gl-board-filter {
    display: flex;
    gap: 0.4rem;
    overflow-x: auto;
    flex-wrap: nowrap;
    scrollbar-width: none;
}

.gl-board-filter::-webkit-scrollbar {
    display: none;
}

.gl-board-filter .btn {
    font-size: 0.7rem;
    padding: 0.25rem 0.55rem;
    white-space: nowrap;
}

.gl-modal-iframe .gl-scroll-wrap {
    margin-left: -0.35rem;
    margin-right: -0.35rem;
}

body.board-modal-view .main-content {
    padding: 0;
    margin: 0;
}

body.board-modal-view .ops-container {
    padding: 0;
    margin: 0;
}

.gl-modal-iframe .modal-body {
    padding: 0.5rem;
}

/* 프로필 수정 모달: 가로 90%, 세로 90vh, 화면 중앙 정렬 */
#profileEditModal.modal {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-height: 100vh !important;
    height: 100% !important;
}
#profileEditModal .modal-dialog {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 90vw !important;
    width: 90% !important;
    max-height: 90vh !important;
    height: 90vh !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
}
#profileEditModal .modal-content {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    max-height: 90vh !important;
    height: 100% !important;
    min-height: 0 !important;
    flex: 1 1 auto !important;
}
#profileEditModal .modal-header {
    flex: 0 0 auto !important;
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    margin: 0 !important;
    border-bottom: none !important;
}
#profileEditModal .modal-body,
#profileEditModal .gl-profile-modal-body,
#profileEditModal.gl-modal-iframe .modal-body {
    flex: 1 1 0% !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    display: block !important;
    /* fallback: clientHeight 0 방지 */
    min-height: calc(90vh - 4rem) !important;
}
#profileEditModal .gl-profile-modal-iframe,
#profileEditModal iframe.gl-profile-modal-iframe {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
}

body.board-modal-view .gl-section {
    margin-bottom: 6px;
}

body.board-modal-view .gl-section__body {
    padding: 10px;
}

body.board-modal-view .gl-board-filter {
    margin-bottom: 6px;
    gap: 0.3rem;
}

.gl-btn-primary {
    background: linear-gradient(135deg, #6472df 0%, #8694ec 100%);
    color: #ffffff;
    border: none;
    border-radius: 10px;
    font-weight: 700;
}

.gl-btn-outline {
    background: #ffffff;
    border: 1px solid #E2E8F0;
    color: #334155;
    border-radius: 10px;
    font-weight: 700;
}

.gl-btn-danger {
    background: #FEE2E2;
    border: 1px solid #FCA5A5;
    color: #B91C1C;
    border-radius: 10px;
    font-weight: 700;
}

/* =========================
   PC Layout (>=992px)
========================= */
:root{
  --sidebar-w: 240px;
  --content-max: 1400px;
  --content-pad: 24px;
}

.app-shell{
  min-height: calc(100vh - 64px);
}

.app-sidebar{
  display: none;
}

.app-content{
  padding: 18px 16px;
}

@media (min-width: 992px){
  .app-shell{
    display: grid;
    grid-template-columns: var(--sidebar-w) 1fr;
    gap: 0;
  }

  /* 사이드바가 없을 때 전체 너비 사용 */
  .app-shell-no-sidebar{
    grid-template-columns: 1fr;
  }
  
  /* 사이드바가 없을 때 app-content가 전체 너비 사용 */
  .app-shell-no-sidebar .app-content{
    width: 100%;
    max-width: 100%;
  }
  
  /* 사이드바가 없을 때 main-content도 전체 너비 사용 */
  .app-shell-no-sidebar .main-content{
    width: 100%;
    max-width: 100%;
  }

  .app-sidebar{
    display: block;
    position: sticky;
    top: 64px;
    height: calc(100vh - 64px);
    padding: 16px 12px;
    border-right: 1px solid rgba(0,0,0,.06);
    background: #fff;
  }

  .app-content{
    padding: 24px;
  }

  .content-wrap{
    max-width: var(--content-max);
    margin: 0 auto;
  }

  /* 사이드바가 없을 때 content-wrap의 max-width 확대 또는 제거 */
  body.landing-nav-page .app-shell-no-sidebar .content-wrap,
  .app-shell-no-sidebar .content-wrap{
    max-width: none !important;
    width: 100% !important;
    padding-left: 2.5% !important;
    padding-right: 2.5% !important;
  }

  /* PC에서는 햄버거 오버레이 메뉴 기본 숨김 */
  .mobile-drawer-toggle,
  .mobile-drawer,
  .mobile-dim,
  .mobile-sidebar,
  .mobile-sidebar-overlay{
    display: none !important;
  }
}

.content-wrap--full{
  max-width: none;
}

/* 공통 그리드 유틸 */
.grid-2{ display:grid; gap:18px; }
.grid-3{ display:grid; gap:18px; }
@media (min-width: 992px){
  .grid-2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  
  /* 사이드바가 없을 때 grid-2가 제대로 작동하도록 */
  body.landing-nav-page .app-shell-no-sidebar .grid-2,
  .app-shell-no-sidebar .grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    display: grid !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* my_groups 카드 그리드 */
.groups-grid{ display:grid; gap:18px; }
@media (min-width: 992px){
  .groups-grid{ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}

/* my_groups: PC/모바일 모두 가로 스크롤 유지 */
body.my-groups-page .groups-scroll-container{
  overflow-x: auto;
  overflow-y: hidden;
}
body.my-groups-page .groups-grid{
  display: flex;
  gap: 18px;
}
body.my-groups-page .groups-scroll-wrapper{
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}
body.my-groups-page .groups-scroll-wrapper-inner{
  padding-left: 12px;
  padding-right: 12px;
}
body.my-groups-page .gl-section,
body.my-groups-page .gl-section__body,
body.my-groups-page .groups-scroll-wrapper,
body.my-groups-page .groups-scroll-container{
  min-width: 0;
  max-width: 100%;
}
body.my-groups-page .groups-scroll-container{
  width: 100%;
}

/* 가입 요청 중 섹션: 웜 톤 헤더 + 카드 리스트 */
.gl-section--pending .gl-section__header {
  background: linear-gradient(135deg, #B8860B 0%, #D4A84B 50%, #E8C97A 100%) !important;
  color: #2C1810;
  text-shadow: 0 1px 0 rgba(255,255,255,0.3);
}
.gl-section--pending .gl-section__header .gl-section__title {
  color: inherit;
}
.gl-section--pending .gl-section__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  height: 1.25rem;
  padding: 0 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  background: rgba(44, 24, 16, 0.2);
  border-radius: 999px;
  margin-left: 6px;
  vertical-align: middle;
}

.gl-pending-request-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.gl-pending-request-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  background: linear-gradient(135deg, #FFFDF9 0%, #FDF8F2 100%);
  border: 1px solid rgba(184, 134, 11, 0.18);
  border-radius: 14px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}
.gl-pending-request-card:hover {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  border-color: rgba(184, 134, 11, 0.28);
}

.gl-pending-request-card__logo {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  overflow: hidden;
  background: #F5EDE4;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gl-pending-request-card__logo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gl-pending-request-card__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.gl-pending-request-card__name {
  font-weight: 700;
  font-size: 0.95rem;
  color: #2C1810;
  line-height: 1.3;
}
.gl-pending-request-card__date {
  font-size: 0.8rem;
  color: #8B7355;
  font-weight: 500;
}

.gl-pending-request-card__actions {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.gl-pending-request-card__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.65rem;
  font-size: 0.72rem;
  font-weight: 700;
  color: #8B6914;
  background: rgba(212, 168, 75, 0.22);
  border-radius: 999px;
  letter-spacing: 0.02em;
}
.gl-pending-request-card__cancel {
  padding: 0.4rem 0.75rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: #8B6914;
  background: transparent;
  border: 1px solid rgba(139, 105, 20, 0.35);
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.gl-pending-request-card__cancel:hover {
  background: rgba(139, 105, 20, 0.08);
  border-color: rgba(139, 105, 20, 0.5);
  color: #5C4610;
}

/* 동호회 정보 모달: 플랜요금제 + AI스코어샷 잔여량 강조 블록 */
.gl-group-info-plan-ai {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(102, 126, 234, 0.35);
}
.gl-group-info-plan-ai__label {
  font-size: 0.8rem;
  font-weight: 600;
  opacity: 0.95;
  letter-spacing: 0.02em;
  margin-bottom: 0.35rem;
}
.gl-group-info-plan-ai__value {
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.gl-group-info-plan-ai__value--ai {
  font-size: 1.25rem;
  color: #ffd93d;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

/* 동호회 정보 모달: 소개글 폰트 살짝 작게 */
.gl-group-info-modal .gl-group-info-desc {
  font-size: 0.875rem;
  line-height: 1.5;
}

/* 동호회 정보 모달: 가입요청 모달(modal-xl 1140px) 대비 80% 폭 */
#groupInfoModal .modal-dialog.gl-group-info-modal-dialog {
  max-width: 912px;
}

/* rounds_statistics 2열 레이아웃 */
.stats-layout{ display:block; }
@media (min-width: 992px){
  .stats-layout{
    display:grid;
    grid-template-columns: 360px 1fr;
    gap: 18px;
    align-items: start;
  }
}

/* PC 사이드바 메뉴 */
.app-sidebar__title{
  font-weight: 700;
  color: #334155;
  font-size: 0.9rem;
  margin-bottom: 12px;
}

.app-sidebar__menu{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 8px;
}

.app-sidebar__menu a{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #334155;
  text-decoration: none;
  font-weight: 600;
  background: #F8FAFC;
}

.app-sidebar__menu a:hover{
  background: #EEF2FF;
  color: #1E40AF;
}

/* Profile edit modal layout (iframe 내부: 상·하단 여백 제거, 네비 높이 여백 미적용) */
body.ops-ui.profile-edit-page .page-container.ops-container,
body.profile-edit-page .page-container.ops-container {
    margin-top: 0 !important;
    padding: 0 0.35rem 0 0.35rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.profile-edit-wrapper {
    max-width: 560px;
    margin: 0 auto;
    padding: 0;
}

.profile-edit-container {
    background: #ffffff;
    border: 1px solid #E2E8F0;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
    margin-bottom: 10px;
}

.profile-edit-header {
    text-align: center;
    margin-bottom: 12px;
}

.profile-edit-header .logo-icon-wrapper {
    width: 48px;
    height: 48px;
    margin: 0 auto 8px;
    border-radius: 12px;
    background: linear-gradient(135deg, #6472df 0%, #8694ec 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 20px;
}

.profile-edit-header h1 {
    font-size: 1.1rem;
    font-weight: 800;
    margin: 6px 0;
    color: #0f172a;
}

.profile-edit-header p {
    font-size: 0.85rem;
    color: #64748b;
    margin-bottom: 0;
}

.profile-edit-container .form-label {
    font-weight: 600;
    color: #475569;
}

.profile-edit-container .form-control,
.profile-edit-container .form-select {
    border-radius: 10px;
    border: 1px solid #E2E8F0;
}

.profile-edit-container .form-control:focus,
.profile-edit-container .form-select:focus {
    box-shadow: 0 0 0 0.2rem rgba(100, 114, 223, 0.2);
    border-color: #6472df;
}

.profile-edit-container .btn-save,
.profile-edit-container .btn-primary {
    background: linear-gradient(135deg, #6472df 0%, #8694ec 100%);
    color: #ffffff;
    border: none;
    border-radius: 10px;
    font-weight: 700;
}

.profile-edit-container .btn-secondary,
.profile-edit-container .btn-outline-secondary,
.profile-edit-container .btn-outline-primary {
    background: #ffffff;
    border: 1px solid #E2E8F0;
    color: #334155;
    border-radius: 10px;
    font-weight: 700;
}

.profile-upload-container {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 12px;
    align-items: stretch;
}

.profile-image-preview {
    border: 1px dashed #CBD5F5;
    border-radius: 14px;
    background: #F8FAFF;
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.profile-image-preview.is-dragover {
    border-color: #6472df;
    background: #EEF2FF;
}

.profile-image-placeholder {
    text-align: center;
    color: #94A3B8;
    font-size: 0.82rem;
}

.profile-image-placeholder i {
    font-size: 1.4rem;
    margin-bottom: 6px;
}

.profile-image-display {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
}

.profile-image-remove {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: none;
    background: rgba(15, 23, 42, 0.75);
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.profile-file-input-row {
    margin-top: 8px;
}

.profile-file-input {
    width: 100%;
}

.profile-upload-info {
    font-size: 0.78rem;
    color: #64748b;
    background: #F8FAFC;
    border-radius: 12px;
    padding: 12px;
}

.profile-upload-info ul {
    padding-left: 16px;
    margin-bottom: 6px;
}

.profile-edit-close {
    min-width: 150px;
    padding: 0.7rem 1.8rem;
    border-radius: 12px;
    font-size: 0.95rem;
}

@media (max-width: 991px) {
    .profile-upload-container {
        grid-template-columns: 1fr;
    }
    .profile-image-preview {
        min-height: 140px;
    }
}

.gl-alert-compact {
    font-size: 0.85rem;
}

.gl-badge-lg {
    font-size: 0.9rem;
}

.gl-clickable {
    cursor: pointer;
}

.gl-group-logo {
    width: 32px;
    height: 32px;
    object-fit: cover;
    flex-shrink: 0;
    border-radius: 16px;
}

.gl-group-logo-placeholder {
    width: 32px;
    height: 32px;
    border-radius: 16px;
}

.gl-icon-gold {
    color: #ffd700;
}

.gl-text-xs {
    font-size: 0.65rem;
}

.gl-text-sm {
    font-size: 0.7rem;
}

.gl-text-md {
    font-size: 0.8rem;
}

.gl-group-logo-large {
    max-height: 100px;
    max-width: 100%;
    object-fit: contain;
    border-radius: 20px;
}

.gl-group-logo-medium {
    max-height: 80px;
    max-width: 100%;
    object-fit: contain;
    border-radius: 18px;
}

.gl-group-card-dashed {
    border: 2px dashed #28a745;
    cursor: pointer;
}

.gl-group-card-body {
    padding: 0.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 200px;
}

.gl-group-card-body-compact {
    padding: 0.5rem;
}

.gl-group-card-icon {
    color: #28a745;
}

.gl-group-card-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #28a745;
}

.gl-group-card-title-dark {
    font-size: 0.875rem;
    font-weight: 600;
}

.gl-group-card-desc {
    font-size: 0.65rem;
    line-height: 1.2;
}

.gl-group-card-logo-wrap {
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.gl-group-card-logo-wrap img {
    border-radius: 18px;
}

/* 동호회 로고 이미지 전체 라운드 적용 (커스텀·기본 모두) */
.sidebar .club-icon img,
.club-header .club-icon img {
    border-radius: 30px;
}

.gl-group-card-btn {
    font-size: 0.7rem;
    padding: 0.25rem 0.5rem;
}

.gl-group-card-btn-icon {
    font-size: 0.7rem;
}

.gl-modal-image {
    max-height: 70vh;
    border-radius: 10px;
}

.main-content--full {
    margin-left: 0;
    width: 100%;
}

/* =========================
   PC Layout refinement (>=992px)
========================= */
:root{
  --header-h: 72px;
  --sidebar-w: 240px;
  --content-max: 1400px;
  --content-pad: 24px;
}

body{ margin:0; }
header, .top-nav, .navbar { margin:0 !important; }

.app-shell{ min-height: calc(100vh - var(--header-h)); }
.app-sidebar{ display:none; }
.app-content{ padding: 18px 16px; }

@media (max-width: 991px) {
  /* 991px 이하에서 app-content의 padding 최소화 */
  .app-content {
    padding: 0.2rem !important;
  }
  
  body.landing-nav-page .app-content{
    padding: 0.2rem !important;
  }
}
.content-wrap{ 
    width:100%; 
    max-width: 100% !important; /* 991px 이하에서 전체 너비 사용 */
}

@media (max-width: 991px) {
    /* 991px 이하에서 모든 content-wrap이 전체 너비 사용 */
    .content-wrap {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* app-content도 전체 너비 사용 */
    .app-content {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    /* main-content도 전체 너비 사용 */
    .main-content {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* ops-container도 전체 너비 사용 */
    .ops-container {
        max-width: 100% !important;
        width: 100% !important;
    }
}

@media (min-width: 992px){
  .app-shell{
    display:grid;
    grid-template-columns: var(--sidebar-w) 1fr;
    align-items: start;
  }
  
  /* 사이드바가 없을 때 app-shell이 전체 너비 사용 */
  .app-shell-no-sidebar{
    grid-template-columns: 1fr !important;
  }

  .app-sidebar{
    display:block;
    position: sticky;
    top: var(--header-h);
    height: calc(100vh - var(--header-h));
    padding: 0 10px 12px;
    background:#fff;
    border-right: 1px solid rgba(0,0,0,.06);
    overflow:auto;
  }

  .app-content{
    padding: 0;
  }
  
  /* 사이드바가 없을 때 app-content가 전체 너비 사용 */
  .app-shell-no-sidebar .app-content{
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  .content-wrap{
    max-width: none;
    margin: 0;
  }
  
  /* 사이드바가 없을 때 content-wrap 최대 너비 설정 (높은 우선순위) */
  body.landing-nav-page .app-shell-no-sidebar .content-wrap,
  body.landing-nav-page .app-shell-no-sidebar .app-content .content-wrap,
  .app-shell-no-sidebar .content-wrap{
    max-width: none !important;
    margin: 0 auto !important;
    width: 100% !important;
    padding-left: 2.5% !important;
    padding-right: 2.5% !important;
  }

  .ops-container{
    max-width: none;
    padding: 0;
  }
  
  /* 사이드바가 없을 때 ops-container 최대 너비 설정 (높은 우선순위) */
  body.landing-nav-page .app-shell-no-sidebar .app-content .ops-container,
  body.landing-nav-page .app-shell-no-sidebar .main-content .ops-container,
  body.landing-nav-page .app-shell-no-sidebar .content-wrap .ops-container,
  body.landing-nav-page .app-shell-no-sidebar .gl-sections .ops-container,
  .app-shell-no-sidebar .ops-container {
    max-width: none !important;
    width: 100% !important;
    padding: 24px 2.5% 24px !important;
  }

  .app-content .main-content{
    margin: 0;
    padding: 0;
    width: 100%;
  }

  .app-content .gl-sections,
  .app-content .gl-section{
    width: 100%;
    max-width: none;
  }
  
  /* 사이드바가 없을 때 모든 콘텐츠 요소가 전체 너비 사용 */
  body.landing-nav-page .app-shell-no-sidebar .app-content,
  body.landing-nav-page .app-shell-no-sidebar .main-content,
  body.landing-nav-page .app-shell-no-sidebar .gl-sections,
  body.landing-nav-page .app-shell-no-sidebar .gl-section,
  body.landing-nav-page .app-shell-no-sidebar .grid-2,
  .app-shell-no-sidebar .app-content,
  .app-shell-no-sidebar .main-content {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* 사이드바가 없을 때 grid-2가 제대로 작동하도록 */
  body.landing-nav-page .app-shell-no-sidebar .grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .app-content .container-fluid{
    padding-left: 0;
    padding-right: 0;
  }

  .app-content .gl-sections{
    grid-template-columns: 1fr;
  }
  
  /* 사이드바가 없을 때 gl-sections가 grid-2를 제대로 표시하도록 */
  body.landing-nav-page .app-shell-no-sidebar .gl-sections .grid-2,
  .app-shell-no-sidebar .gl-sections .grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    display: grid !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* PC에서 섹션 바깥 여백 제거 (통계/동호회) */
  .pc-no-outer .gl-sections,
  .pc-no-outer .gl-section{
    margin: 0;
  }

  .pc-no-outer .container-fluid,
  .pc-no-outer .p-2.p-md-3,
  .pc-no-outer .p-2.p-md-3 .gl-sections{
    padding: 0;
  }

  /* PC에서는 모바일 햄버거/드로어 UI 숨김 */
  .hamburger,
  .sidebar-toggle,
  .mobile-drawer,
  .mobile-dim,
  .mobile-drawer-toggle,
  .mobile-sidebar,
  .mobile-sidebar-overlay,
  .bottom-nav{
    display:none !important;
  }
}

/* 공통 그리드 유틸 */
.grid-2{ display:grid; gap:18px; }
.grid-3{ display:grid; gap:18px; }
.stats-layout{ display:block; }
.groups-grid{ display:grid; gap:18px; }

@media (min-width: 992px){
  .grid-2{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .grid-3{ grid-template-columns: repeat(3, minmax(0,1fr)); }
  .stats-layout{ grid-template-columns: 360px 1fr; display:grid; gap:18px; align-items:start; }
  .groups-grid{ grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}

/* my_groups 전용: PC/모바일 가로 스크롤 고정 */
body.my-groups-page .groups-scroll-container{
  overflow-x: auto !important;
  overflow-y: hidden !important;
  white-space: nowrap;
}
body.my-groups-page .groups-scroll-wrapper-inner{
  display: inline-block;
  white-space: nowrap;
}
body.my-groups-page .groups-grid{
  display: inline-block;
}
body.my-groups-page .groups-scroll-wrapper{
  margin-left: 0;
  margin-right: 0;
  width: 100%;
}
body.my-groups-page .groups-scroll-wrapper-inner{
  padding-left: 12px;
  padding-right: 12px;
}
body.my-groups-page .group-card-item{
  display: inline-block;
  vertical-align: top;
  margin-right: 18px;
}
body.my-groups-page .group-card-item:last-child{
  margin-right: 0;
}
body.my-groups-page .groups-scroll-wrapper .scroll-indicator{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: auto;
  right: auto;
  bottom: auto;
  animation: none;
}
body.my-groups-page .groups-scroll-wrapper .scroll-indicator.left{
  left: 8px;
  right: auto;
}
body.my-groups-page .groups-scroll-wrapper .scroll-indicator.right{
  right: 8px;
  left: auto;
}

@media (min-width: 992px){
  .gl-filter-grid{
    grid-template-columns: 2fr 2fr 1fr;
    align-items: end;
  }
  .gl-chip-group{
    flex-wrap: nowrap;
  }
}

/* PC 좌측 메뉴 스타일 */
.side-menu{ display:flex; flex-direction:column; gap:10px; list-style:none; padding:0; margin:0; }
.side-menu a{
  display:flex; align-items:center; gap:10px;
  padding:12px 14px;
  border-radius:12px;
  color:#111;
  text-decoration:none;
  background:#f6f7f9;
}
.side-menu a:hover{ filter: brightness(.98); }
.side-menu a.active{
  background:#e9f0ff;
  font-weight:700;
  outline: 1px solid rgba(0,0,0,.05);
  border-left: 4px solid #3b82f6;
  padding-left:10px;
}

/* 통계 페이지 그라데이션 배경 */
.bg-gradient-primary {
  background: linear-gradient(135deg, #0d6efd 0%, #0a58ca 100%) !important;
}

/* 온보딩 화면 스타일 */
.onboarding-container {
  padding: 1.5rem;
}

.onboarding-header {
  margin-bottom: 2rem;
}

.onboarding-icon {
  font-size: 4rem;
  line-height: 1;
}

.onboarding-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 0.75rem;
}

.onboarding-subtitle {
  font-size: 1rem;
  color: #666;
  line-height: 1.6;
}

.onboarding-checklist {
  background: #f8f9fa;
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 2rem;
}

.checklist-item {
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
  font-size: 0.95rem;
  color: #333;
}

.checklist-item i {
  font-size: 1.1rem;
}

.onboarding-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.btn-onboarding-primary {
  background: linear-gradient(135deg, #0E3B2E 0%, #1a5a47 100%);
  border: none;
  border-radius: 14px;
  padding: 1rem 1.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: white;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(14, 59, 46, 0.3);
}

.btn-onboarding-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(14, 59, 46, 0.4);
  color: white;
}

.btn-onboarding-secondary {
  background: white;
  border: 2px solid #0E3B2E;
  border-radius: 14px;
  padding: 0.875rem 1.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: #0E3B2E;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.btn-onboarding-secondary:hover {
  background: #f0f4f2;
  color: #0E3B2E;
  transform: translateY(-1px);
}

.btn-onboarding-ghost {
  background: transparent;
  border: none;
  padding: 0.5rem;
  font-size: 0.9rem;
  color: #6c757d;
  text-align: center;
  text-decoration: underline;
  text-decoration-color: rgba(108, 117, 125, 0.3);
  transition: all 0.3s ease;
}

.btn-onboarding-ghost:hover {
  color: #495057;
  text-decoration-color: rgba(73, 80, 87, 0.5);
}

@media (max-width: 991px) {
  .onboarding-container {
    padding: 1rem;
  }
  
  .onboarding-title {
    font-size: 1.25rem;
  }
  
  .onboarding-subtitle {
    font-size: 0.9rem;
  }
  
  .btn-onboarding-primary,
  .btn-onboarding-secondary {
    font-size: 1rem;
    padding: 0.875rem 1.25rem;
  }
}

/* ===== GolfLounge Home v1/v2 ===== */
:root{
  --gl-bg: #F8F9FB;
  --gl-card: #FFFFFF;
  --gl-card-pastel: #FDFCF9;
  --gl-card-blue: #F0F7FF;
  --gl-card-mint: #F0FAF8;
  --gl-card-lavender: #F8F6FF;
  --gl-card-peach: #FFF5F0;
  --gl-text: #2C3E50;
  --gl-sub: #6B7280;
  --gl-border: rgba(108, 117, 125, 0.15);
  --gl-shadow: 0 8px 24px rgba(108, 117, 125, 0.08);
  --gl-radius: 20px;
  --gl-radius-sm: 16px;
  --gl-primary: linear-gradient(135deg, #667EEA, #764BA2);
  --gl-accent: linear-gradient(135deg, #F093FB, #F5576C);
}

.gl-home{
  background: var(--gl-bg);
  min-height: 100vh;
  padding: 20px 16px 90px;
}
.gl-home__inner{
  max-width: 580px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

body.home-page .gl-home{
  padding: 0;
  max-width: none;
  margin: 0;
  min-height: auto;
}

body.home-page .gl-home__inner{
  max-width: none;
  margin: 0;
}

/* v1 hero */
.gl-hero{
  border-radius: var(--gl-radius);
  padding: 20px 20px;
  background: linear-gradient(180deg, rgba(102, 126, 234, 0.08), rgba(118, 75, 162, 0.05));
  border: 1px solid var(--gl-border);
  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.06);
}
.gl-hero__badge{
  display: inline-flex; align-items: center;
  height: 28px; padding: 0 12px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.15), rgba(118, 75, 162, 0.1));
  color: #667EEA; font-weight: 800; font-size: 12px;
  letter-spacing: 0.6px;
}
.gl-hero__title{ margin: 10px 0 6px; font-size: 18px; line-height: 1.25; font-weight: 900; color: var(--gl-text); }
.gl-hero__desc{ margin: 0; font-size: 14px; color: var(--gl-sub); }

/* buttons */
.gl-actions{ display: flex; flex-direction: column; gap: 10px; }
.gl-btn{
  width: 100%;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  border-radius: 16px; padding: 14px 14px;
  font-weight: 800; text-decoration: none;
  border: 1px solid transparent;
}
.gl-btn__icon{ font-size: 18px; }
.gl-btn__text{ font-size: 15px; }
.gl-btn--primary{ background: var(--gl-primary); color: #fff; box-shadow: var(--gl-shadow); }
.gl-btn--secondary{ background: #fff; color: var(--gl-text); border-color: var(--gl-border); }
.gl-btn--ghost{ background: transparent; color: var(--gl-sub); border-color: transparent; padding: 10px 14px; }
.gl-btn--profile{ 
  background: #fff; 
  border: 1px solid var(--gl-border); 
  color: var(--gl-text); 
  padding: 12px 14px; 
  font-weight: 800; 
}

/* card link */
.gl-cardlink{
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 16px;
  border-radius: var(--gl-radius-sm);
  background: var(--gl-card-pastel);
  border: 1px solid var(--gl-border);
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(108, 117, 125, 0.04);
  transition: all 0.2s ease;
}
.gl-cardlink:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(108, 117, 125, 0.08);
  background: #FCFAF7;
}
.gl-cardlink__title{ font-size: 15px; font-weight: 900; color: var(--gl-text); }
.gl-cardlink__desc{ margin-top: 4px; font-size: 13px; color: var(--gl-sub); }
.gl-cardlink__right{
  width: 46px; height: 46px;
  border-radius: 16px;
  display: grid; place-items: center;
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.1), rgba(118, 75, 162, 0.08));
  font-size: 20px;
}

/* widget */
.gl-widget{
  border-radius: var(--gl-radius);
  background: var(--gl-card-mint);
  border: 1px solid var(--gl-border);
  box-shadow: 0 8px 24px rgba(108, 117, 125, 0.06);
  padding: 16px 16px 18px;
  transition: all 0.2s ease;
}
.gl-widget:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(108, 117, 125, 0.1);
}
.gl-widget__head{ display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
.gl-widget__title{ font-size: 15px; font-weight: 900; color: var(--gl-text); }
.gl-widget__meta{ font-size: 12px; color: var(--gl-sub); }
.gl-widget__body{ padding: 0; }

/* quota/progress */
.gl-quota__row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.gl-quota__label{ font-size: 13px; font-weight: 800; color: var(--gl-text); }
.gl-quota__value{ font-size: 13px; color: var(--gl-sub); font-weight: 800; }
.gl-progress{ height: 8px; border-radius: 999px; background: rgba(15,23,42,0.06); overflow: hidden; }
.gl-progress__bar{ height: 100%; border-radius: 999px; background: var(--gl-primary); width: 0%; }
.gl-quota__hint{ margin: 10px 0 0; font-size: 12px; line-height: 1.4; color: var(--gl-sub); }

/* 공통 테이블 리스트 스타일 (경품목록 스타일 기준) */
.gl-table-list-wrapper {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
}

/* 공통 테이블 리스트 헤더 스타일 (경품목록 스타일 기준) */
table.gl-table-list thead th,
.table.gl-table-list thead th {
    background: #F1F5F9 !important;
    color: #334155 !important;
    font-weight: 700 !important;
    font-size: 0.78rem !important;
    border-bottom: 1px solid #E2E8F0 !important;
    padding: 0.5rem 0.6rem !important;
    text-align: center !important;
}

table.gl-table-list thead th a,
.table.gl-table-list thead th a {
    color: #334155 !important;
    text-decoration: none;
}

table.gl-table-list thead th a:hover,
.table.gl-table-list thead th a:hover {
    color: #0f172a !important;
    text-decoration: underline;
}

/* 조편성 테이블 헤더 스타일 (리스트 테이블과 동일) */
table#groupTable thead th,
.table#groupTable thead th {
    background: #F1F5F9 !important;
    color: #334155 !important;
    font-weight: 700 !important;
    font-size: 0.78rem !important;
    border-bottom: 1px solid #E2E8F0 !important;
    padding: 0.5rem 0.6rem !important;
    text-align: center !important;
}

/* 모바일: 스코어 입력 INPUT 폰트를 이름 셀과 동일하게 (잘림 방지) */
@media (max-width: 767.98px) {
    #groupTable td input.score-input,
    #groupTable td input.form-control.score-input {
        font-size: 1em;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
        min-height: 1.5em;
    }
}

/* fold */
.gl-details{
  border-radius: var(--gl-radius);
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(15,23,42,0.08);
  padding: 10px 12px;
}
.gl-details__summary{ cursor:pointer; font-weight: 900; color: #64748B; font-size: 13px; list-style:none; }
.gl-details__summary::-webkit-details-marker{ display:none; }
.gl-featurelist{ margin: 10px 0 4px; padding-left: 18px; color: var(--gl-sub); font-size: 13px; line-height: 1.7; }

/* footer action (v1 하단 액션) */
.gl-footer-action{
  margin-top: 4px;
}

/* ===== v2 additions ===== */
.gl-topline{
  border-radius: var(--gl-radius);
  padding: 14px 14px;
  background: rgba(255,255,255,0.75);
  border: 1px solid var(--gl-border);
}
.gl-topline__title{ font-size: 16px; font-weight: 900; color: var(--gl-text); }
.gl-topline__sub{ margin-top: 4px; font-size: 13px; color: var(--gl-sub); }

.gl-quickgrid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.gl-quick{
  border-radius: var(--gl-radius-sm);
  padding: 16px 16px;
  background: var(--gl-card-blue);
  border: 1px solid var(--gl-border);
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(108, 117, 125, 0.04);
  transition: all 0.2s ease;
}
.gl-quick:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(108, 117, 125, 0.08);
  background: #E8F4FF;
}
.gl-quick--primary{
  background: var(--gl-primary);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.15);
}
.gl-quick--primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(102, 126, 234, 0.2);
}
.gl-quick__t{ font-size: 15px; font-weight: 900; color: inherit; }
.gl-quick__d{ margin-top: 4px; font-size: 12px; opacity: 0.9; color: inherit; }

.gl-linklist{ display: flex; flex-direction: column; gap: 10px; }

/* =========================
   Home 페이지 PC 반응형 레이아웃 (992px 이상)
========================= */
@media (min-width: 992px) {
    .gl-home {
        padding: 32px 24px 32px;
        max-width: 1200px;
        margin: 0 auto;
    }

    body.home-page .gl-home {
        padding: 0;
        max-width: none;
        margin: 0;
    }
    
    .gl-home__inner {
        max-width: 1000px;
        gap: 20px;
    }

    body.home-page .gl-home__inner {
        max-width: none;
        margin: 0;
    }
    
    .gl-hero {
        padding: 28px 32px;
        margin-bottom: 8px;
    }
    
    .gl-hero__title {
        font-size: 22px;
        margin: 12px 0 8px;
    }
    
    .gl-hero__desc {
        font-size: 16px;
    }
    
    .gl-quickgrid {
        gap: 16px;
        grid-template-columns: 1fr 1fr;
    }
    
    .gl-quick {
        padding: 20px 20px;
        border-radius: 20px;
    }
    
    .gl-quick__t {
        font-size: 17px;
    }
    
    .gl-quick__d {
        font-size: 14px;
        margin-top: 6px;
    }
    
    .gl-cardlink {
        padding: 20px 20px;
        border-radius: 20px;
    }
    
    .gl-cardlink__title {
        font-size: 17px;
    }
    
    .gl-cardlink__desc {
        font-size: 14px;
        margin-top: 6px;
    }
    
    .gl-cardlink__right {
        width: 52px;
        height: 52px;
        border-radius: 18px;
        font-size: 22px;
    }
    
    .gl-widget {
        padding: 20px 20px 24px;
        border-radius: 24px;
    }
    
    .gl-widget__title {
        font-size: 17px;
    }
    
    .gl-widget__meta {
        font-size: 13px;
    }
    
    .gl-topline {
        padding: 20px 20px;
        border-radius: 24px;
    }
    
    .gl-topline__title {
        font-size: 18px;
    }
    
    .gl-topline__sub {
        font-size: 14px;
        margin-top: 6px;
    }
    
    .gl-btn {
        padding: 16px 16px;
        border-radius: 20px;
    }
    
    .gl-btn__text {
        font-size: 16px;
    }
    
    .gl-btn__icon {
        font-size: 20px;
    }
}

/* =========================
   Home 페이지 반응형 레이아웃 (991px 이하)
========================= */

/* =========================
   Landing v2.0 tokens
   ========================= */
.landing-wrap { width: 100%; }
.landing-section { padding: 72px 0; }
.landing-container { width: min(1100px, 92vw); margin: 0 auto; }

.landing-h1 { font-size: clamp(28px, 3.2vw, 44px); line-height: 1.15; font-weight: 800; }
.landing-h2 { font-size: clamp(20px, 2.2vw, 28px); line-height: 1.2; font-weight: 800; }
.landing-lead { margin-top: 10px; font-size: 15px; line-height: 1.6; opacity: .85; }

.landing-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.landing-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 900px){ .landing-grid-4{ grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 720px){ .landing-section{ padding: 54px 0; } .landing-grid-3{ grid-template-columns: 1fr; } .landing-grid-4{ grid-template-columns: 1fr; } }

.landing-card {
  border-radius: 18px;
  padding: 18px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: none;
}
.landing-card.light {
  background: #ffffff;
  border: 1px solid rgba(0,0,0,.08);
}

.landing-muted { opacity: .78; }
.landing-divider { height: 1px; background: rgba(255,255,255,.12); margin: 22px 0; }

.landing-bg-dark { background: linear-gradient(180deg, rgba(11,42,36,1) 0%, rgba(7,26,23,1) 100%); color: #fff; }
.landing-bg-light { background: linear-gradient(180deg, rgba(245,248,250,1) 0%, rgba(236,242,246,1) 100%); color: #111; }

.landing-cta-row { display:flex; gap:12px; margin-top: 20px; flex-wrap: wrap; justify-content: center; }
.landing-cta-row .btn { min-height: 48px; padding: 12px 18px; border-radius: 14px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; text-align: center; }

.landing-more { margin-top: 12px; }
.landing-more-btn { display:inline-block; padding:10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.18); cursor:pointer; }
.landing-more-content { display:none; margin-top: 12px; }
.landing-more.is-open .landing-more-content { display:block; }

/* pricing glass only */
.pricing-glass .landing-card { backdrop-filter: blur(10px); }
.pricing-glass .pricing-card { backdrop-filter: blur(10px); }

/* 프로모션 배너 (인라인 제거용) */
.promotion-banner-wrapper { max-width: 400px; margin: 0 auto 2rem; }
.promotion-banner { background: linear-gradient(135deg, #ff6b6b 0%, #feca57 100%); color: white; padding: 1.5rem; border-radius: 16px; text-align: center; word-wrap: break-word; overflow-wrap: break-word; }
.promotion-banner h4 { font-weight: 800; word-wrap: break-word; overflow-wrap: break-word; margin-bottom: 0.25rem; }
.promotion-banner .promotion-price { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; }
.promotion-banner .promotion-dates { font-size: 0.9rem; opacity: 0.9; margin-bottom: 0.75rem; }
.promotion-banner .promotion-memo { font-size: 0.875rem; word-wrap: break-word; overflow-wrap: break-word; margin-bottom: 0; }
.promotion-banner-icon { font-size: 2rem; }
.promotion-banner-inner { max-width: 100%; }
.hero-tagline { font-size: clamp(1rem, 2vw, 1.3rem); margin-top: 1rem; opacity: 0.95; }
/* features 섹션 라이트 테마 텍스트 */
.landing-bg-light .landing-h2 { color: #111; }
.landing-bg-light .landing-lead { color: #333; }
.landing-bg-light .benefit-title { color: #111; }
.landing-bg-light .benefit-description { color: #444; }
.landing-bg-light .benefit-icon { color: var(--landing-accent-gold); }
.landing-bg-light .landing-more-content .landing-lead { color: #333; }
.landing-bg-light .landing-divider { background: rgba(0,0,0,.08); margin: 1rem 0; }
.landing-lead-mb { margin-bottom: 2rem; }
.landing-more-mt { margin-top: 2rem; }
.landing-lead-mt-sm { margin-top: 0.5rem; }
.landing-grid-mt { margin-top: 2rem; }

/* =========================
   Landing Mobile Fix v1.0
   - Pain Cards (icon left, text right)
   ========================= */
.landing-pain { background: #0b2a24; color:#fff; }
.pain-cards { display:grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 16px; }
.pain-card {
  border-radius: 16px;
  padding: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.pain-ico { font-size: 22px; line-height: 1; margin-bottom: 10px; }
.pain-title { font-weight: 800; font-size: 15px; line-height: 1.2; }
.pain-desc { margin-top: 6px; font-size: 13px; line-height: 1.45; opacity: .85; }

@media (max-width: 720px){
  .pain-cards { grid-template-columns: 1fr; gap: 10px; }
  .pain-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 14px;
  }
  .pain-ico {
    width: 44px;
    height: 44px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius: 12px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.12);
    margin-bottom: 0;
    font-size: 22px;
    flex: 0 0 44px;
  }
  .pain-txt { flex: 1 1 auto; }
  .pain-title { font-size: 16px; }
  .pain-desc { font-size: 13px; }
}

/* Hero 높이/여백 줄이기 (모바일만) */
@media (max-width: 720px){
  .landing-hero.hero-section,
  .hero-section.landing-hero {
    min-height: auto !important;
    padding: 48px 0 28px !important;
  }
  .landing-section { padding: 44px 0; }
}

/* 핵심기능 4카드: 모바일 가로 스크롤 */
@media (max-width: 720px){
  .feature-row{
    display:flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 6px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .feature-row > *{
    min-width: 72%;
    scroll-snap-align: start;
  }
}

/* Before/After 섹션 압축 (모바일) */
@media (max-width: 720px){
  .landing-compare.comparison-section,
  .comparison-section.landing-compare {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }
  .landing-compare .section-title { margin-bottom: 12px !important; }
  .landing-compare .comparison-card { padding: 14px !important; }
}

/* 요금제: 모바일 접기 + 버튼 */
.pricing-more-btn{
  margin: 14px auto 0;
  display:block;
  width: 100%;
  max-width: 360px;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color:#fff;
  cursor: pointer;
}

@media (max-width: 720px){
  .pricing-collapsible{ display:none; margin-top: 12px; }
  .pricing-collapsible.is-open{ display:block; }
}

@media (min-width: 721px){
  .pricing-collapsible{ display: block !important; }
  .landing-pricing .pricing-more-btn{ display: none; }
  .pricing-mobile{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    max-width: 1200px;
    margin: 0 auto;
  }
  .pricing-mobile .pricing-grid,
  .pricing-mobile .pricing-collapsible{ display: contents; }
}

/* =========================
   Personal Golfer Section
   ========================= */
.landing-personal{
  background: linear-gradient(180deg, #f6f9fb 0%, #eef3f6 100%);
  color:#111;
}

.personal-grid{
  display:grid;
  grid-template-columns: repeat(4,1fr);
  gap: 14px;
  margin-top: 20px;
}

.personal-card{
  background:#fff;
  border-radius: 16px;
  padding: 16px;
  border: 1px solid rgba(0,0,0,.08);
  text-align:center;
}

.personal-card .personal-icon{ font-size: 22px; }
.personal-card .personal-title{
  margin-top: 8px;
  font-size: 15px;
  font-weight: 800;
}
.personal-card .personal-desc{
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.4;
  opacity:.75;
}

@media (max-width: 720px){
  .personal-grid{
    grid-template-columns: repeat(2,1fr);
    gap: 10px;
  }
}

.landing-personal .landing-h2{ color: #111; }
.landing-personal .landing-lead{ color: #333; }

/* =========================
   Landing Mobile v1.2
   ========================= */
/* A) Feature cards: 2-col grid on mobile */
.feature-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:16px; }
@media (max-width: 720px){
  .feature-grid{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .feature-grid .landing-card,
  .feature-grid .benefit-card{ padding: 14px; border-radius: 16px; }
  .feature-grid .benefit-icon{ font-size: 18px; }
  .feature-grid .benefit-title{ font-size: 14px; font-weight: 800; }
  .feature-grid .benefit-description{ font-size: 12px; line-height: 1.35; opacity:.78; }
}

/* B) AI 더보기 버튼/힌트 */
.landing-more-btn{
  width:100%;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color:#fff;
  cursor: pointer;
}
.landing-bg-light .landing-more-btn{ border-color: rgba(0,0,0,.15); background: rgba(0,0,0,.06); color: #111; }
.landing-more-hint{ margin-top: 8px; font-size: 12px; opacity: .75; text-align:center; }
.landing-bg-light .landing-more-hint{ color: #555; }
.landing-more-content{ display:none; margin-top: 12px; }
.landing-more.is-open .landing-more-content{ display:block; }

/* C) Compare one card */
.compare-one{
  border-radius: 18px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}
.compare-head{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0;
  background: rgba(0,0,0,.12);
}
.compare-head > div{ padding: 12px 12px; font-weight: 900; text-align:center; }
.ch-left{ color: rgba(255,255,255,.7); }
.ch-right{ color: var(--landing-accent-lime, #7cb342); }
.compare-body{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px; }
.compare-body ul{ margin:0; padding-left: 18px; color: var(--landing-text-light, rgba(255,255,255,.9)); font-size: 14px; line-height: 1.5; }
.compare-body .cr{ color: var(--landing-text-light); }
.compare-more{ display:none; padding: 0 12px 12px; }
.compare-more.is-open{ display:block; }
.compare-more-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 8px 0; font-size: 14px; }
.compare-more-btn{
  width:100%;
  border:0;
  background: rgba(255,255,255,.10);
  color:#fff;
  padding: 12px 14px;
  font-weight: 900;
  cursor: pointer;
}
@media (max-width: 720px){ .compare-body{ gap: 8px; } }

/* D) Promotion badge only */
.promotion-badge-only .promotion-banner{ padding: 12px 16px; }
.promotion-banner-title{ font-weight: 800; }
.promotion-detail-btn{ font-weight: 700; }

/* E) Inquiry section */
.landing-inquiry .btn-hero-secondary{ border-color: rgba(255,255,255,.3); color: #fff; }

/* F) Footer */
body.index-page .footer-landing,
.footer-landing{ background: #0b2a24; color: rgba(255,255,255,.9); padding: 24px 16px; text-align: center; }
.footer-landing .footer-links{ margin-bottom: 12px; }
.footer-landing .footer-links a{ margin: 0 12px; color: rgba(255,255,255,.85); text-decoration: none; }
.footer-landing .footer-company{ font-size: 13px; color: rgba(255,255,255,.7); line-height: 1.6; }
.footer-landing .footer-name{ font-weight: 800; display: block; margin-bottom: 4px; }
.footer-landing .footer-contact{ margin-top: 12px; }
.footer-landing .footer-contact a{ margin: 0 10px; color: var(--landing-accent-gold, #e8c547); text-decoration: none; }
.footer-landing .footer-copy{ margin-top: 16px; font-size: 12px; opacity: .7; }

/* =========================
   Hero 2버튼 분기 / 모달 inert·폰트 / 문의 중앙
   ========================= */
html{ scroll-behavior: smooth; }

/* 랜딩 모달: 폰트 색상 보이게 (배경 밝게) */
.landing-modal .modal-content{ background: #fff; color: #111; }
.landing-modal .modal-header{ border-bottom-color: rgba(0,0,0,.1); }
.landing-modal .modal-title{ color: #111; }
.landing-modal .modal-body{ color: #111; }
.landing-modal .modal-body p,
.landing-modal .modal-body .form-label,
.landing-modal .modal-body .form-control,
.landing-modal .modal-body .form-select,
.landing-modal .modal-body .form-check{ color: #111; }
.landing-modal .btn-close{ filter: invert(1); }
.landing-modal-iframe{ min-height: 60vh; width: 100%; border: 0; display: block; }

/* 문의하기 섹션 센터 정렬 */
.landing-inquiry{ text-align: center; }
.landing-inquiry .landing-container{ text-align: center; }
.landing-inquiry .landing-cta-row{ justify-content: center; }