/* ============================================================
   Love Reading — CAT FABLE 品牌矯正
   主角:三色貓(calico)・扁平 vector cute・天藍 #87CEEB + 橘黃 #F4A536
   依 Brody 上傳 brand logo:戴學士帽三色貓抱開書 + CANADA EDUCATION INSPIRED
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;700&family=Caveat:ital,wght@1,500;1,700&family=Quicksand:wght@400;500&display=swap');

:root{
  --brand-blue: #87CEEB;      /* 主天藍 */
  --brand-blue-soft:#C8E9F7;
  --brand-orange: #F4A536;    /* 橘黃字標 */
  --brand-orange-deep: #E5772E;
  --cat-white: #FFFFFF;
  --cat-orange: #E89B4A;
  --cat-black: #2D2D2D;
  --accent-pink: #FFB6C1;
  --accent-green: #90EE90;
  --maple-red: #D52B1E;
  --lib-cream:#FFF8E7;
}

/* ---------- HERO:天藍品牌底 ---------- */
.s-hero{
  background:linear-gradient(180deg,var(--brand-blue) 0%,var(--brand-blue-soft) 78%,#FFFDF5 100%) !important;
}
.s-hero .hero-watercolor{opacity:.45}

/* ---------- LOVE READING 字標 + Nicole 老師手寫 ---------- */
.brand-logo-line{position:relative;z-index:3;margin:6px auto 2px;text-align:center}
.brand-logo-line .lr-en{
  display:block;font-family:'Fredoka','Noto Sans TC',sans-serif;font-weight:700;
  font-size:clamp(34px,6vw,58px);letter-spacing:.06em;color:var(--brand-orange);
  -webkit-text-stroke:1.5px var(--cat-black);text-stroke:1.5px var(--cat-black);
  text-shadow:0 3px 0 rgba(45,45,45,.18);
}
.brand-logo-line .lr-nicole{
  display:block;font-family:'Caveat',cursive;font-style:italic;font-weight:700;
  font-size:clamp(24px,3.6vw,34px);color:var(--cat-black);margin-top:-4px;
  transform:rotate(-2deg);
}

/* ---------- 右上 CANADA EDUCATION INSPIRED 徽章 ---------- */
.canada-badge{
  position:absolute;top:84px;right:18px;z-index:6;width:108px;height:108px;
  filter:drop-shadow(0 4px 10px rgba(45,45,45,.22));
  animation:badgeFloat 4.5s ease-in-out infinite;
}
@keyframes badgeFloat{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(-6px) rotate(-2deg)}}
@media(max-width:640px){.canada-badge{width:78px;height:78px;top:74px;right:8px}}

/* ---------- 貓咪主視覺 / 通用貓 mascot 圖 ---------- */
.hero-art img.cat-mascot{background:var(--brand-blue-soft)}
img.cat-mascot{border-radius:26px;}
.section-cat{
  display:block;width:clamp(110px,16vw,150px);height:auto;aspect-ratio:1/1;object-fit:cover;
  margin:10px auto 2px;border-radius:50%;border:5px solid #fff;
  box-shadow:0 8px 22px rgba(45,45,45,.16);background:var(--brand-blue-soft);
  transition:transform .4s cubic-bezier(.34,1.56,.64,1);
}
.section-cat:hover{transform:scale(1.07) rotate(-3deg)}

/* ---------- 貓 + 動物朋友:mascot 卡上的小貓配角 ---------- */
.cat-companion{
  position:absolute;width:58px;height:58px;border-radius:50%;object-fit:cover;
  right:10px;top:10px;border:3px solid #fff;background:var(--brand-blue-soft);
  box-shadow:0 4px 10px rgba(45,45,45,.22);z-index:4;
  transform:rotate(8deg);transition:transform .35s;
}
.course-hero-card .cat-companion{width:72px;height:72px}
.course-hero-card,.course-mini-card,.cpi{position:relative}
.course-mini-card:hover .cat-companion,.course-hero-card:hover .cat-companion{transform:rotate(-6deg) scale(1.12)}
.cpi .cat-companion{width:34px;height:34px;right:-6px;top:-8px;border-width:2px}

