
/* Global Reset & Body */
body {color: black;font-family: "Plus Jakarta Sans", sans-serif;line-height: 1.6;font-size: 1rem;max-width: 900px;margin: 0 auto;padding: 0 20px;background: linear-gradient(270deg, #EADDCA, #e6dcdc, #d7e2e1);background-size: 600% 600%;animation: BackgroundFlow 15s ease infinite;}
@media screen and (max-width: 480px) {
body { font-size: 1.2rem; background: #efe5d7; }}
@keyframes BackgroundFlow {0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%}}
h3 { font-size: 1.2rem; margin: 1em 0 .5em; font-weight: 500; color: #1F1F1F; line-height:1.2; }


/* Intro Section */
#intro-wrap { padding: 30px 0; text-align: center; border-radius: 0 0 50px 50px; margin-bottom: 40px; }
.intro-content { display: flex; flex-direction: column; align-items: center; margin-top: 50px; }
.intro-title { font-family: "Love Ya Like A Sister", cursive; font-size: 50px; color: #000209; font-weight: 900; position: relative; z-index: 1; }
.intro-title:before { content: ''; background: #c3e6e478; height: 70px; width: 70px; position: absolute; border-radius: 50%; z-index: -1; top: -5px; left: -20px; }
.intro-snippet { font-size: 18px; color: #3b3b3c; overflow: hidden; border-right: .15em solid #fdeea5; white-space: nowrap; margin: 0 auto; letter-spacing: .15em; animation: typing 3.5s steps(40, end), blink-caret .75s step-end infinite; }
@keyframes typing { from { width: 0 } to { width: 100% } }
@keyframes blink-caret { 50% { border-color: transparent } }
.intro-action a { display: inline-block; height: 60px; line-height: 60px; color: #000209; background: #fdeea5; font-size: 21px; font-weight: 700; padding: 0 30px; margin-top: 30px; border: 2px solid #000209; border-radius: 8px; box-shadow: 4px 4px 0px 0px #000209; transition: all .17s ease; text-decoration: none; }
.intro-action a:hover { background: #000209; color: #fff; transform: translate(-2px, -2px); box-shadow: 6px 6px 0px 0px #000209; }

/* Posts & Archive */
.item-post { background: #fff; padding: 40px; border-radius: 15px; margin-top: 20px; box-shadow: 0 4px 20px rgba(0,0,0,0.05); }
.item-post h1 { font-size: 2.2rem; color: #000209; margin-bottom: 25px; }

/* Mantra */
.mantra-container { margin-top: 60px; padding: 40px 20px; text-align: center; border-top: 2px dashed #c3e6e4; background: #fff; border-radius: 30px; }
.mantra-text { font-size: 1.3rem; font-family: "Love Ya Like A Sister", cursive;font-style: italic; color: #333; line-height: 1.8; position: relative; }
.mantra-text { opacity: 0; animation: fadeInMantra 2s forwards; }
@keyframes fadeInMantra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.mantra-author { display: block; margin-top: 20px; font-size: 0.8rem; letter-spacing: 3px; color: #b2b2b2; text-transform: uppercase; font-weight: bold; }

/* Jempol Kaki */
#fake-scrollbar-area{position:fixed;top:0;right:0;width:80px;height:100%;z-index:999999;background:rgba(0,0,0,0.01);cursor:pointer;}
#fake-scrollbar-thumb{position:absolute;right:5px;width:80px;height:80px;background:#fdeea5;border-radius:50%;opacity:0.9;box-shadow:0 0 15px rgba(253,238,165,0.5);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:&#39;roboto&#39;,sans-serif;font-size:14px;color:#000;font-weight:800;transition:transform 0.1s linear;line-height:1.1;text-align:center;pointer-events:none;}

/* Partikel */
.particles { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; z-index: 1; pointer-events: none; }
.particle { position: absolute; background: #5D4037; border-radius: 50%; animation: float 15s infinite linear; box-shadow: 0 0 10px #fdeea5; }
@keyframes float { 0% { transform: translateY(110vh) scale(0.5); opacity: 0; } 50% { opacity: 0.8; } 100% { transform: translateY(-10vh) scale(1.2); opacity: 0; } }

/* Quote */
blockquote {position: relative;padding: 28px 10px;border: none;background: #fff;text-align: center;font-size: 1.3em;color: #444;}
blockquote::before {content: "\201C"; /* Tanda kutip pembuka */font-size: 80px;color: #e67e22; /* Warna orange/gold untuk 'Spark' */position: absolute; top: -30px;left: 20px;font-family: serif;}
blockquote footer {margin-top: 10px;font-weight: bold;font-size: 0.9em;color: #888;}
