/*
Theme Name: Dream Journal
Theme URI: https://example.com/dream-journal
Author: Dream Journal
Description: A magical Disney lifestyle blog theme - feminine pastel design with sparkle effects.
Version: 2.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: dream-journal
*/

/* ══════ RESET ══════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ══════ CSS VARIABLES ══════ */
:root{
  --pink:#E8729A;
  --pink-light:#F5A3BE;
  --pink-pale:#FDE4ED;
  --pink-mist:#FFF2F6;
  --blue:#89C4E8;
  --blue-light:#B8DCF2;
  --blue-pale:#E4F2FB;
  --blue-mist:#F2F9FF;
  --gold:#D4A574;
  --gold-light:#E8C9A8;
  --lilac:#C4A2E0;
  --lilac-pale:#F0E6F8;
  --mint:#8CD4C0;
  --mint-pale:#E0F6F0;
  --peach:#F2B89C;
  --peach-pale:#FDE8DC;
  --cream:#FFFBF8;
  --blush:#FFF5F8;
  --white:#FFFFFF;
  --tx:#3A2030;
  --tx-mid:#7A5A6A;
  --tx-soft:#B89AAA;
  --radius:20px;
  --radius-sm:14px;
}

::selection{background:rgba(232,114,154,.25);color:var(--tx)}
html{scroll-behavior:smooth}

body{
  font-family:'Zen Maru Gothic','Hiragino Maru Gothic Pro','Yu Gothic',sans-serif;
  background:var(--cream);color:var(--tx);
  line-height:1.8;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}

/* scrollbar */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--pink-light),var(--blue-light));border-radius:3px}

/* ══════ TYPOGRAPHY ══════ */
.font-display{font-family:'Quicksand','Zen Maru Gothic',sans-serif;font-weight:700}
.font-body{font-family:'Zen Maru Gothic','Hiragino Maru Gothic Pro',sans-serif}
.font-ui{font-family:'Quicksand','Zen Maru Gothic',sans-serif}

/* ══════ CURSOR (CSS part) ══════ */
@media(hover:hover){
  body{cursor:none}
  a,button{cursor:none}
}
#dj-cursor-dot{
  position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;
  background:linear-gradient(135deg,var(--pink),var(--blue));
  box-shadow:0 0 12px rgba(232,114,154,.3);
  z-index:99999;pointer-events:none;
  transform:translate(-100px,-100px);
  will-change:transform;
}
#dj-cursor-ring{
  position:fixed;top:0;left:0;width:36px;height:36px;border-radius:50%;
  border:2px solid rgba(232,114,154,.2);
  z-index:99998;pointer-events:none;
  transform:translate(-100px,-100px);
  will-change:transform;
}

/* ══════ LOADING OVERLAY ══════ */
#dj-loading{
  position:fixed;inset:0;z-index:100000;
  background:linear-gradient(135deg,var(--pink-mist),var(--blush),var(--blue-mist));
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transition:opacity .8s ease;
}
#dj-loading.done{opacity:0;pointer-events:none}
#dj-loading .ld-title{
  font-family:'Quicksand',sans-serif;font-size:24px;font-weight:700;
  letter-spacing:4px;margin-bottom:6px;
  background:linear-gradient(90deg,var(--pink),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
#dj-loading .ld-sub{
  font-family:'Zen Maru Gothic',sans-serif;font-size:12px;
  color:var(--tx-mid);letter-spacing:2px;margin-bottom:28px;
}
#dj-loading .ld-bar{
  width:140px;height:4px;background:var(--pink-pale);border-radius:2px;overflow:hidden;
}
#dj-loading .ld-bar-fill{
  height:100%;width:0;border-radius:2px;
  background:linear-gradient(90deg,var(--pink),var(--pink-light),var(--blue));
  animation:ldFill 1.2s ease-out forwards;
}
@keyframes ldFill{0%{width:0}100%{width:100%}}