/* ---------- 報名表單:貓咪借書卡 library-card ---------- */
form.library-card{
  background:var(--lib-cream) !important;
  border:3px solid var(--cat-black);border-radius:18px;
  box-shadow:8px 8px 0 rgba(45,45,45,.16);
  overflow:visible;
}
.lib-head{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:-6px -6px 14px;padding:10px 14px;
  background:var(--brand-blue);border:2.5px solid var(--cat-black);border-radius:12px;
}
.lib-head .lib-title{
  font-family:'Fredoka','Noto Sans TC',sans-serif;font-weight:700;letter-spacing:.08em;
  font-size:clamp(13px,2.4vw,17px);color:#fff;text-shadow:0 1.5px 0 rgba(45,45,45,.35);
}
.lib-head .lib-sub{font-family:'Quicksand',sans-serif;font-size:11px;color:#15506B;letter-spacing:.14em}
.lib-barcode{margin-left:auto;height:34px;width:auto}
.lib-cat-corner{
  position:absolute;width:84px;height:84px;border-radius:50%;object-fit:cover;
  right:-16px;top:-26px;border:3px solid var(--cat-black);background:var(--brand-blue-soft);
  box-shadow:0 6px 14px rgba(45,45,45,.25);transform:rotate(8deg);z-index:5;
}
@media(max-width:640px){.lib-cat-corner{width:62px;height:62px;right:-6px;top:-20px}}
form.library-card .field input,form.library-card .field textarea{background:#fff}

/* ---------- 腳印 section divider ---------- */
.paw-trail{
  display:block;height:34px;max-width:520px;margin:6px auto;
  background:url('/static/svg/cat-paw.svg') repeat-x center/34px 34px;
  opacity:.5;
}

/* ---------- 散落裝飾(毛線球 / 星星 / 花) ---------- */
.cat-deco{position:absolute;pointer-events:none;user-select:none;z-index:1;opacity:.85}
.cat-deco.spin-slow{animation:decoSpin 14s linear infinite}
@keyframes decoSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* ---------- 今日選書 ---------- */
.today-reading{
  display:flex;gap:18px;align-items:center;max-width:560px;margin:18px auto 6px;
  background:#fff;border:3px solid var(--cat-black);border-radius:18px;padding:14px 18px;
  box-shadow:6px 6px 0 rgba(45,45,45,.13);position:relative;z-index:3;text-align:left;
}
.today-reading img.tr-cover{width:96px;height:96px;object-fit:cover;border-radius:12px;border:2px solid var(--cat-black);flex:none}
.today-reading .tr-tag{
  font-family:'Fredoka',sans-serif;font-weight:700;font-size:13px;letter-spacing:.1em;
  color:var(--brand-orange-deep);display:flex;align-items:center;gap:6px;
}
.today-reading .tr-tag img{width:18px;height:18px}
.today-reading .tr-title{font-weight:700;font-size:17px;color:var(--cat-black);margin:2px 0}
.today-reading .tr-why{font-size:13.5px;color:#5A5248;line-height:1.55}
@media(max-width:520px){.today-reading{flex-direction:row;gap:12px;margin:14px 16px 4px}}

/* ---------- footer 揮手貓 ---------- */
.foot-cat{width:88px;height:88px;border-radius:50%;object-fit:cover;border:4px solid #fff;
  box-shadow:0 6px 16px rgba(45,45,45,.25);margin:0 auto 10px;display:block;background:var(--brand-blue-soft)}

/* ---------- 觸控目標 ≥60px ---------- */
.btn-pri,.btn-sec,.send-btn{min-height:60px;display:inline-flex;align-items:center;justify-content:center}
.cpi{min-height:60px}
.foot-icons a{min-width:60px;min-height:60px;display:inline-flex;align-items:center;justify-content:center}
