/* Kani Journal v3 — cream, blush and the original Kani photography. */
:root {
  --paper:#FFF8EE; --cream:#FFFCF7; --surface-alt:#F9ECE8; --card-alt:#FCE8ED; --linen:#F0D9D8;
  --ink:#352E2B; --text-muted:#72615D; --text-faint:#8C7770;
  --terra:#923D59; --terra-deep:#923D59; --terra-soft:#FCE3EB;
  --morning:#F5DEA2; --morning-soft:#FFF3D5; --grass:#647957; --grass-soft:#EDF2E6;
  --line:#E9D5CD; --line-soft:rgba(233,213,205,.45); --fiber:.035;
  --pink:#E884A0; --pink-soft:#FCE3EB;
}
html[data-theme="night"] {
  --paper:#241E22; --cream:#30272C; --surface-alt:#35282E; --card-alt:#3D2933;
  --ink:#FFF5ED; --text-muted:#D5BFC6; --text-faint:#B49CA4;
  --terra:#F2AEC3; --terra-deep:#F2AEC3; --terra-soft:#4A2D3A;
  --line:#60434D; --line-soft:rgba(160,110,130,.25); --pink:#F2AEC3; --pink-soft:#4A2D3A;
}
body{background-image:none}
section{scroll-margin-top:90px}
.wrap{width:min(1320px,calc(100% - 64px))}
.nav{border-bottom:0;background:var(--paper)}
.nav-in{height:88px}
.brand img{width:52px;height:52px;box-shadow:none}
.brand b{font-family:system-ui,"Microsoft JhengHei",sans-serif;font-weight:900;font-size:26px;letter-spacing:-.04em}
.brand span span{font-size:13px;letter-spacing:.08em}
.nav-links{gap:26px}
.btn{border-radius:999px;padding:14px 26px;font-family:system-ui,"Microsoft JhengHei",sans-serif;font-weight:750}
.btn-line{border-color:var(--ink)}
.btn-sm{padding:9px 16px;font-size:13px}
.iconbtn{border-radius:50%;border-style:solid}
.kani-hero{padding:36px 0 58px}
.hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}
.kani-tag{display:inline-flex;align-items:center;gap:22px;background:var(--pink-soft);color:var(--ink);border-radius:40px 40px 40px 8px;padding:9px 22px;font-size:19px;font-weight:800;transform:rotate(-3deg);margin:0 0 28px}
.kani-tag span{color:var(--terra);font-size:25px}
h1.hero-t{font-family:system-ui,"Microsoft JhengHei",sans-serif;font-size:clamp(38px,4.25vw,63px);font-weight:900;letter-spacing:-.055em;line-height:1.32;margin:0 0 22px}
.pink-word{color:var(--terra)}
.hero-p{font-size:clamp(16px,1.4vw,20px);line-height:1.9;margin:0 0 26px;max-width:32ch}
.hero-cta{gap:12px}
.hero-cta .btn svg{width:23px;height:23px;color:var(--pink)}
.mobile-break{display:none}
.kani-trust{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-muted);margin-top:25px}
.kani-trust svg{width:19px;height:19px}
.kani-collage{position:relative;height:510px;isolation:isolate;margin:0 8px 0 10px}
.kani-collage::before{content:"";position:absolute;inset:10px 5px 14px 12px;background:var(--pink-soft);border-radius:32% 25% 19% 28%;transform:rotate(-4deg);z-index:-1}
.kani-photo-main{position:absolute;inset:35px 35px 45px 28px;border-radius:100px 55px 70px 40px;overflow:hidden}
.kani-photo-main img{width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.kani-memo{position:absolute;right:-5px;top:14px;padding:22px 25px;background:var(--cream);color:var(--ink);font:22px/1.65 "LXGW WenKai",serif;transform:rotate(8deg);box-shadow:var(--sh-2);border-radius:3px}
.kani-memo>span:last-child{color:var(--terra);margin-left:12px}
.memo-tape{position:absolute;top:-10px;left:30%;width:75px;height:22px;background:var(--pink);opacity:.6;transform:rotate(8deg)}
.kani-sound{position:absolute;right:-8px;top:210px;transform:rotate(5deg);border-radius:20px;background:var(--cream);padding:12px 19px;box-shadow:var(--sh-2)}
.kani-sound b{font-size:15px}.kani-sound>div{display:flex;align-items:center;gap:12px;margin-top:4px}
.sound-paw{background:var(--pink-soft);border-radius:50%;padding:0 11px;font-size:24px;color:var(--terra)}
.sound-wave{color:var(--terra);font-size:20px;letter-spacing:2px}
.kani-sound small{font-size:10px;color:var(--text-muted)}
.kani-photo-small{position:absolute;right:0;bottom:-5px;width:180px;padding:10px 10px 0;margin:0;background:var(--photo);transform:rotate(9deg);box-shadow:var(--sh-2)}
.kani-photo-small img{display:block;width:100%;height:125px;object-fit:cover}
.kani-photo-small figcaption{text-align:center;font:14px/2.8 "LXGW WenKai",serif;color:#352E2B}
.kani-hello{position:absolute;width:210px;height:auto;object-fit:contain;bottom:-7px;left:-32px;transform:rotate(-7deg);filter:drop-shadow(0 5px 4px rgba(53,46,43,.1))}
.collage-heart{position:absolute;top:55px;left:7px;font-size:60px;color:var(--terra);transform:rotate(-15deg)}
.kani-how{padding:22px 0 62px;border:0;background:linear-gradient(180deg,transparent,var(--surface-alt))}
.kani-how h2{text-align:center;font:800 clamp(23px,2.5vw,34px)/1.5 system-ui,"Microsoft JhengHei",sans-serif;margin:0 0 26px;letter-spacing:-.025em}
.kani-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.kani-step{display:flex;align-items:center;gap:4px;padding:16px 14px 16px 5px;border:8px solid var(--cream);border-radius:30px;background:var(--pink-soft);overflow:hidden}
.kani-step:nth-child(2){background:var(--grass-soft)}
.kani-step:nth-child(3){background:var(--morning-soft)}
.kani-step img{width:47%;height:155px;object-fit:contain}
.kani-step>div{flex:1;min-width:0}
.kani-step span{font-size:9px;letter-spacing:.1em;color:var(--text-muted)}
.kani-step h3{font-size:22px;margin:4px 0 8px;line-height:1.4}
.kani-step p{font-size:13px;margin:0;color:var(--text-muted);line-height:1.8}
.card,.why-card,.blog-card{border-radius:26px}
@media(min-width:1600px){.kani-hero{padding-top:52px}.kani-collage{height:560px}}
@media(max-width:1100px){
  .nav-links{gap:14px}.hero-grid{gap:12px}.kani-collage{height:470px}
  .kani-memo{font-size:19px}.kani-step{padding-right:9px}.kani-step h3{font-size:19px}
}
@media(max-width:800px){
  .wrap{width:calc(100% - 36px)}.nav-in{height:76px;gap:10px}.brand b{font-size:21px}.brand img{width:42px;height:42px}
  .nav-links{display:none}.nav-act{margin-left:auto}.hero-grid{grid-template-columns:1fr;gap:20px}
  .kani-hero{padding:26px 0 35px}.kani-tag{font-size:16px;margin-bottom:22px;padding:7px 16px}
  h1.hero-t{font-size:clamp(36px,7.3vw,56px);letter-spacing:-.045em}.hero-p{font-size:17px;max-width:none}
  .hero-copy{text-align:center}.hero-cta,.kani-trust{justify-content:center}.kani-trust{margin-top:18px}
  .kani-collage{width:min(540px,calc(100% - 16px));height:475px;justify-self:center;margin:0 8px}
  .kani-how{padding-top:15px}.kani-steps{grid-template-columns:1fr;max-width:540px;margin:auto}
  .kani-step{padding:10px 20px}.kani-step img{width:40%;height:130px}.kani-step h3{font-size:23px}.kani-step p{font-size:15px}.kani-step p br{display:none}
}
@media(max-width:420px){
  .brand b{font-size:19px}.brand img{width:35px;height:35px}.nav-act{gap:7px}.btn-sm{padding:8px 11px}.iconbtn{width:33px;height:33px}
  .hero-cta .btn{font-size:14px;padding:12px 18px}.mobile-break{display:block}
  .kani-collage{height:400px}.kani-photo-main{inset:28px 20px 45px 10px;border-radius:70px 45px 50px 35px}
  .kani-memo{font-size:17px;padding:16px;right:0}.kani-sound{top:174px;right:0;padding:9px 12px}.sound-wave{font-size:15px}
  .kani-photo-small{width:143px;bottom:0}.kani-photo-small img{height:98px}.kani-hello{width:168px;left:-12px;bottom:0}
  .collage-heart{font-size:43px;left:0}.kani-how h2{font-size:23px}
}