/* =========================================================
   ASIA MÍA — estilos traducidos 1:1 desde el proyecto v0
   (Next.js + Tailwind + shadcn) a CSS puro para WordPress
   con tema en blanco / custom code.
   ========================================================= */

/* Las fuentes (Fraunces + Geist) se cargan vía wp_enqueue_style en
   functions.php con un <link> real — más rápido que @import, que bloquea
   el render mientras descarga. */

:root{
  /* ---- tokens de color (copiados de app/globals.css) ---- */
  /*--background: oklch(0.985 0.008 75); original*/
  --background: #fff6f6;
  --foreground: oklch(0.245 0.02 45);
  --card: oklch(0.998 0.004 75);
  --card-foreground: oklch(0.245 0.02 45);
  /*--primary: oklch(0.62 0.15 38); original*/
  --primary: #e29caf;
  --primary-foreground: oklch(0.99 0.01 75);
  --secondary: oklch(0.91 0.035 235);
  --secondary-foreground: oklch(0.36 0.06 250);
  --muted: oklch(0.955 0.012 75);
  --muted-foreground: oklch(0.52 0.025 50);
  /*--accent: oklch(0.68 0.09 235);*/
  --accent: #d4af37;
  --accent-foreground: oklch(0.99 0.005 235);
  /*--border: oklch(0.9 0.014 70); original*/
  --border: #f3e9df;
  --input: oklch(0.9 0.014 70);
  --ring: oklch(0.62 0.15 38);

  --font-sans: 'Geist', ui-sans-serif, system-ui, sans-serif;
  --font-serif: 'Fraunces', ui-serif, Georgia, serif;

  --wrap: 1280px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--background);
  color:var(--foreground);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none; margin:0; padding:0;}
button{font-family:inherit; cursor:pointer;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 24px;}
.serif{font-family:var(--font-serif);}
:focus-visible{outline:2px solid var(--ring); outline-offset:2px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.01ms !important; transition-duration:0.01ms !important; scroll-behavior:auto !important;}
}

section{scroll-margin-top:80px;}

/* ============ BOTONES ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:999px; font-size:0.9rem; font-weight:600;
  padding:14px 28px; border:1px solid transparent; white-space:nowrap;
  transition:all .2s ease;
}
.btn svg{width:16px; height:16px;}
.btn-primary{background:var(--primary); color:var(--primary-foreground);}
.btn-primary:hover{background:color-mix(in oklch, var(--primary) 80%, white);}
.btn-outline{background:transparent; border-color:var(--border); color:var(--foreground);}
.btn-outline:hover{background:var(--muted);}
.btn-ghost{background:transparent; color:var(--primary); padding:8px 14px; border: 1px solid var(--primary);}
.btn-ghost:hover{background:color-mix(in oklch, var(--primary) 10%, transparent);}
.btn-block{width:100%;}
.btn .icon-move{transition:transform .2s ease;}
.btn:hover .icon-move{transform:translateX(3px);}

/* ============ HEADER ============ */
/* Movido a css/header.css — se enqueue por separado. */

/* ============ HOME / FRONT PAGE ============ */
/* Hero, trust bar, rutas, why-us, testimonios, cultura y formulario
   movidos a css/home.css — solo se usan en front-page.php. */

/* ============ FOOTER ============ */
/* Movido a css/footer.css — se enqueue por separado. */



/* ============================================================
   EFECTO SUTIL: FLORES DE CEREZO
   ============================================================ */
#sakura-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;          /* Lo manda completamente al fondo */
  pointer-events: none; /* Crucial: permite hacer clic a través del canvas */
  opacity: 0.65;        /* Se mezcla suavemente con tu fondo --background */
}

.pillar-icon .fa {
  color: #e29caf;
}

.card-icon .fa {
  color: #e29caf;
}