/* ══════ NAV ══════ */
.dj-nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:18px 40px;
  display:flex;align-items:center;justify-content:space-between;
  transition:all .4s ease;
}
.dj-nav.scrolled{
  padding:10px 40px;
  background:rgba(255,245,248,.92);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(232,114,154,.06);
  box-shadow:0 2px 20px rgba(232,114,154,.04);
}
.nav-logo{display:flex;align-items:center;gap:8px}
.nav-logo-text{
  font-family:'Quicksand',sans-serif;font-size:16px;font-weight:700;letter-spacing:2px;
  background:linear-gradient(90deg,var(--pink),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.nav-search{
  width:36px;height:36px;border-radius:12px;
  background:linear-gradient(135deg,rgba(232,114,154,.06),rgba(137,196,232,.06));
  border:1.5px solid rgba(232,114,154,.15);
  display:flex;align-items:center;justify-content:center;
  transition:all .3s cubic-bezier(.34,1.56,.64,1);
}
.nav-search:hover{
  transform:scale(1.1);border-color:var(--pink);
  box-shadow:0 4px 16px rgba(232,114,154,.12);
}

/* ══════ HERO ══════ */
.dj-hero{
  position:relative;min-height:100vh;
  background:linear-gradient(155deg,var(--pink-mist) 0%,var(--blush) 20%,var(--cream) 45%,var(--blue-mist) 70%,var(--lilac-pale) 100%);
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  overflow:hidden;
}
.dj-hero .blob{
  position:absolute;border-radius:50%;pointer-events:none;
  animation:blobFloat 12s ease-in-out infinite;
}
@keyframes blobFloat{
  0%,100%{transform:translate(0,0) scale(1)}
  33%{transform:translate(16px,-18px) scale(1.05)}
  66%{transform:translate(-10px,12px) scale(.95)}
}
.hero-castle{
  position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);
  opacity:.03;pointer-events:none;
}
.hero-inner{
  position:relative;z-index:2;text-align:center;
  max-width:640px;padding:0 20px;
  animation:heroIn 1s cubic-bezier(.34,1.56,.64,1) .5s both;
}
@keyframes heroIn{
  from{opacity:0;transform:translateY(20px) scale(.96)}
  to{opacity:1;transform:none}
}
.hero-label{
  font-family:'Quicksand',sans-serif;font-size:10px;letter-spacing:6px;
  color:var(--tx-soft);text-transform:uppercase;margin-bottom:24px;font-weight:600;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.hero-title{
  font-family:'Quicksand',sans-serif;font-size:52px;font-weight:700;
  line-height:1.25;margin-bottom:18px;letter-spacing:3px;
  background:linear-gradient(135deg,var(--pink) 0%,var(--pink-light) 35%,var(--blue) 65%,var(--blue-light) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 2px 8px rgba(232,114,154,.12));
}
.hero-divider{
  display:flex;justify-content:center;align-items:center;gap:10px;margin-bottom:20px;
}
.hero-divider .line-l{width:28px;height:1px;background:linear-gradient(90deg,transparent,var(--pink-light));border-radius:1px}
.hero-divider .line-r{width:28px;height:1px;background:linear-gradient(90deg,var(--blue-light),transparent);border-radius:1px}
.hero-desc{
  font-size:15px;color:var(--tx-mid);line-height:2.2;
  max-width:340px;margin:0 auto;font-weight:500;
}
.scroll-hint{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:4px;
  z-index:2;opacity:.45;animation:bob 2.4s ease-in-out infinite;
}
.scroll-hint span{
  font-family:'Quicksand',sans-serif;font-size:9px;letter-spacing:3px;
  color:var(--tx-soft);text-transform:uppercase;font-weight:700;
}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(5px)}}

/* ══════ SECTION HEADERS ══════ */
.sec-label{
  font-family:'Quicksand',sans-serif;font-size:11px;letter-spacing:5px;
  color:var(--pink);font-weight:700;text-transform:uppercase;
  text-align:center;margin-bottom:8px;
}
.sec-title{
  font-family:'Quicksand',sans-serif;font-size:28px;font-weight:700;
  color:var(--tx);letter-spacing:2px;text-align:center;margin-bottom:40px;
}

/* ══════ STORIES SECTION ══════ */
.sec-stories{background:var(--cream);padding:80px 80px 80px;position:relative}
.sec-stories .inner{max-width:940px;margin:0 auto;position:relative;z-index:2}

