:root{--ink:#1c1918;--muted:#6f6561;--line:#ebe4dd;--accent:#9f6d39;--red:#6b1d29;--wine:#711f31;--wine-dark:#501521;--cream:#fbf8f3;--gold:#d9b274;--gold-soft:#e4c8a3;--panel:#fff;--serif:Georgia,"Times New Roman",serif;--radius:16px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:var(--red)}:focus-visible{outline:3px solid #b48a53;outline-offset:3px}[hidden]{display:none!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Topo */
.topbar{background:#1a1415;color:#fff;border-bottom:1px solid #ffffff12;position:relative;z-index:3}.topbar-inner{max-width:1180px;margin:auto;padding:16px 26px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:13px}.brand img{height:42px;width:42px;object-fit:cover;border-radius:50%;border:1px solid #6f5452;box-shadow:0 0 0 3px #ffffff08}.brand span{font-family:var(--serif);letter-spacing:.18em;font-size:22px;font-weight:700;line-height:1}.brand small{display:block;font:9px/1.1 Arial,sans-serif;text-align:center;letter-spacing:.45em;color:#d8b8a2;margin-top:6px}.top-flag{font-size:10px;letter-spacing:.2em;font-weight:700;color:#d7b98e;padding:7px 13px;border:1px solid #d7b98e40;border-radius:30px}

/* Hero curto e centralizado; o formulário sobe por cima dele */
.hero{background:radial-gradient(ellipse at 70% 40%,#6d2a30 0%,#401923 42%,#25181d 80%,#211a1d 100%);color:#fff;display:grid;justify-items:center;text-align:center;padding:58px 26px 176px;position:relative;overflow:hidden}
.hero:before{content:"鮨";position:absolute;right:max(3%,calc((100% - 1240px)/2));top:50%;transform:translateY(-58%) rotate(-6deg);font:270px/1 var(--serif);color:#d9b28a14;pointer-events:none;z-index:0}
.hero-aura{position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(circle at 12% 120%,#c99a5f1c 0%,transparent 45%),radial-gradient(circle at 75% 40%,#a8434a30 0%,transparent 40%)}
.hero-copy{max-width:760px;position:relative;z-index:1}
.eyebrow,.section-kicker{font-size:11px;font-weight:700;letter-spacing:.18em;color:#b99561}.eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;color:#d1ab74}.eyebrow i,.eyebrow:after{content:"";width:26px;height:1px;background:currentColor}
.hero h1{font:400 clamp(38px,4.6vw,56px)/1.08 var(--serif);letter-spacing:-.035em;margin:16px 0 14px}.hero h1 em{font-style:italic;color:var(--gold-soft)}
.hero-copy>p{max-width:560px;color:#e6d6d4;font-size:16px;line-height:1.65;margin:0 auto 24px}
.hero-tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.hero-tags span{padding:8px 14px;border:1px solid #ffffff22;border-radius:30px;font-size:12px;color:#efdedb;background:#ffffff0a}

/* Área de reserva */
.reserve-area{max-width:1180px;margin:-136px auto 0;padding:0 26px 90px;position:relative;z-index:2}
.reserve-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);gap:26px;align-items:start}
.panel-form,.side-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 1px 2px #3e281008,0 14px 40px #3e28100d}
.panel-form{padding:34px 38px 30px;border:0;box-shadow:0 30px 70px #2a10163d,0 2px 6px #2a101612;scroll-margin-top:16px}

/* Barra de etapas */
.etapas{list-style:none;margin:0 0 30px;padding:0;display:flex;scroll-margin-top:16px}
.etapas li{flex:1;position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#a99c96;text-align:center}
.etapas li:before{content:"";position:absolute;top:14px;right:50%;width:100%;height:2px;background:#efe7e1;z-index:0;transition:background .25s}
.etapas li:first-child:before{display:none}
.etapa-num{position:relative;z-index:1;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#efe7e1;color:#8f817b;font-size:12px;font-weight:800;border:2px solid #efe7e1;transition:all .25s}
.etapas li.cur{color:var(--ink)}.etapas li.cur .etapa-num{background:#fff;border-color:var(--wine);color:var(--wine);box-shadow:0 0 0 5px #7120310f}
.etapas li.cur:before,.etapas li.done:before{background:var(--wine)}
.etapas li.done{color:var(--wine)}.etapas li.done .etapa-num{background:var(--wine);border-color:var(--wine);color:transparent;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1.5 5.2l3 3 6-6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:12px}

.etapa-head{margin:0 0 22px}.etapa-head h2{margin:0;font:400 26px/1.2 var(--serif);letter-spacing:-.02em}.etapa-head p{margin:4px 0 0;color:var(--muted);font-size:13px}
.etapa{animation:etapaIn .25s ease}@keyframes etapaIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.resumo{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 24px;padding:12px 14px;background:#f8f4ef;border-radius:12px;font-size:12.5px;color:#5b4c40}
.resumo b{color:var(--wine);margin-right:2px}.resumo span{padding:4px 11px;background:#fff;border:1px solid #eadccb;border-radius:30px}

.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{margin:0 0 20px}
.field label,.field-label{display:block;font-size:12.5px;font-weight:700;margin:0 0 8px;color:#332c29}.field label small{font-weight:400;color:#8b827d}
.field input,.field select,.field textarea{width:100%;border:1px solid #ddd5ce;border-radius:10px;background:#fff;padding:12px 14px;color:#25201d;min-height:50px;outline:none;transition:border-color .15s,box-shadow .15s,background-color .15s}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#c9bbb0}
.field select{appearance:none;-webkit-appearance:none;padding-right:42px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23711f31' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.field input[type=date]{cursor:pointer}.field input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.55}
.field textarea{resize:vertical;min-height:92px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#a8774f;box-shadow:0 0 0 4px #be97621f}
.field input::placeholder,.field textarea::placeholder{color:#aaa29e}

/* Cards de horário */
.turno-box{margin-bottom:6px}
.turnos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.turno{position:relative;background:#fff;border:1.5px solid #e2d9d0;border-radius:12px;padding:16px 16px 14px;text-align:left;min-height:96px;color:#302725;display:flex;flex-direction:column;justify-content:space-between;gap:10px;transition:border-color .15s,background .15s,box-shadow .15s,transform .15s}
.turno:hover:not(:disabled){border-color:#b98d77;box-shadow:0 6px 18px #5a2a2012;transform:translateY(-1px)}
.turno strong{font:400 24px/1.1 var(--serif);letter-spacing:-.01em}
.turno small{font-size:11.5px;color:#2f7a4f;font-weight:600}
.turno:after{content:"";position:absolute;top:14px;right:14px;width:20px;height:20px;border-radius:50%;border:1.5px solid #d8cdc3;background:#fff;transition:all .15s}
.turno.active{border-color:var(--wine);background:#fcf4f2;box-shadow:0 0 0 3px #71203116}
.turno.active:after{border-color:var(--wine);background:var(--wine) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1.5 5.2l3 3 6-6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/11px no-repeat}
.turno:disabled{background:repeating-linear-gradient(135deg,#faf7f4 0 8px,#f5f1ed 8px 16px);border:1.5px dashed #ddd2c8;cursor:not-allowed;box-shadow:none;transform:none}
.turno:disabled strong{color:#a79b94;text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:#c6b6ad}
.turno:disabled small{color:#a2584f;font-weight:500}.turno:disabled:after{display:none}
.loading{grid-column:1/-1;background:#f6f2ee;color:#80756f;border-radius:10px;padding:16px;font-size:12.5px}
.field-hint{margin:9px 0 0;color:#8b5049;font-size:12.5px;min-height:1em}.field-hint:empty{display:none}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Consentimento e navegação */
.consent{display:flex;align-items:flex-start;gap:11px;color:#6c635d;font-size:12.5px;margin:4px 0 20px;padding:13px 14px;border-radius:10px;background:#f8f4ef;cursor:pointer}
.consent input{margin:2px 0 0;width:17px;height:17px;flex:0 0 17px;accent-color:var(--wine);cursor:pointer}
.consent a{text-decoration:underline;text-underline-offset:3px}
.nav-etapas{display:flex;gap:10px;margin-top:20px}
.btn-continuar,.submit-btn{flex:1;border:0;border-radius:11px;background:var(--wine);color:#fff;min-height:56px;padding:14px 18px;font-size:15px;font-weight:700;letter-spacing:.01em;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:0 10px 24px #71203130;transition:background .2s,box-shadow .2s,transform .15s}
.btn-continuar:hover:not(:disabled),.submit-btn:hover:not(:disabled){background:var(--wine-dark);transform:translateY(-1px);box-shadow:0 14px 28px #71203138}
.btn-continuar:disabled,.submit-btn:disabled{background:#cfc2c0;color:#fffaf8;box-shadow:none;cursor:not-allowed}
.btn-continuar span{font-size:18px;line-height:1}.submit-btn span{font-size:22px;line-height:1}
.btn-voltar{flex:0 0 auto;min-width:130px;min-height:56px;padding:12px 20px;border-radius:11px;border:1px solid #d6c9c1;background:#fff;color:#513b32;font-weight:700;font-size:14px;transition:background .15s,border-color .15s}
.btn-voltar:hover{background:#f8f2ed;border-color:#b9a598}
/* Valores do rodízio: visíveis nas duas etapas, antes de confirmar */
.valores{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;margin:6px 0 0;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:#fdfbf8}
.valores-tit{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#9a7650}
.valores-lista{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:#5b4c40}
.valores-lista strong{font-weight:700;color:var(--wine);margin-left:4px}
.valores small{flex-basis:100%;font-size:11px;color:#8d817b}
.form-feedback{font-size:12.5px;color:#9d2934;margin:0 0 12px;min-height:1px}.form-feedback:empty{display:none}
.fineprint{font-size:11.5px;text-align:center;color:#817773;margin:14px 0 0}

/* Coluna lateral */
.side-info{display:flex;flex-direction:column;gap:18px}
.side-card{padding:28px}
.side-dark{background:linear-gradient(160deg,#2c2221 0%,#231b1b 100%);border-color:#2c2221;color:#fff;position:relative;overflow:hidden;box-shadow:0 30px 70px #2a10163d}
.side-dark:before{content:"";position:absolute;right:-60px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,#a8434a40,transparent 70%);pointer-events:none}
.side-kicker{font-size:10px;letter-spacing:.16em;font-weight:700;color:#c29a69}
.side-dark h3{font:400 27px/1.22 var(--serif);margin:14px 0 22px;max-width:260px;position:relative}
.info-item{display:flex;gap:14px;align-items:flex-start;padding:15px 0;border-top:1px solid #ffffff14}
.info-icon{flex:0 0 34px;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#ffffff0d;color:#d0a777;font-size:16px;line-height:1}
.info-icon svg{width:17px;height:17px;display:block}
.info-item strong{font-size:13.5px;font-weight:650}.info-item p{font-size:12.5px;color:#cbbdbc;margin:2px 0 0}
.side-note{background:#f2ebe2;border:1px solid #e9dfd2;border-radius:12px;padding:17px 19px;font-size:12.5px;color:#685b4b}

/* Tela de sucesso */
.success-view{text-align:center;padding:8px 4px 10px}
.success-icon{background:#e6f2e9;color:#2f854d;width:68px;height:68px;margin:0 auto 20px;border-radius:50%;font-size:34px;line-height:68px;box-shadow:0 0 0 8px #e6f2e966}
.success-view h2{font:400 34px/1.15 var(--serif);margin:14px 0}
.success-view>p{max-width:440px;margin:0 auto 24px;color:var(--muted);font-size:13.5px}
.ticket{position:relative;margin:22px auto;border:1px solid #e3cfb6;border-radius:16px;background:linear-gradient(180deg,#fffaf3,#fff6ea);max-width:460px;padding:26px 20px 22px;box-shadow:0 10px 26px #7a502018}
.ticket small{font-size:10px;font-weight:700;letter-spacing:.16em;color:#80654f}
.ticket strong{display:block;font:400 34px var(--serif);color:#6f2533;margin:8px 0 22px;letter-spacing:.06em}
.ticket-bottom{border-top:1.5px dashed #dcc7ae;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding-top:18px;font-size:12px;color:#5b4c40}
.ticket-bottom span{padding:5px 11px;border-radius:30px;background:#fff;border:1px solid #eadccb}
.success-view .success-foot{font-size:12px;max-width:420px}
.restart{background:transparent;border:1px solid #c9b9b0;border-radius:10px;padding:12px 24px;color:#513b32;margin-top:12px;font-weight:600;transition:background .15s,border-color .15s}
.restart:hover{background:#f6efe9;border-color:#ad978b}
#copiarConfirmacao{display:block;margin:8px auto 5px;background:var(--wine);border-color:var(--wine);color:#fff}
#copiarConfirmacao:hover{background:var(--wine-dark);border-color:var(--wine-dark)}

footer{background:#1a1415;color:#ad9d96;padding:24px max(26px,calc((100% - 1128px)/2));font-size:11.5px;display:flex;justify-content:space-between;gap:20px;letter-spacing:.04em}

/* Aviso de horário indisponível e contato humano: tons quentes da marca, contraste alto */
.availability-note{position:relative;margin-top:14px;padding:18px 20px 18px 22px;background:#fdf3e4;border:1px solid #ecd2ab;border-left:4px solid #c8893c;border-radius:12px;color:#5a3a22;font-size:13.5px}
.availability-note strong{display:block;margin-bottom:6px;font-weight:750;font-size:14.5px;color:#4d2a14}
.availability-note p{margin:0 0 14px;line-height:1.6}
.availability-actions{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.other-time-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;border-radius:9px;border:1px solid var(--wine);background:var(--wine);color:#fff;font-weight:700;font-size:12.5px;transition:background .15s}
.other-time-btn:hover{background:#59202b}
.contact-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;border-radius:9px;background:#246e4b;color:#fff;font-weight:700;text-decoration:none;font-size:12.5px;transition:background .15s}
.contact-btn:hover{background:#195537;color:#fff}
.form-feedback:not(:empty){border:1px solid #ecd2ab;border-left:4px solid #c8893c;background:#fdf3e4;color:#5a3a22;padding:13px 16px;border-radius:10px;font-weight:650;line-height:1.55;margin:16px 0 0}

/* Responsivo */
@media(min-width:851px){.side-info{position:sticky;top:24px}}
@media(max-width:850px){.hero:before{font-size:200px;right:-20px}.reserve-grid{grid-template-columns:1fr}.side-info{display:grid;grid-template-columns:1fr 1fr}.side-note{grid-column:1/-1}}
@media(max-width:600px){.topbar-inner{padding:13px 18px}.brand img{width:38px;height:38px}.brand span{font-size:19px}.top-flag{font-size:8px;padding:6px 10px}.hero{padding:40px 20px 150px}.hero:before{font-size:170px;opacity:.8}.hero h1{font-size:36px;margin:14px 0 12px}.hero-copy>p{font-size:14.5px;margin-bottom:20px}.hero-tags span{font-size:11px;padding:7px 12px}.reserve-area{margin-top:-118px;padding:0 12px 60px}.panel-form{padding:24px 18px 22px;border-radius:14px}.etapas{margin-bottom:24px}.etapas li{font-size:11px}.etapa-head h2{font-size:23px}.form-row{grid-template-columns:1fr;gap:0}.turnos{gap:10px}.turno{padding:14px 12px 12px;min-height:92px}.turno strong{font-size:20px}.turno:after{top:12px;right:10px;width:18px;height:18px}.turno small{font-size:11px}.btn-voltar{min-width:0;padding:12px 16px}.side-info{grid-template-columns:1fr}.valores{padding:12px 14px}.valores-lista{gap:4px 14px}.side-card{padding:24px 22px}.availability-actions{flex-direction:column;align-items:stretch}.other-time-btn,.availability-actions .contact-btn{width:100%;text-align:center}.ticket strong{font-size:29px}footer{padding:22px 18px;font-size:10.5px;flex-direction:column;gap:6px;text-align:center}}

/* Safari/iPhone: evita extravasamento do campo nativo de data com padding.
   Mantem o calendario nativo, os espacamentos e as bordas do layout aprovado. */
@media (max-width:600px) {
  #etapa1 .form-row {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
  }
  #etapa1 .form-row > .field {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  #etapa1 #data {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  #etapa1 #data::-webkit-date-and-time-value {
    min-width: 0;
    min-height: 1.5em;
    text-align: center;
  }
}
