/* ══════════════════════════════════════════════════════════════════════
   Jyro Demo Days · Go Fly Club — app styles (mobile-first)
   Reusa os tokens GFC (tokens/colors.css etc). Fúcsia = ação, neon = destaque.
   ══════════════════════════════════════════════════════════════════════ */
@font-face { font-family:'Bebas Neue'; src:url('assets/fonts/BebasNeue-Regular.ttf') format('truetype'); font-display:swap; }
@font-face { font-family:'Roustel';    src:url('assets/fonts/Roustel.ttf') format('truetype'); font-display:swap; }
/* Fonte da marca Jyro = "BT Brik" (guia de marca). O usuário coloca o arquivo
   em assets/jyro/btbrik.(ttf|otf); enquanto não houver, cai no fallback pesado. */
@font-face { font-family:'BT Brik'; src:url('assets/jyro/btbrik.otf') format('opentype'), url('assets/jyro/btbrik.ttf') format('truetype'); font-display:swap; }

* { margin:0; padding:0; box-sizing:border-box; }
:root { --maxw: 480px; }
html, body { height:100%; }
body {
  background: var(--gfc-bg, #0A0A0C);
  color: var(--gfc-white-soft, #F4F4F6);
  font-family: 'Saira', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
.capa__lead, .capa__info { overflow-wrap: anywhere; }
/* fix de overflow: itens flex/grid encolhem e nunca passam da largura da tela */
.step, .capa__inner, .form, .ok__inner, .topbar { min-width: 0; max-width: 100vw; }
.capa__inner > *, .form > *, .ok__inner > * { min-width: 0; max-width: 100%; }
.ident-row, .grid2 { min-width: 0; }
.ident-row > *, .grid2 > * { min-width: 0; }
img { display:block; max-width:100%; }
button { font-family: inherit; cursor:pointer; }

.app { max-width: var(--maxw); margin:0 auto; min-height:100dvh; position:relative; }

/* ---------- passos ---------- */
.step { display:none; min-height:100dvh; flex-direction:column; }
.step.is-active { display:flex; }

/* ---------- brand bar ---------- */
.brandbar { display:flex; align-items:center; gap:14px; padding:22px 22px 0; }
.brandbar--center { justify-content:center; padding-top:34px; }
.brandbar__gfc { height:26px; width:auto; filter: brightness(0) invert(1); opacity:.92; }
.brandbar__x { color: var(--gfc-gray-weak, #6E6E78); font-size:18px; }
.brandbar__jyro { height:30px; width:auto; }
/* variante em destaque: logos grandes no topo da capa e da saudação */
.brandbar--big { gap:18px; padding-top:44px; padding-bottom:8px; }
.brandbar--big .brandbar__gfc { height:42px; }
.brandbar--big .brandbar__x   { font-size:24px; }
.brandbar--big .brandbar__jyro { height:48px; }
.brandbar--big .jyro-ph { height:48px; font-size:26px; }
/* capa: só o Go Fly Club, grande e centralizado no topo */
.brandbar--capa { justify-content:center; padding:148px 22px 4px; }
.brandbar--capa .brandbar__gfc { height:84px; filter: brightness(0) invert(1); opacity:.95; }
/* logo Jyro grande e centralizado, abaixo do botão de agendar */
.capa__jyro { align-self:center; height:60px; width:auto; margin-top:26px; }
span.capa__jyro { height:60px; font-size:32px; padding:0 18px; }
/* placeholder de texto enquanto o logo real da Jyro não é adicionado */
.jyro-ph { display:inline-grid; place-items:center; height:30px; padding:0 12px;
  border:1px dashed var(--gfc-line-strong,#3A3A42); border-radius:7px;
  font:400 18px 'Bebas Neue'; letter-spacing:.16em; color: var(--gfc-gray,#9A9AA4); }

/* ---------- capa ---------- */
.capa__bg, .ok__bg {
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(120% 80% at 100% 0%, rgba(214,22,143,.20), transparent 55%),
    radial-gradient(90% 70% at 0% 100%, rgba(219,255,0,.10), transparent 55%);
}
.capa__inner, .ok__inner { position:relative; z-index:1; flex:1; display:flex; flex-direction:column;
  justify-content:center; padding:28px 26px calc(30px + env(safe-area-inset-bottom)); gap:14px; }

.eyebrow { font:600 12px/1 'Saira',sans-serif; letter-spacing:.28em; text-transform:uppercase; color: var(--gfc-gray, #9A9AA4); }
.capa__title { font-family:'Bebas Neue'; font-weight:400; line-height:.86; font-size: clamp(52px, 16vw, 84px); color: var(--gfc-white,#fff); letter-spacing:.01em; }
.capa__title span { color: var(--gfc-neon, #DBFF00); }
.capa__lead { font-size:18px; line-height:1.35; color: var(--gfc-white-soft,#F4F4F6); margin-top:6px; }
.capa__info { font-size:14px; line-height:1.5; color: var(--gfc-gray-light, #C7C7CF); }
.capa__info strong { color: var(--gfc-neon,#DBFF00); font-weight:600; }
/* atalho admin discreto: cadeado apagado no rodapé da capa */
.capa__adm { position:absolute; bottom:calc(10px + env(safe-area-inset-bottom)); left:10px; z-index:3;
  background:none; border:none; font-size:15px; line-height:1; padding:10px; opacity:.28; filter:grayscale(1); transition:opacity .2s; }
.capa__adm:hover, .capa__adm:active { opacity:.7; }

/* ---------- botões ---------- */
.btn { border:none; border-radius:14px; padding:16px 22px; font:700 16px 'Saira',sans-serif; letter-spacing:.02em; transition: transform .08s ease, filter .15s ease; }
.btn:active { transform: translateY(1px); }
.btn--action { background: transparent; color: var(--gfc-fuchsia,#D6168F); border:1.5px solid var(--gfc-fuchsia,#D6168F); box-shadow:none; }
.btn--action:hover { background: rgba(214,22,143,.10); }
.btn--ghost { background: transparent; color: var(--gfc-white,#fff); border:1px solid var(--gfc-line-strong,#3A3A42); }
.btn--full { width:100%; }
.capa__inner .btn--action { margin-top:10px; align-self:flex-start; }

/* ---------- topbar (form) ---------- */
.topbar { display:flex; align-items:center; gap:8px; padding:16px 18px; border-bottom:1px solid var(--gfc-line,#26262B); position:sticky; top:0; background: rgba(10,10,12,.9); backdrop-filter: blur(8px); z-index:5; }
.topbar__back { background:none; border:none; color:#fff; font-size:30px; line-height:1; width:34px; }
.topbar__title { font:600 15px 'Saira',sans-serif; letter-spacing:.02em; flex:1; }

/* ---------- seletor de idioma ---------- */
.langsel { display:flex; gap:4px; padding:3px; background: var(--gfc-surface-2,#1C1C20); border:1px solid var(--gfc-line,#26262B); border-radius:11px; }
.langsel__btn { background:none; border:none; padding:4px 6px; border-radius:8px; font-size:18px; line-height:1; opacity:.45; filter:grayscale(.6); transition: opacity .15s, filter .15s, background .15s; }
.langsel__btn.is-active { opacity:1; filter:none; background: var(--gfc-surface-1,#131316); box-shadow: inset 0 0 0 1px var(--gfc-fuchsia,#D6168F); }
.langsel__btn:hover { opacity:.85; }
/* seletor na capa: centralizado abaixo do logo Jyro */
.langsel--capa { align-self:center; margin-top:18px; }

/* ---------- formulário ---------- */
.form { padding:16px 18px calc(24px + env(safe-area-inset-bottom)); display:flex; flex-direction:column; gap:14px; }
.card { background: var(--gfc-surface-1,#131316); border:1px solid var(--gfc-line,#26262B); border-radius:16px; padding:16px; }
.lbl { display:block; font:600 14px 'Saira',sans-serif; color: var(--gfc-white,#fff); margin-bottom:10px; }
.lbl .opt { color: var(--gfc-gray-weak,#6E6E78); font-weight:400; }
.inp { width:100%; background: var(--gfc-surface-2,#1C1C20); border:1px solid var(--gfc-line-strong,#3A3A42); border-radius:10px; padding:13px 14px; color:#fff; font-size:15px; font-family:'Saira',sans-serif; }
.inp::placeholder { color: var(--gfc-gray-weak,#6E6E78); }
.inp:focus { outline:none; border-color: var(--gfc-fuchsia,#D6168F); box-shadow: 0 0 0 3px var(--gfc-ring, rgba(214,22,143,.28)); }
select.inp { appearance:none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%239A9AA4' fill='none' stroke-width='2'/></svg>"); background-repeat:no-repeat; background-position: right 14px center; padding-right:36px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ident-row { display:flex; gap:10px; }
.ident-row .inp { flex:1; }
.ident-hint { font-size:12px; color: var(--gfc-gray-weak,#6E6E78); margin-top:8px; }
.ident-loaded { margin-top:10px; display:flex; align-items:center; gap:8px; font-size:14px; color: var(--gfc-neon,#DBFF00); }
.ident-loaded .chk { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background: var(--gfc-neon,#DBFF00); color:#000; font-size:12px; font-weight:700; }
.form__err { color: #ff7a7a; font-size:14px; }

/* ---------- calendário (estilo Volare, cores GFC) ---------- */
.cal__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.cal__nav { background:var(--gfc-surface-2,#1C1C20); border:1px solid var(--gfc-line-strong,#3A3A42); color:#fff; width:34px; height:34px; border-radius:9px; font-size:18px; }
.cal__month { font:600 15px 'Saira'; text-transform:capitalize; }
.cal__grid { display:grid; grid-template-columns:repeat(7,1fr); gap:5px; }
.cal__dow { text-align:center; font-size:11px; color:var(--gfc-gray-weak,#6E6E78); padding:4px 0; text-transform:uppercase; letter-spacing:.05em; }
.cal__day { aspect-ratio:1; display:grid; place-items:center; border-radius:10px; background:var(--gfc-surface-2,#1C1C20); color:var(--gfc-white-soft,#F4F4F6); font-size:15px; border:1px solid transparent; }
.cal__day--empty { background:transparent; }
.cal__day--off { color:var(--gfc-gray-weak,#6E6E78); opacity:.4; pointer-events:none; }
.cal__day--sel { background:var(--gfc-fuchsia,#D6168F); color:#fff; font-weight:700; }
.cal__day--today { border-color: var(--gfc-neon,#DBFF00); }
/* datas fora da sede: pontinho fúcsia no canto */
.cal__day--local { position:relative; }
.cal__day--local::after { content:""; position:absolute; top:5px; right:5px; width:5px; height:5px; border-radius:50%; background:var(--gfc-fuchsia,#D6168F); }
.cal__day--sel.cal__day--local::after { background:#fff; }
.cal__sel { margin-top:12px; font-size:13px; color:var(--gfc-gray-light,#C7C7CF); }
.cal__sel b { color: var(--gfc-neon,#DBFF00); }
.cal__local { display:block; margin-top:3px; font-weight:600; color:var(--gfc-white-soft,#F4F4F6); }

/* ---------- modal (local da demonstração) ---------- */
.modal { position:fixed; inset:0; z-index:50; display:none; align-items:center; justify-content:center;
  padding:24px calc(24px + env(safe-area-inset-right)) 24px calc(24px + env(safe-area-inset-left));
  background:rgba(6,6,8,.66); backdrop-filter:blur(5px); }
.modal.is-open { display:flex; }
.modal__box { width:100%; max-width:360px; background:var(--gfc-surface-1,#131316);
  border:1px solid var(--gfc-line-strong,#3A3A42); border-radius:18px; padding:28px 22px 22px;
  text-align:center; box-shadow:0 24px 60px rgba(0,0,0,.5); animation:modalUp .18s ease; }
@keyframes modalUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
.modal__icon { font-size:34px; line-height:1; margin-bottom:10px; }
.modal__title { font:700 20px 'Saira',sans-serif; color:#fff; margin-bottom:10px; }
.modal__intro { font-size:14px; line-height:1.5; color:var(--gfc-gray-light,#C7C7CF); margin-bottom:8px; }
.modal__local { font:700 18px 'Saira',sans-serif; line-height:1.35; color:var(--gfc-neon,#DBFF00); margin-bottom:22px; }

/* ---------- saudação ---------- */
.ok__slogan { font-family:'Saira',system-ui,sans-serif; font-weight:700; font-size: clamp(30px, 9vw, 46px); line-height:1.05; color: var(--gfc-neon,#DBFF00); letter-spacing:-.01em; }
.ok__resumo { background:var(--gfc-surface-1,#131316); border:1px solid var(--gfc-line,#26262B); border-radius:16px; padding:16px; font-size:14px; line-height:1.7; color:var(--gfc-gray-light,#C7C7CF); }
.ok__resumo b { color:#fff; font-weight:600; }
.ok__inner .btn { margin-top:8px; align-self:flex-start; }