/* ══════ FEATURED CARD ══════ */
.card-feat{
  display:block;position:relative;overflow:hidden;
  background:linear-gradient(145deg,var(--white),rgba(255,245,248,.4));
  border-radius:var(--radius);padding:38px 36px;
  border:2px solid rgba(232,114,154,.08);
  transition:all .45s cubic-bezier(.34,1.56,.64,1);
  box-shadow:0 4px 24px rgba(232,114,154,.05);
}
.card-feat:hover{
  transform:translateY(-6px);
  border-color:rgba(232,114,154,.3);
  box-shadow:0 24px 56px rgba(232,114,154,.1);
}
.card-feat .feat-blob{
  position:absolute;top:-60px;right:-60px;width:200px;height:200px;border-radius:50%;
  opacity:.25;transition:opacity .5s;pointer-events:none;
}
.card-feat:hover .feat-blob{opacity:.55}
.card-feat .feat-star{
  position:absolute;top:14px;right:16px;opacity:.2;transition:opacity .4s;
}
.card-feat:hover .feat-star{opacity:.6}
.card-feat .feat-inner{position:relative;z-index:1}
.tag-row{display:flex;align-items:center;gap:8px;margin-bottom:18px;flex-wrap:wrap}
.tag{
  padding:5px 16px;border-radius:20px;
  font-family:'Quicksand',sans-serif;font-size:11px;font-weight:700;letter-spacing:1px;
  display:inline-flex;align-items:center;gap:4px;
}
.tag-pickup{
  background:linear-gradient(90deg,rgba(232,114,154,.08),rgba(137,196,232,.08));
  color:var(--pink);
}
.feat-title{
  font-family:'Zen Maru Gothic',sans-serif;
  font-size:22px;font-weight:700;color:var(--tx);line-height:1.75;margin-bottom:4px;
}
.feat-sub{font-size:14px;color:var(--tx-mid);margin-bottom:12px}
.feat-excerpt{font-size:14px;color:var(--tx-soft);line-height:1.95;max-width:520px}
.feat-foot{display:flex;align-items:center;gap:10px;margin-top:24px}
.btn-read{
  display:inline-block;padding:9px 24px;border-radius:24px;
  background:var(--pink-pale);color:var(--pink);
  font-family:'Quicksand',sans-serif;font-size:12px;font-weight:700;letter-spacing:1px;
  transition:all .4s;border:none;
}
.card-feat:hover .btn-read{
  background:linear-gradient(90deg,var(--pink),var(--pink-light),var(--blue));
  color:var(--white);box-shadow:0 4px 16px rgba(232,114,154,.2);
}
.feat-date{
  margin-left:auto;font-family:'Quicksand',sans-serif;
  font-size:11px;color:var(--tx-soft);font-weight:500;
}

/* ══════ ARTICLE GRID ══════ */
.art-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:16px}
.art-grid:empty,
.art-grid:not(:has(.card-sm)) {
  display: none;
}

/* ══════ SMALL CARD ══════ */
.card-sm{
  display:flex;flex-direction:column;justify-content:space-between;
  min-height:215px;position:relative;overflow:hidden;
  background:var(--white);border-radius:var(--radius);padding:24px 22px;
  border:1.5px solid rgba(232,114,154,.06);
  transition:all .4s cubic-bezier(.34,1.56,.64,1);
  box-shadow:0 2px 16px rgba(232,114,154,.03);
}
.card-sm:hover{transform:translateY(-5px) scale(1.01)}
.card-sm .accent-bar{
  position:absolute;top:0;left:0;right:0;height:4px;
  border-radius:var(--radius) var(--radius) 0 0;
  opacity:.3;transition:opacity .4s;
}
.card-sm:hover .accent-bar{opacity:1}
.card-sm .cat-row{display:flex;align-items:center;gap:7px;margin-bottom:14px}
.cat-dot{width:8px;height:8px;border-radius:50%;transition:box-shadow .3s}
.card-sm:hover .cat-dot{box-shadow:0 0 10px currentColor}
.cat-name{
  font-family:'Quicksand',sans-serif;font-size:10px;font-weight:700;letter-spacing:1.5px;
}
.sm-title{
  font-size:16px;font-weight:700;color:var(--tx);
  line-height:1.75;margin-bottom:6px;transition:color .3s;
}
.sm-excerpt{font-size:13px;color:var(--tx-soft);line-height:1.85}
.sm-meta{
  display:flex;justify-content:space-between;margin-top:14px;
  padding-top:12px;border-top:1px solid rgba(232,114,154,.05);
  font-family:'Quicksand',sans-serif;font-size:10px;color:var(--tx-soft);font-weight:600;
}

/* ══════ CATEGORIES ══════ */
.sec-cats{
  padding:60px 40px;position:relative;overflow:clip;
  background:linear-gradient(155deg,var(--pink-pale) 0%,var(--blush) 25%,var(--blue-pale) 55%,var(--lilac-pale) 85%,var(--pink-mist) 100%);
}
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.card-cat{
  display:block;padding:30px 20px;text-align:center;
  border-radius:22px;position:relative;overflow:hidden;
  background:rgba(255,255,255,.8);backdrop-filter:blur(8px);
  border:1.5px solid rgba(232,114,154,.1);
  transition:all .4s cubic-bezier(.34,1.56,.64,1);
  box-shadow:0 2px 12px rgba(232,114,154,.04);
}
.card-cat:hover{
  transform:translateY(-5px) scale(1.02);
  background:rgba(255,255,255,.95);
}
.card-cat .cc-star{position:absolute;top:10px;right:12px;opacity:.15;transition:opacity .4s}
.card-cat:hover .cc-star{opacity:.5}
.cc-icon{
  width:44px;height:44px;border-radius:16px;
  margin:0 auto 14px;display:flex;align-items:center;justify-content:center;
  transition:all .4s cubic-bezier(.34,1.56,.64,1);
}
.card-cat:hover .cc-icon{transform:scale(1.15) rotate(5deg)}
.cc-dot{width:12px;height:12px;border-radius:50%;opacity:.8}
.cc-name{
  font-family:'Quicksand',sans-serif;font-size:14px;font-weight:700;
  letter-spacing:1.5px;margin-bottom:6px;color:var(--tx);transition:color .3s;
}
.cc-ja{font-size:12px;color:var(--tx-soft)}

