/* Fila digital · Cantina do Délio
   Mesma linguagem do carrossel da aula show e do site novo: vinho com linho, papel creme com fita,
   ingresso de vidro, Gloock + Spectral + máquina de escrever + escrita à mão, dourado metálico. */
:root{
  --noite:#110b0a; --vinho:#6b1e23; --vinho-escuro:#4c1317; --vinho-fundo:#3a0e11; --tinta:#2a0a0c;
  --creme:#f6efe2; --creme-2:#d9cfbf; --creme-3:#a99d8c; --rosa:#ecd8cc; --ouro:#b8924a; --ouro-2:#d6b46e; --verde:#8fbf7a;
  --display:"Gloock",Georgia,serif; --texto:"Spectral",Georgia,serif; --maq:"Courier Prime","Courier New",monospace; --mao:"La Belle Aurore",cursive;
  --ease:cubic-bezier(.22,1,.36,1);
  --papel:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='360' height='360'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .42  0 0 0 0 .27  0 0 0 0 .16  0 0 0 .2 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  --fibra:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='600' height='600'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='.004 .55' numOctaves='2' seed='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5  0 0 0 0 .3  0 0 0 0 .2  0 0 0 .12 0'/></filter><rect width='100%25' height='100%25' filter='url(%23f)'/></svg>");
  --linho:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='480' height='480'><filter id='h'><feTurbulence type='fractalNoise' baseFrequency='.006 .62' numOctaves='2' seed='4' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .86  0 0 0 0 .78  0 0 0 .07 0'/></filter><filter id='v'><feTurbulence type='fractalNoise' baseFrequency='.62 .006' numOctaves='2' seed='9' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .1 0'/></filter><rect width='100%25' height='100%25' filter='url(%23h)'/><rect width='100%25' height='100%25' filter='url(%23v)'/></svg>");
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{min-height:100svh;color:var(--creme);font-family:var(--texto);font-weight:300;font-size:17px;line-height:1.55;
  background-color:var(--vinho-fundo);
  background-image:var(--linho),
    radial-gradient(ellipse 90% 55% at 50% 0%,rgba(255,200,160,.16),transparent 70%),
    radial-gradient(ellipse 120% 80% at 50% 30%,#7a2329 0%,#5a171c 40%,#3a0e11 80%,#2a0a0c 100%);
  background-attachment:fixed}
img{display:block;max-width:100%}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--ouro-2);outline-offset:3px}
::selection{background:var(--ouro);color:var(--tinta)}

/* tipografia */
.h{font-family:var(--display);font-weight:400;line-height:1.02;letter-spacing:-.015em;text-wrap:balance;filter:drop-shadow(0 4px 10px rgba(14,3,5,.35))}
.h em,.ouro{font-style:normal;background:linear-gradient(100deg,#a9823c 0%,#d9b86f 30%,#f6e3ae 46%,#e2c27c 56%,#b48c45 78%,#d6b46e 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.papel .h{filter:drop-shadow(0 3px 6px rgba(107,30,35,.12))}
.papel .h em,.papel .ouro{background:linear-gradient(100deg,#6f4f17 0%,#9a7430 32%,#c39b52 48%,#8a6524 70%,#9f7a35 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.rot{font-family:var(--maq);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:400}
.mao{font-family:var(--mao);font-weight:400;line-height:1.1}
.fio{height:1px;background:linear-gradient(90deg,transparent,rgba(214,180,110,.75),transparent);border:0}

/* logo */
.logo{display:block;aspect-ratio:900/510;background:url(img/logo-creme.png) center/contain no-repeat;filter:drop-shadow(0 4px 16px rgba(0,0,0,.45))}

/* papel creme com fita adesiva */
.papel{position:relative;color:var(--tinta);background-image:var(--papel),var(--fibra),linear-gradient(170deg,#fbf6ec,#efe3cd);
  box-shadow:0 1px 2px rgba(10,2,3,.3),0 12px 22px rgba(10,2,3,.3),0 34px 60px rgba(10,2,3,.3)}
.fita::before{content:"";position:absolute;left:50%;top:-14px;width:110px;height:28px;transform:translateX(-50%) rotate(-3deg);z-index:2;
  background:linear-gradient(180deg,rgba(255,250,235,.62),rgba(235,225,200,.5));box-shadow:0 1px 2px rgba(0,0,0,.15)}

/* vidro */
.vidro{position:relative;background:linear-gradient(160deg,rgba(255,236,215,.13),rgba(255,236,215,.04) 45%,rgba(0,0,0,.12));
  border:1px solid rgba(255,232,200,.22);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
  box-shadow:inset 0 1px 0 rgba(255,240,220,.22),inset 0 -1px 0 rgba(0,0,0,.2),0 18px 40px rgba(10,2,3,.32),0 48px 90px rgba(10,2,3,.3)}

/* selos */
.chip{display:inline-flex;align-items:center;gap:.5em;font-family:var(--maq);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;padding:.7em 1em;border:1px solid rgba(246,239,226,.5);box-shadow:0 8px 18px rgba(10,2,3,.18)}
.chip.cheio{border-color:transparent;color:var(--vinho);background-image:var(--papel),linear-gradient(180deg,#fbf6ec,#efe3cd)}

/* foto em arco com fio dourado interno */
.arco{position:relative;overflow:hidden;border-radius:999px 999px 6px 6px;box-shadow:0 2px 3px rgba(10,2,3,.35),0 14px 24px rgba(10,2,3,.32),0 44px 80px rgba(10,2,3,.42)}
.arco img{width:100%;height:100%;object-fit:cover}
.arco::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse 80% 60% at 28% 18%,rgba(255,238,215,.16),transparent 60%),radial-gradient(ellipse 120% 90% at 50% 50%,transparent 60%,rgba(20,4,6,.3) 100%)}
.arco::after{content:"";position:absolute;inset:9px;z-index:2;border:1px solid rgba(226,193,120,.75);border-radius:999px 999px 3px 3px;pointer-events:none}

/* botões */
.bt{display:flex;align-items:center;justify-content:center;gap:.6em;width:100%;min-height:56px;padding:1em 1.4em;border:0;font-family:var(--maq);font-size:.86rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  background:linear-gradient(180deg,#7d242a,#5e1a1f);color:var(--creme);box-shadow:inset 0 1px 0 rgba(255,220,200,.18),0 2px 3px rgba(42,10,12,.3),0 12px 24px rgba(42,10,12,.28);transition:transform .2s var(--ease),filter .3s}
.bt:active{transform:translateY(1px) scale(.995)}
.bt:disabled{filter:grayscale(.4) brightness(.8);cursor:wait}
.bt--ouro{background:linear-gradient(180deg,#d9b86f,#b48c45);color:#24140a;box-shadow:inset 0 1px 0 rgba(255,245,215,.6),0 2px 3px rgba(20,8,4,.3),0 14px 28px rgba(20,8,4,.35)}
.bt--linha{background:transparent;color:var(--creme);border:1px solid rgba(246,239,226,.45);box-shadow:none}
.link{background:none;border:0;font-family:var(--maq);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ouro-2);text-decoration:underline;text-underline-offset:5px;padding:.6em}

@keyframes sobe{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pulsa{0%,100%{box-shadow:0 0 0 0 rgba(143,191,122,.5)}70%{box-shadow:0 0 0 7px rgba(143,191,122,0)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
