/*
Theme Name: Lestin Child
Theme URI: https://gaviaspreview.com/wp/lestin/
Author URI: https://themeforest.net/user/gavias
Author: Gaviasthemes Team
Description: Child theme for the Lestin theme.
Template: lestin
*/

/* =============================================================
   MID DIAMONDS — WPUF FORM SKIN  (CSS-only, no HTML editing)
   Add via: Appearance → Customize → Additional CSS
   ============================================================= */

/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Outfit:wght@300;400;500;600;700&display=swap');

/* ── Design tokens ── */
:root {
  --g:        #c9a84c;   /* gold */
  --gb:       #f0d080;   /* gold bright */
  --gd:       #a07830;   /* gold dark */
  --gc:       rgba(201,168,76,.15);  /* gold ghost */
  --bg:       #111118;   /* card bg */
  --bgf:      #16161f;   /* field bg */
  --bgh:      #1c1c2a;   /* field hover */
  --bdr:      rgba(201,168,76,.18); /* border */
  --txt:      #ede8df;
  --txt2:     #b8ae9e;
  --txt3:     #7a7268;
  --red:      #e05c5c;
  --grn:      #5ce09a;
  --r:        12px;
  --rs:       8px;
  --ease:     cubic-bezier(.23,1,.32,1);
  --t:        .32s;
  --fd:       'Cormorant Garamond', Georgia, serif;
  --fb:       'Outfit', sans-serif;
}

/* ════════════════════════════════════════════════
   16. KEYFRAME ANIMATIONS
   ════════════════════════════════════════════════ */
@keyframes md-rise {
  from { opacity:0; transform:translateY(26px) scale(.98) }
  to   { opacity:1; transform:translateY(0) scale(1) }
}
@keyframes md-shimmer {
  0%   { background-position:-300% center }
  100% { background-position: 300% center }
}
@keyframes md-drift {
  0%,100% { transform:translateY(0) rotate(45deg) }
  40%      { transform:translateY(-12px) rotate(47deg) }
  70%      { transform:translateY(6px) rotate(44deg) }
}
@keyframes md-pulse {
  0%,100% { opacity:.45; transform:scale(1) }
  50%      { opacity:1;   transform:scale(1.12) }
}
@keyframes md-spin  { to { transform:rotate(360deg) } }
@keyframes md-ripple { to { transform:scale(4); opacity:0 } }
@keyframes md-floatin {
  from { opacity:0; transform:translateX(-8px) }
  to   { opacity:1; transform:translateX(0) }
}
@keyframes md-particle {
  0%   { transform:translate(0,0) scale(1); opacity:1 }
  100% { transform:translate(var(--px),var(--py)) scale(0); opacity:0 }
}