/* ══════ FOOTER ══════ */
.dj-footer{padding:36px 40px 20px;background:var(--cream);border-top:1px solid rgba(232,114,154,.04)}
.ft-inner{max-width:940px;margin:0 auto}
.ft-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.ft-logo{display:flex;align-items:center;gap:7px}
.ft-logo-text{font-family:'Quicksand',sans-serif;font-size:13px;font-weight:700;color:var(--tx-soft);letter-spacing:2px}
.ft-social{display:flex;gap:16px}
.ft-social a{
  font-family:'Quicksand',sans-serif;font-size:10px;color:var(--tx-soft);
  letter-spacing:1.5px;font-weight:600;transition:color .3s;
}
.ft-social a:hover{color:var(--pink)}
.ft-line{height:1px;margin-bottom:14px;background:linear-gradient(90deg,rgba(232,114,154,.06),rgba(137,196,232,.06),rgba(232,114,154,.06))}
.ft-copy{
  font-family:'Quicksand',sans-serif;font-size:10px;
  color:rgba(184,154,170,.5);letter-spacing:2px;text-align:center;font-weight:500;
}

/* ══════ SINGLE POST ══════ */
.single-wrap{max-width:720px;margin:0 auto;padding:120px 24px 80px}
.single-wrap .entry-title{
  font-family:'Zen Maru Gothic',sans-serif;font-size:28px;font-weight:700;
  color:var(--tx);line-height:1.7;margin-bottom:16px;
}
.single-wrap .entry-meta{
  font-family:'Quicksand',sans-serif;font-size:12px;color:var(--tx-soft);
  letter-spacing:1px;margin-bottom:40px;display:flex;align-items:center;gap:12px;
}
.single-wrap .entry-content{font-size:16px;line-height:2.2;color:var(--tx)}
.single-wrap .entry-content p{margin-bottom:1.8em}
.single-wrap .entry-content h2{
  font-family:'Quicksand',sans-serif;font-size:22px;color:var(--tx);
  margin:2.5em 0 1em;padding-bottom:10px;border-bottom:2px solid var(--pink-pale);
}
.single-wrap .entry-content h3{
  font-family:'Quicksand',sans-serif;font-size:18px;color:var(--pink);
  margin:2em 0 .8em;
}
.single-wrap .entry-content img{border-radius:16px;margin:2em 0;box-shadow:0 8px 32px rgba(232,114,154,.08)}
.single-wrap .entry-content a{color:var(--pink);border-bottom:1px solid var(--pink-pale);transition:border-color .3s}
.single-wrap .entry-content a:hover{border-color:var(--pink)}
.single-wrap .entry-content blockquote{
  border-left:3px solid var(--pink-light);padding:16px 24px;margin:2em 0;
  background:var(--pink-mist);border-radius:0 12px 12px 0;color:var(--tx-mid);
}
.post-nav{margin-top:60px;padding-top:30px;border-top:1px solid var(--pink-pale);display:flex;gap:20px}
.post-nav a{
  flex:1;padding:16px 20px;border-radius:16px;transition:all .3s;
}
.post-nav a:hover{filter:brightness(.97)}
.post-nav .pn-label{
  font-family:'Quicksand',sans-serif;font-size:10px;color:var(--tx-soft);
  letter-spacing:2px;margin-bottom:6px;
}
.post-nav .pn-title{font-size:14px;color:var(--tx);font-weight:700;line-height:1.6}

/* ══════ SCROLL REVEAL ══════ */
.rv{opacity:0;transform:translateY(24px);transition:all .65s cubic-bezier(.34,1.56,.64,1)}
.rv.show{opacity:1;transform:none}

/* ══════ RESPONSIVE ══════ */
@media(max-width:768px){
  .hero-title{font-size:34px}
  .art-grid{grid-template-columns:1fr}
  .cat-grid{grid-template-columns:repeat(2,1fr)}
  .dj-nav{padding:12px 20px}
  .sec-stories,.sec-cats{padding:60px 20px}
  .card-feat{padding:28px 22px}
  .sec-title{font-size:22px}
}
@media(max-width:480px){
  .hero-title{font-size:28px;letter-spacing:1px}
  .cat-grid{grid-template-columns:1fr}
  .hero-label{font-size:8px;letter-spacing:4px}
}
