/* ============================================================
   AIC Event Template — gaya About AIC (hero + isi konten)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;1,600&display=swap');

.aicev{
  --aicev-navy:#0A1830; --aicev-ink:#28374a; --aicev-mut:#5b6b7c; --aicev-line:#e5ecf3;
  --aicev-accent:#42A5F5;
  --aicev-grad:linear-gradient(120deg,#4FC3F7 0%,#42A5F5 45%,#7C4DFF 100%);
  font-family:inherit; color:var(--aicev-ink);
}
.aicev *{ box-sizing:border-box; }
.aicev-wrap{ max-width:1160px; margin:0 auto; padding:0 24px; }

/* ---------------- HERO (latar transparan, teks mengikuti mode) ---------------- */
.aicev-hero{ position:relative; background:transparent; color:var(--aicev-navy); padding:46px 0 12px; }
.aicev-crumb{ font-size:13px; color:rgba(10,24,48,.6); margin-bottom:22px; }
.aicev-crumb a{ color:rgba(10,24,48,.6); text-decoration:none; }
.aicev-crumb a:hover{ color:var(--aicev-navy); }
.aicev-crumb span{ margin:0 7px; opacity:.45; }
.aicev-crumb-cur{ color:var(--aicev-navy); margin:0; }

.aicev-eyebrow{
  display:inline-flex; align-items:center; gap:9px; margin-bottom:16px;
  font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--aicev-accent); background:rgba(66,165,245,.10); padding:6px 15px; border-radius:999px;
}
.aicev-eyebrow i{ width:6px; height:6px; border-radius:50%; background:currentColor; }

.aicev-title{
  margin:0; max-width:18ch; font-family:'Playfair Display',Georgia,serif; font-weight:600;
  font-size:clamp(34px,5vw,62px); line-height:1.06; letter-spacing:-1px;
}
.aicev .aicev-title{ color:var(--aicev-navy) !important; }
.aicev-title em{
  font-style:italic; background:var(--aicev-grad);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent !important;
}
.aicev-lead{ margin:18px 0 0; max-width:64ch; font-size:17px; line-height:1.7; color:var(--aicev-mut); }

/* ---------------- ISI KONTEN (lebar penuh, tidak terjepit) ---------------- */
.aicev-body{ padding-top:40px; padding-bottom:64px; }
.aicev-content{ min-width:0; overflow-wrap:break-word; word-wrap:break-word; font-size:16.5px; line-height:1.78; color:var(--aicev-ink); }
.aicev-content > *:first-child{ margin-top:0; }
.aicev-content p{ margin:0 0 18px; }
.aicev-content h2,
.aicev-content h3,
.aicev-content h4{
  font-family:'Playfair Display',Georgia,serif; font-weight:600; color:var(--aicev-navy);
  letter-spacing:-.3px; line-height:1.25; margin:34px 0 14px;
}
.aicev-content h2{ font-size:30px; }
.aicev-content h3{ font-size:24px; }
.aicev-content h4{ font-size:20px; }
.aicev-content h2 em, .aicev-content h3 em, .aicev-content h4 em{
  font-style:italic; background:var(--aicev-grad);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
}
.aicev-content ul, .aicev-content ol{ margin:0 0 18px; padding-left:0; list-style:none; }
.aicev-content ul li{ position:relative; margin:0 0 11px; padding-left:26px; }
.aicev-content ul li::before{ content:""; position:absolute; left:3px; top:.62em; width:8px; height:8px; border-radius:50%; background:var(--aicev-accent); }
.aicev-content ol{ counter-reset:aicev; }
.aicev-content ol li{ position:relative; margin:0 0 11px; padding-left:34px; counter-increment:aicev; }
.aicev-content ol li::before{ content:counter(aicev); position:absolute; left:0; top:.05em; width:22px; height:22px; border-radius:50%; background:rgba(66,165,245,.14); color:var(--aicev-accent); font-size:12px; font-weight:800; display:grid; place-items:center; }
.aicev-content a{ color:var(--aicev-accent); text-decoration:underline; text-underline-offset:2px; }
.aicev-content strong{ color:var(--aicev-navy); font-weight:700; }
.aicev-content img{ max-width:100%; height:auto; border-radius:12px; }
.aicev-content iframe, .aicev-content video{ max-width:100%; }
.aicev-content iframe{ width:100%; }
.aicev-content blockquote{ margin:24px 0; padding:14px 20px; border-left:4px solid var(--aicev-accent); background:rgba(66,165,245,.06); border-radius:0 10px 10px 0; color:var(--aicev-navy); font-style:italic; }
.aicev-content table{ width:100%; max-width:100%; border-collapse:collapse; margin:0 0 20px; font-size:15px; }
.aicev-content th, .aicev-content td{ padding:10px 14px; border:1px solid var(--aicev-line); text-align:left; }
.aicev-content th{ background:#f3f7fb; font-weight:700; color:var(--aicev-navy); }

/* ---------------- BACK ---------------- */
.aicev-backwrap{ margin-top:40px; }
.aicev-back{
  display:inline-flex; align-items:center; gap:9px; padding:12px 24px 12px 18px;
  border-radius:999px; border:1px solid rgba(10,24,48,.16); color:var(--aicev-navy);
  text-decoration:none; font-size:14px; font-weight:700;
  transition:background .22s,color .22s,border-color .22s;
}
.aicev-back:hover{ background:var(--aicev-navy); color:#fff; border-color:var(--aicev-navy); }
.aicev-back svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }

/* ---------------- DARK MODE ---------------- */
[data-theme="dark"] .aicev{ --aicev-ink:#d7e0ea; --aicev-line:rgba(255,255,255,.12); --aicev-mut:#aebccb; }
[data-theme="dark"] .aicev-hero{ color:#fff; }
[data-theme="dark"] .aicev .aicev-title{ color:#fff !important; }
[data-theme="dark"] .aicev-crumb,
[data-theme="dark"] .aicev-crumb a{ color:rgba(255,255,255,.72); }
[data-theme="dark"] .aicev-crumb a:hover,
[data-theme="dark"] .aicev-crumb-cur{ color:#fff; }
[data-theme="dark"] .aicev-lead{ color:rgba(255,255,255,.82); }
[data-theme="dark"] .aicev-content h2,
[data-theme="dark"] .aicev-content h3,
[data-theme="dark"] .aicev-content h4,
[data-theme="dark"] .aicev-content strong{ color:#fff; }
[data-theme="dark"] .aicev-back{ color:#fff; border-color:rgba(255,255,255,.25); }

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:560px){
  .aicev-hero{ padding:34px 0 8px; }
  .aicev-wrap{ padding:0 18px; }
  .aicev-content{ font-size:16px; }
}