/* Kai's Desk: its ivory, blush and rose palette, with locally hosted type. */
@font-face {
  font-family:"Kai DM Sans";
  src:url("/assets/fonts/kai-dm-sans-latin.woff2") format("woff2");
  font-style:normal; font-weight:400 700; font-display:swap;
}
@font-face {
  font-family:"Kai Fraunces";
  src:url("/assets/fonts/kai-fraunces-latin.woff2") format("woff2");
  font-style:normal; font-weight:400 600; font-display:swap;
}
:root[data-theme="kai"] {
  color-scheme:light;
  --paper:#fcfaf7;
  --ink:#3f424c;
  --muted:#65636b;
  --rule:#e8e3df;
  --soft:#f5dfe4;
  --kai-rose:#854a5b;
  --kai-pink:#f5dfe4;
  --sans:"Kai DM Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;
  --mono:"Kai DM Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;
  --kai-display:"Kai Fraunces",Georgia,serif;
}
/* Keep the warm paper visible while Safari's underlying colour sample blends. */
[data-theme="kai"] body {
  background:
    radial-gradient(ellipse at 90% 6%,#f5dfe450,transparent 48%),
    radial-gradient(ellipse at 8% 80%,#e2ebee55,transparent 42%),
    linear-gradient(var(--paper),var(--paper)),var(--paper);
}
[data-theme="kai"] :is(h1,h2,h3) {
  font-family:var(--kai-display); font-weight:500; letter-spacing:-.035em;
  line-height:1.12; text-transform:none;
}
[data-theme="kai"] :is(.period,.contact h2>span,.kai-product h3) { color:var(--kai-rose); }
[data-theme="kai"] :is(.eyebrow,.service-label,.service-number,.step-number,.product-status) {
  color:var(--kai-rose); letter-spacing:.1em;
}
[data-theme="kai"] :is(.site-header,.hero-foot,.tools-inner,.service-primary,.steps article) { border-color:var(--rule); }
[data-theme="kai"] .product-status { border-color:#d6b9c2; background:#f5dfe455; border-radius:7px; }
[data-theme="kai"] .small-square { background:#b68d9b; border-radius:50%; }
[data-theme="kai"] :is(.button,.theme-switch) {
  background:var(--kai-rose); border-color:var(--kai-rose); color:#fffdfb;
  border-radius:10px; font-weight:500;
}
[data-theme="kai"] .button:hover { background:#6e3e4d; color:#fffdfb; }
@media(hover:hover) and (pointer:fine) {
  [data-theme="kai"] .theme-switch:hover { background:#6e3e4d; color:#fffdfb; }
}
[data-theme="kai"] :focus-visible { outline:3px solid #8eabb6; outline-offset:5px; }
[data-theme="kai"] .approach { background:#f6efec; color:var(--ink); border-block:1px solid var(--rule); }
[data-theme="kai"] :is(.approach-heading>p:last-child,.steps p) { color:var(--muted); }
[data-theme="kai"] .build-steps article.is-active .step-number { color:var(--kai-rose); }
[data-theme="kai"] .motion-stage { background:linear-gradient(130deg,#704655,#854a5b); color:#fffdfb; border-radius:18px; }
[data-theme="kai"] .build-stage { border-color:#d6b9c2; }
[data-theme="kai"] .build-meter { background:#e5d7dc; }
[data-theme="kai"] .build-meter span { background:#854a5b; }
[data-theme="kai"] .contact { background:#f5dfe440; border-top:1px solid var(--rule); }
[data-theme="kai"] .contact-email { color:var(--kai-rose); border-color:#d6b9c2; }
[data-theme="kai"] .site-header nav a:hover { color:var(--kai-rose); }
[data-theme="kai"] .theme-dock {
  border-color:#d6b9c2; border-radius:14px; background:#fcfaf7;
  color:var(--ink); box-shadow:0 10px 32px #854a5b15;
}
[data-theme="kai"] .theme-dock-label { color:var(--kai-rose); }
[data-theme="kai"] .site-footer { padding-bottom:calc(110px + env(safe-area-inset-bottom)); }
[data-theme="kai"] ::selection { background:#f5dfe4; color:#3f424c; }

/* An idle invitation: a blush petal passes through the monochrome button. */
#theme-kai-enter { position:relative; isolation:isolate; overflow:hidden; }
#theme-kai-enter :is(svg,span) { position:relative; z-index:1; }
#theme-kai-enter.is-hinting { animation:kai-button-hint 2.5s ease-in-out both; }
#theme-kai-enter.is-hinting::before {
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(120deg,#fcfaf7,#f5dfe4);
  animation:kai-button-bloom 2.5s ease-in-out both;
}
#theme-kai-enter.is-hinting svg { animation:kai-flower-hint 2.5s ease-in-out both; }
@keyframes kai-button-hint {
  0%,100% { color:#fff; border-color:#111; }
  28%,70% { color:#854a5b; border-color:#d6b9c2; }
}
@keyframes kai-button-bloom {
  0%,100% { opacity:0; clip-path:ellipse(0% 0% at 25px 50%); }
  30%,68% { opacity:1; clip-path:ellipse(130% 180% at 25px 50%); }
}
@keyframes kai-flower-hint {
  0%,100% { transform:rotate(0); }
  28%,70% { transform:rotate(18deg); }
}

/* A five-petal blossom, with a few loose petals drifting away from the click. */
.blossom-impact { display:none; position:absolute; left:var(--splash-x); top:var(--splash-y); width:0; height:0; }
.theme-splash.is-flower { z-index:101; }
.theme-splash.is-flower .splash-impact { display:none; }
.theme-splash.is-flower .blossom-impact { display:block; }
.blossom-flower {
  position:absolute; width:46px; height:46px; fill:#d4a3b3;
  animation:kai-flower-open 620ms cubic-bezier(.18,.65,.25,1) both;
}
.blossom-flower circle { fill:#fff5e3; }
.blossom-petal {
  position:absolute; width:12px; height:20px; background:#e9c8d3;
  border-radius:65% 35% 60% 40%; opacity:0;
  animation:kai-petal-drift 1550ms 90ms cubic-bezier(.15,.55,.2,1) both;
}
.blossom-petal:nth-of-type(1) { --petal-x:-90px; --petal-y:-70px; --petal-turn:-65deg; }
.blossom-petal:nth-of-type(2) { --petal-x:80px; --petal-y:-90px; --petal-turn:110deg; background:#d9b7c4; }
.blossom-petal:nth-of-type(3) { --petal-x:132px; --petal-y:-12px; --petal-turn:170deg; }
.blossom-petal:nth-of-type(4) { --petal-x:72px; --petal-y:110px; --petal-turn:65deg; background:#edc7cf; }
.blossom-petal:nth-of-type(5) { --petal-x:-100px; --petal-y:85px; --petal-turn:-130deg; }
.blossom-petal:nth-of-type(6) { --petal-x:-145px; --petal-y:4px; --petal-turn:-180deg; background:#d9b7c4; }
.blossom-petal:nth-of-type(7) { --petal-x:20px; --petal-y:-142px; --petal-turn:210deg; }
@keyframes kai-flower-open {
  0% { opacity:0; transform:translate(-50%,-50%) rotate(-24deg) scale(.15); }
  32% { opacity:1; transform:translate(-50%,-50%) rotate(-4deg) scale(1); }
  68% { opacity:.9; }
  100% { opacity:0; transform:translate(-50%,-50%) rotate(16deg) scale(1.2); }
}
@keyframes kai-petal-drift {
  0% { opacity:0; transform:translate(-50%,-50%) rotate(-15deg) scale(.2); }
  15% { opacity:.9; }
  72% { opacity:.55; }
  100% { opacity:0; transform:translate(var(--petal-x),var(--petal-y)) rotate(var(--petal-turn)) scale(.6); }
}
@media(prefers-reduced-motion:reduce) {
  #theme-kai-enter.is-hinting,#theme-kai-enter.is-hinting svg { animation:none; }
  #theme-kai-enter.is-hinting::before { display:none; animation:none; }
}
@media print {
  [data-theme="kai"] :is(body,.approach,.contact) { background:#fff; color:#111; }
}
