/*
Theme Name: My Magic Tour
Theme URI: https://mymagictour.fr/
Author: Algopage Developers
Author URI: https://algopage.com/
Description: Custom WordPress theme for My Magic Tour — Disney & Universal travel specialists.
Version: 1.0.0
Text Domain: my-magic-tour
*/

/* =========================================================
   My Magic Tour — Custom CSS (pairs with Tailwind CDN)
   Design tokens follow the client's editorial guidelines:
   Disney = midnight blue / gold / pastel · Universal = electric
   blue / silver / premium black. No generic travel iconography.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,500&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --disney-ink:#0B1330;
  --disney-mid:#1B2A5C;
  --disney-gold:#D4AF6A;
  --disney-gold-soft:#EBD9AE;
  --disney-pastel:#C9B6E4;
  --uni-black:#0A0A0F;
  --uni-blue:#0057FF;
  --uni-blue-bright:#3AA8FF;
  --paper:#FAF8F3;
  --paper-warm:#F3EFE6;
  --ink:#14162B;
  --ink-soft:#4A4E6B;
  --line:rgba(20,22,43,0.10);
}

html{scroll-behavior:smooth;}
body{
  font-family:'Manrope', sans-serif;
  color:var(--ink);
  background:var(--paper);
}
.font-display{font-family:'Fraunces', serif;}

/* ---------- Reusable brand utilities (not in Tailwind's default palette) ---------- */
.text-disney-ink{color:var(--disney-ink);}
.text-disney-gold{color:var(--disney-gold);}
.text-uni-blue{color:var(--uni-blue-bright);}
.bg-disney-ink{background-color:var(--disney-ink);}
.bg-disney-mid{background-color:var(--disney-mid);}
.bg-paper-warm{background-color:var(--paper-warm);}
.bg-uni-black{background-color:var(--uni-black);}
.border-gold{border-color:var(--disney-gold);}

.bg-disney-gradient{
  background:radial-gradient(120% 90% at 10% -10%, #22346B 0%, var(--disney-ink) 50%, var(--uni-black) 100%);
}
.bg-universal-gradient{
  background:linear-gradient(135deg, var(--uni-blue) 0%, var(--uni-black) 100%);
}
.bg-gold-gradient{
  background:linear-gradient(135deg,#E8C583,var(--disney-gold));
}

/* ---------- Buttons ---------- */
.btn-gold{
  background:linear-gradient(135deg,#E8C583,var(--disney-gold));
  color:var(--disney-ink);
  box-shadow:0 14px 30px -12px rgba(212,175,106,0.65);
  transition:transform .25s ease, box-shadow .25s ease;
}
.btn-gold:hover{transform:translateY(-2px); box-shadow:0 18px 36px -12px rgba(212,175,106,0.8);}

.btn-outline-light{
  border:1.5px solid rgba(255,255,255,0.45);
  color:#fff;
  transition:background .25s ease, transform .25s ease;
}
.btn-outline-light:hover{background:rgba(255,255,255,0.1); transform:translateY(-2px);}

.btn-outline-dark{
  border:1.5px solid var(--line);
  color:var(--ink);
  transition:background .25s ease, color .25s ease;
}
.btn-outline-dark:hover{background:var(--ink); color:#fff;}

/* ---------- Image placeholders (swap src later) ---------- */
.img-frame{
  position:relative;
  overflow:hidden;
  background:var(--paper-warm);
  border:1px solid var(--line);
}
.img-frame img{
  width:100%; height:100%; object-fit:cover; display:block;
}
.img-frame::after{
  content:attr(data-caption);
  position:absolute; left:12px; bottom:12px;
  font-size:0.68rem; font-weight:700; letter-spacing:.02em;
  background:rgba(11,19,48,0.72); color:#EBD9AE;
  padding:5px 10px; border-radius:999px;
  pointer-events:none;
}

/* ---------- Card hover ---------- */
.dest-card{transition:transform .3s ease, box-shadow .3s ease;}
.dest-card:hover{transform:translateY(-6px); box-shadow:0 24px 50px -22px rgba(11,19,48,.35);}

/* ---------- FAQ accordion ---------- */
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.faq-item.open .faq-chevron{transform:rotate(180deg);}
.faq-chevron{transition:transform .25s ease;}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---------- Star rating ---------- */
.stars{color:var(--disney-gold); letter-spacing:2px;}

/* ---------- Divider flourish ---------- */
.gold-rule{
  width:56px; height:2px;
  background:linear-gradient(90deg, var(--disney-gold), transparent);
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1; transform:none; transition:none;}
}