.aasp-history {
    /* ปรับเป็น AASP Theme */
    --navy: #2D2769;          /* aasp-indigo */
    --purple: #D1236B;        /* aasp-primary */
    --soft: #FDEBF3;          /* aasp-primary-light */
    --soft-2: #FFFDF9;        /* aasp-bg-cream */
    --border: #E5CDD8;        /* ปรับโทนขอบให้เข้ากับสีชมพู */
    --text: #1E1A47;          /* aasp-indigo-dark */
    --muted: #6B668A;         /* ปรับสีเทาให้กลืนกับ indigo */
    color: var(--text);
}
.aasp-history-title { color: var(--navy); font-size: clamp(28px, 3vw, 36px); font-weight: 600; line-height: 1.3; text-align: center; }

/* Intro */
.aasp-history-intro {
    position: relative; overflow: hidden; margin-top: 30px; margin-bottom: 25px; padding: 30px 34px;
    background: linear-gradient(135deg, var(--soft-2), var(--soft)); /* ใช้ soft theme */
    border: 1px solid var(--border); border-radius: 18px;
}
.aasp-history-intro:after {
    content: ""; position: absolute; top: -80px; right: -60px; width: 220px; height: 220px;
    background: rgba(209, 35, 107, .07); /* aasp-primary-rgb */
    border-radius: 50%;
}
.aasp-intro-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 180px 1fr; gap: 32px; align-items: center; }
.aasp-year-block { padding-right: 30px; border-right: 1px solid var(--border); text-align: center; }
.aasp-year-label { color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.aasp-year { color: var(--purple); font-size: 48px; font-weight: 700; line-height: 1.1; }
.aasp-year-text { margin-top: 5px; color: var(--navy); font-size: 13px; font-weight: 600; }
.aasp-intro-text { margin: 0; color: var(--text); font-size: 16px; font-weight: 400; line-height: 1.85; }

/* Conference Highlight */
.aasp-mission {
    display: flex; align-items: flex-start; gap: 18px; margin-bottom: 38px; padding: 22px 25px;
    background: #fff; border: 1px solid var(--border); border-radius: 14px;
}
.aasp-mission-icon {
    flex: 0 0 46px; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px;
    color: var(--purple); background: var(--soft); border-radius: 12px;
}
.aasp-mission-icon svg { width: 22px; height: 22px; }
.aasp-mission-title { margin-bottom: 4px; color: var(--navy); font-size: 17px; font-weight: 700; }
.aasp-mission-text { margin: 0; color: var(--text); font-size: 15px; line-height: 1.8; }

/* Timeline */
.aasp-timeline-header { display: flex; align-items: center; gap: 14px; margin-bottom: 25px; }
.aasp-timeline-header h3 { margin: 0; color: var(--navy); font-size: 22px; font-weight: 700; white-space: nowrap; }
.aasp-timeline-header:after { content: ""; width: 100%; height: 1px; background: var(--border); }
.aasp-timeline { position: relative; margin-left: 9px; padding-left: 35px; }
.aasp-timeline:before {
    content: ""; position: absolute; top: 10px; bottom: 12px; left: 6px; width: 2px;
    background: linear-gradient(to bottom, var(--purple), var(--border)); /* อัปเดตสีเส้น timeline */
}
.aasp-timeline-item {
    position: relative; margin-bottom: 14px; padding: 17px 21px; background: #fff;
    border: 1px solid var(--border); border-radius: 13px;
    transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.aasp-timeline-item:last-child { margin-bottom: 0; }
.aasp-timeline-item:hover { border-color: var(--purple); transform: translateX(3px); box-shadow: 0 5px 18px rgba(45, 39, 105, .06); } /* อิงจากสี indigo */
.aasp-timeline-dot {
    position: absolute; top: 23px; left: -36px; width: 14px; height: 14px; background: #fff;
    border: 4px solid var(--purple); border-radius: 50%; box-shadow: 0 0 0 4px #fff;
}
.aasp-timeline-row { display: flex; align-items: flex-start; gap: 18px; }
.aasp-timeline-year { flex: 0 0 58px; color: var(--purple); font-size: 17px; font-weight: 700; }
.aasp-timeline-content { flex: 1; min-width: 0; }
.aasp-timeline-place { color: var(--navy); font-size: 15px; font-weight: 700; line-height: 1.5; }
.aasp-timeline-desc { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.aasp-badge {
    display: inline-flex; align-items: center; margin-left: 7px; padding: 3px 8px; color: var(--purple);
    background: var(--soft); border-radius: 20px; font-size: 10px; font-weight: 700; line-height: 1.4; 
    letter-spacing: .2px; text-transform: uppercase; vertical-align: middle;
}
.aasp-timeline-item.highlight { background: var(--soft-2); border-color: var(--border); }

/* Current Conference 2027 */
.aasp-timeline-item.current {
    overflow: hidden; background: linear-gradient(135deg, var(--soft-2), var(--soft)); border-color: var(--purple);
}
.aasp-timeline-item.current:after {
    content: ""; position: absolute; top: 0; right: 0; width: 5px; height: 100%; background: var(--purple);
}
.aasp-timeline-item.current .aasp-timeline-dot {
    background: var(--purple); border-color: var(--purple); box-shadow: 0 0 0 5px var(--soft);
}
.aasp-timeline-item.current .aasp-timeline-year { font-size: 20px; }
.aasp-timeline-item.current .aasp-timeline-place { font-size: 17px; }
.aasp-timeline-item.current .aasp-badge { color: #fff; background: var(--purple); }

/* Responsive */
@media(max-width:767.98px) {
    .aasp-history-title { font-size: 27px; }
    .aasp-history-intro { margin-top: 22px; padding: 24px 20px; }
    .aasp-intro-grid { grid-template-columns: 1fr; gap: 18px; }
    .aasp-year-block { padding: 0 0 18px; border-right: 0; border-bottom: 1px solid var(--border); }
    .aasp-year { font-size: 42px; }
    .aasp-intro-text { font-size: 14px; line-height: 1.8; }
    .aasp-mission { padding: 18px; gap: 14px; margin-bottom: 32px; }
    .aasp-mission-text { font-size: 14px; }
    .aasp-timeline-header h3 { font-size: 19px; }
    .aasp-timeline { padding-left: 27px; }
    .aasp-timeline-item { padding: 15px 16px; }
    .aasp-timeline-dot { left: -28px; }
    .aasp-timeline-row { display: block; }
    .aasp-timeline-year { margin-bottom: 3px; font-size: 16px; }
    .aasp-timeline-item.current .aasp-timeline-year { font-size: 18px; }
    .aasp-timeline-item.current .aasp-timeline-place { font-size: 16px; }
    .aasp-badge { margin: 5px 0 0; }
}

/* ========== MODERN TIMELINE ========== */
.aasp-timeline-modern{margin-left:0;padding:12px 0 5px 64px}
.aasp-timeline-modern:before{left:28px;top:20px;bottom:45px;width:2px;background:linear-gradient(180deg,rgba(209,35,107,.25) 0%,var(--purple) 72%,var(--purple) 100%)}
.aasp-timeline-modern .aasp-timeline-item{margin-bottom:10px;padding:15px 20px;background:#fff;border:1px solid #ebe5e9;border-radius:14px;box-shadow:0 3px 12px rgba(45,39,105,.025);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.aasp-timeline-modern .aasp-timeline-item:hover{transform:translateX(4px);border-color:rgba(209,35,107,.45);box-shadow:0 9px 24px rgba(45,39,105,.07)}
.aasp-timeline-modern .aasp-timeline-dot{top:50%;left:-43px;width:12px;height:12px;transform:translateY(-50%);background:#fff;border:3px solid #d7a0b8;box-shadow:0 0 0 5px #fff}
.aasp-timeline-modern .aasp-timeline-row{align-items:center;gap:20px}
.aasp-timeline-modern .aasp-timeline-year{flex:0 0 62px;font-size:16px;font-weight:800;letter-spacing:-.3px}
.aasp-timeline-modern .aasp-timeline-place{font-size:15px}
.aasp-timeline-modern .aasp-timeline-desc{margin-top:3px;font-size:13px;line-height:1.6}
.aasp-timeline-modern .aasp-badge{padding:3px 9px;font-size:9px;letter-spacing:.35px}
.aasp-timeline-modern .aasp-timeline-item.highlight{background:#fff;border-color:#eadde3}
.aasp-timeline-modern .aasp-timeline-item.highlight .aasp-timeline-dot{background:#fff;border-color:var(--purple)}
.aasp-timeline-modern .aasp-timeline-item.highlight .aasp-timeline-year{color:var(--purple)}
.aasp-timeline-modern .aasp-timeline-item.milestone{border-left:3px solid #d99a24}
.aasp-timeline-modern .aasp-timeline-item.milestone .aasp-badge{color:#9a6500;background:#fff5da}
.aasp-timeline-modern .aasp-timeline-item.virtual{border-left:3px solid #665ab5}
.aasp-timeline-modern .aasp-timeline-item.virtual .aasp-badge{color:#51479b;background:#efedff}
.aasp-timeline-modern .aasp-timeline-item.current{position:relative;margin-top:22px;margin-left:-10px;padding:27px 28px 24px;overflow:visible;background:linear-gradient(135deg,#fff 0%,#fff8fb 48%,#fdebf3 100%);border:2px solid var(--purple);border-radius:20px;box-shadow:0 16px 40px rgba(209,35,107,.16),0 5px 16px rgba(45,39,105,.08);transform:translateX(10px)}
.aasp-timeline-modern .aasp-timeline-item.current:hover{transform:translateX(10px) translateY(-4px);border-color:var(--purple);box-shadow:0 22px 50px rgba(209,35,107,.22),0 8px 20px rgba(45,39,105,.1)}
.aasp-timeline-modern .aasp-timeline-item.current:before{content:"";position:absolute;inset:-7px;border:1px solid rgba(209,35,107,.12);border-radius:25px;pointer-events:none}
.aasp-timeline-modern .aasp-timeline-item.current:after{content:"";position:absolute;top:18px;right:-2px;width:6px;height:calc(100% - 36px);background:linear-gradient(180deg,var(--purple),#ec5b97);border-radius:6px 0 0 6px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-row{align-items:center}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-year{flex:0 0 78px;color:var(--purple);font-size:28px;font-weight:800;letter-spacing:-1px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-place{color:var(--navy);font-size:19px;font-weight:800}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-desc{max-width:900px;margin-top:8px;color:#5f5978;font-size:14px;line-height:1.7}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-badge{margin-left:8px;padding:5px 11px;color:#fff;background:linear-gradient(135deg,var(--purple),#aa1553);box-shadow:0 4px 10px rgba(209,35,107,.22);font-size:9px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-dot{left:-45px;width:18px;height:18px;background:var(--purple);border:4px solid #fff;box-shadow:0 0 0 3px var(--purple),0 0 0 8px rgba(209,35,107,.12);animation:aaspCurrentPulse 2.5s ease-in-out infinite}
.aasp-current-label{position:absolute;top:-15px;left:26px;display:inline-flex;align-items:center;gap:6px;padding:6px 13px;color:#fff;background:linear-gradient(135deg,var(--navy),var(--purple));border:3px solid #fff;border-radius:999px;box-shadow:0 5px 14px rgba(45,39,105,.18);font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase}
.aasp-current-label i{color:#feb713;font-size:12px}
@keyframes aaspCurrentPulse{0%,100%{box-shadow:0 0 0 3px var(--purple),0 0 0 7px rgba(209,35,107,.09)}50%{box-shadow:0 0 0 3px var(--purple),0 0 0 13px rgba(209,35,107,0)}}
@media(max-width:767.98px){
.aasp-timeline-modern{padding-left:38px}
.aasp-timeline-modern:before{left:14px}
.aasp-timeline-modern .aasp-timeline-dot{left:-31px}
.aasp-timeline-modern .aasp-timeline-row{display:block}
.aasp-timeline-modern .aasp-timeline-year{margin-bottom:3px}
.aasp-timeline-modern .aasp-timeline-item.current{margin-top:25px;margin-left:0;padding:27px 18px 20px;transform:none}
.aasp-timeline-modern .aasp-timeline-item.current:hover{transform:translateY(-3px)}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-dot{left:-34px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-year{margin-bottom:6px;font-size:24px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-place{font-size:17px}
.aasp-timeline-modern .aasp-timeline-item.current .aasp-badge{display:table;margin:7px 0 0}
.aasp-current-label{left:16px}
}
@media(prefers-reduced-motion:reduce){.aasp-timeline-modern .aasp-timeline-item.current .aasp-timeline-dot{animation:none}}
