/* ============================================================
   FestaMix — base.css
   Tokens, reset, tipografia e componentes compartilhados
   (site público + painel administrativo)
   ============================================================ */

:root{
  /* Marca — cores originais preservadas */
  --pink:#D9246F;
  --pink-2:#F0479A;
  --pink-soft:#FCEAF3;
  --pink-ink:#A7164F;
  --blue:#1C8FD6;
  --blue-soft:#E8F5FD;
  --sun:#FFC21C;
  --sun-soft:#FFF6D8;
  --sun-ink:#7A5200;
  --grape:#7E3FDB;
  --grape-soft:#F2EAFF;
  --grape-ink:#4B1F8F;

  /* Neutros */
  --bg:#FFF8FB;
  --bg-2:#FFF3F8;
  --surface:#FFFFFF;
  --cream:#FFFBF6;
  --ink:#34184F;
  --ink-2:#4A2C63;
  --muted:#6B5A7E;
  --muted-2:#8F7FA1;
  --line:#F1E0EB;
  --line-2:#E3CFDD;

  /* Efeitos */
  --grad:linear-gradient(135deg,#D9246F 0%,#B92EA8 52%,#7E3FDB 100%);
  --grad-warm:linear-gradient(135deg,#FFC21C 0%,#F0479A 100%);
  --grad-soft:linear-gradient(135deg,#FCEAF3 0%,#F2EAFF 100%);
  --on-accent:#FFFFFF;
  --shadow-xs:0 1px 2px rgba(52,24,79,.05);
  --shadow-sm:0 2px 6px rgba(52,24,79,.05),0 1px 2px rgba(52,24,79,.04);
  --shadow-md:0 10px 30px -10px rgba(52,24,79,.18),0 3px 8px rgba(52,24,79,.05);
  --shadow-lg:0 28px 70px -22px rgba(52,24,79,.28),0 8px 20px -8px rgba(52,24,79,.1);
  --shadow-pink:0 14px 34px -12px rgba(217,36,111,.45);

  /* Forma */
  --radius:26px;
  --radius-md:20px;
  --radius-sm:14px;
  --radius-xs:10px;
  --pill:999px;

  /* Tipografia */
  --f-display:"Fredoka","Nunito",system-ui,sans-serif;
  --f-body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-script:"Dancing Script","Brush Script MT",cursive;

  /* Layout */
  --container:1200px;
  --gutter:clamp(16px,4vw,32px);
  --header-h:78px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%}
img{height:auto}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
a{color:var(--pink);text-decoration-thickness:1.5px;text-underline-offset:2px}
ul,ol{margin:0;padding:0;list-style:none}
p{margin:0}
h1,h2,h3,h4,h5{font-family:var(--f-display);font-weight:600;line-height:1.08;letter-spacing:-.01em;margin:0;text-wrap:balance}
[hidden]{display:none!important}
::selection{background:var(--pink);color:#fff}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:4px}

/* ---------- Utilitários ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:16px;top:-80px;z-index:200;background:var(--ink);color:#fff;padding:12px 20px;border-radius:12px;font-weight:800;transition:top .2s}
.skip-link:focus{top:16px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--pink)}
.eyebrow::before{content:"";width:22px;height:3px;border-radius:2px;background:currentColor;opacity:.85}
.script{font-family:var(--f-script);font-weight:700;color:var(--grape);font-size:clamp(22px,3vw,30px);line-height:1.1}
.section{padding-block:clamp(60px,8vw,104px)}
.section--soft{background:linear-gradient(180deg,var(--bg) 0%,var(--pink-soft) 45%,var(--bg) 100%)}
.section-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:20px;margin-bottom:clamp(28px,4vw,48px)}
.section-head__text{display:flex;flex-direction:column;gap:12px;max-width:46rem}
.section-head h2{font-size:clamp(30px,4.4vw,50px);font-weight:600}
.section-head p{color:var(--muted);font-size:17px;max-width:38rem}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line-2),transparent);border:0;margin:0}

/* ---------- Botões ---------- */
.btn{
  --btn-bg:var(--pink);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:50px;padding:13px 26px;border-radius:var(--pill);
  font-family:var(--f-body);font-weight:800;font-size:15.5px;letter-spacing:.01em;
  text-decoration:none;color:var(--on-accent);
  background:var(--btn-bg);border:0;cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s;
  box-shadow:0 10px 22px -12px rgba(217,36,111,.65);
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.99)}
.btn svg{width:20px;height:20px;flex:none}
.btn--primary{background:var(--grad);box-shadow:var(--shadow-pink)}
.btn--primary:hover{filter:saturate(1.08) brightness(1.03)}
.btn--dark{background:var(--ink);box-shadow:0 10px 24px -14px rgba(52,24,79,.8)}
.btn--ghost{background:rgba(255,255,255,.72);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line-2);backdrop-filter:blur(8px)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--pink);color:var(--pink-ink)}
.btn--sun{background:var(--sun);color:var(--sun-ink);box-shadow:0 10px 22px -12px rgba(255,194,28,.8)}
.btn--white{background:#fff;color:var(--grape-ink);box-shadow:0 10px 24px -14px rgba(52,24,79,.4)}
.btn--sm{min-height:42px;padding:9px 18px;font-size:14px}
.btn--lg{min-height:56px;padding:16px 32px;font-size:17px}
.btn--block{width:100%}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.5;pointer-events:none;transform:none;box-shadow:none}

/* ---------- Chips / badges ---------- */
.chip{display:inline-flex;align-items:center;gap:7px;padding:6px 13px;border-radius:var(--pill);font-size:12.5px;font-weight:800;letter-spacing:.02em;background:#fff;color:var(--ink);border:1px solid var(--line)}
.chip--pink{background:var(--pink-soft);color:var(--pink-ink);border-color:transparent}
.chip--blue{background:var(--blue-soft);color:#0B5E92;border-color:transparent}
.chip--sun{background:var(--sun-soft);color:var(--sun-ink);border-color:transparent}
.chip--grape{background:var(--grape-soft);color:var(--grape-ink);border-color:transparent}
.chip--live::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(217,36,111,.14)}

/* ---------- Formulários ---------- */
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field > span,.label{font-size:13px;font-weight:800;color:var(--ink-2);letter-spacing:.01em}
.field .hint{font-size:12.5px;color:var(--muted);font-weight:600}
.input,.select,.textarea{
  width:100%;min-height:50px;padding:12px 15px;border-radius:14px;
  background:var(--surface);border:1.5px solid var(--line-2);
  font-size:16px;color:var(--ink);transition:border-color .15s,box-shadow .15s,background .15s;
  appearance:none;
}
.textarea{min-height:98px;resize:vertical}
.input::placeholder,.textarea::placeholder{color:var(--muted-2)}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 4px rgba(217,36,111,.12)}
.select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B5A7E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:40px;cursor:pointer}
.input[aria-invalid="true"],.select[aria-invalid="true"]{border-color:#E23D3D;box-shadow:0 0 0 4px rgba(226,61,61,.1)}
.field__error{font-size:12.5px;font-weight:700;color:#B42828}
.check{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--pink);flex:none}

/* ---------- Cards ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.card--pad{padding:clamp(20px,3vw,30px)}
.card--hover{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.card--hover:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--line-2)}

/* ---------- Skeleton ---------- */
@keyframes shimmer{100%{background-position:-200% 0}}
.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--bg-2) 25%,#fff 37%,var(--bg-2) 63%);background-size:200% 100%;animation:shimmer 1.3s linear infinite}

/* ---------- Toast ---------- */
.toast-stack{position:fixed;z-index:300;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;gap:10px;width:min(94vw,420px);pointer-events:none}
.toast{
  display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:16px;
  background:var(--ink);color:#fff;font-weight:700;font-size:14.5px;box-shadow:var(--shadow-lg);
  animation:toast-in .22s ease both;pointer-events:none;
}
.toast--success{background:#1F6B45}
.toast--error{background:#9E2230}
@keyframes toast-in{from{opacity:0;transform:translateY(12px) scale(.98)}}

/* ---------- Scrollbar ---------- */
*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px;border:3px solid var(--bg)}
*::-webkit-scrollbar-track{background:transparent}

/* ---------- Movimento ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
@keyframes float-y{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.reveal{animation:rise .5s ease both}
