/* ============================================================
   O PONTO PERFEITO — ferramenta interativa
   ============================================================ */

.thead{position:relative;overflow:hidden;padding:clamp(96px,13vw,150px) 0 clamp(34px,5vw,60px)}
.thead__bg{position:absolute;inset:0;z-index:0}
.thead__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 62%;
  filter:saturate(1.04) contrast(1.08) brightness(.36)}
.thead__bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,9,8,.9) 0%,rgba(10,9,8,.66) 40%,var(--coal) 96%)}
.thead__in{position:relative;z-index:2}
.thead h1{font-size:clamp(2.4rem,8.2vw,6.6rem);max-width:17ch}
.thead p{max-width:56ch;margin-top:20px}

/* ---------- Barra de navegação enxuta ---------- */
.tnav{position:fixed;top:0;left:0;right:0;z-index:8000;display:flex;align-items:center;
  justify-content:space-between;gap:18px;padding:14px var(--pad);
  background:rgba(10,9,8,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--hairline)}
.tnav img{height:36px;width:auto}
.tnav a.back{font-family:'Space Mono',monospace;font-size:.62rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--paper-dim);display:flex;align-items:center;gap:9px}
.tnav a.back:hover{color:var(--ember)}

/* ---------- Seletor de corte ---------- */
.cuts{display:flex;gap:9px;flex-wrap:wrap}
.cut{padding:11px 17px;border:1px solid var(--hairline);border-radius:999px;
  background:var(--coal-2);font-family:'Anton',sans-serif;text-transform:uppercase;
  font-size:.83rem;letter-spacing:.02em;line-height:1;color:var(--paper-dim);
  transition:all .3s var(--ease-2);white-space:nowrap}
.cut:hover{border-color:rgba(255,103,0,.5);color:var(--paper)}
.cut[aria-pressed="true"]{background:var(--ember);border-color:var(--ember);color:#140A02}

/* ---------- Painel do medidor ---------- */
.gauge{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(26px,4vw,64px);
  align-items:center;margin-top:clamp(28px,4vw,52px);
  padding:clamp(22px,3.2vw,46px);border:1px solid var(--hairline);border-radius:4px;
  background:linear-gradient(168deg,var(--coal-3) 0%,var(--coal) 68%)}
@media(max-width:900px){.gauge{grid-template-columns:1fr;gap:28px}}

.steak{width:100%;max-width:470px;margin-inline:auto;display:block;overflow:visible;
  filter:drop-shadow(0 26px 46px rgba(0,0,0,.7))}
.steak .crust{fill:#2C1409}
.steak .cooked{fill:#84503A}
.steak .inner{transition:transform .55s var(--ease-2),fill .55s var(--ease-2);
  transform-box:fill-box;transform-origin:center}
.steak .cap{fill:none;stroke:#E8D4B2;stroke-width:15;stroke-linecap:butt;
  opacity:.92;transition:opacity .4s var(--ease-2)}
.steak .mark{stroke:#170A04;stroke-width:8;stroke-linecap:round;opacity:.34}

.readout{display:flex;flex-direction:column}
.readout__stage{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:1;
  font-size:clamp(1.7rem,4.2vw,3.1rem);letter-spacing:-.016em;color:var(--ember);
  min-height:1em}
.readout__temp{display:flex;align-items:baseline;gap:9px;margin-top:12px;flex-wrap:wrap}
.readout__temp b{font-family:'Anton',sans-serif;font-size:clamp(2.6rem,6.4vw,4.6rem);
  line-height:.9;letter-spacing:-.026em;white-space:nowrap}
.readout__temp span{font-family:'Space Mono',monospace;font-size:.66rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ash)}
.readout__note{margin-top:18px;font-size:.97rem;line-height:1.6;color:var(--paper-dim);
  min-height:4.8em;max-width:46ch}
.readout__note b{color:var(--paper);font-weight:600}
.readout__warn{margin-top:14px;display:none;gap:11px;align-items:flex-start;
  padding:12px 15px;border:1px solid rgba(255,103,0,.36);border-radius:3px;
  background:rgba(255,103,0,.07);font-size:.85rem;line-height:1.5;color:var(--paper)}
.readout__warn.on{display:flex}
.readout__warn svg{width:16px;height:16px;flex:none;margin-top:.2em;color:var(--ember)}

/* Régua deslizante = a escala de ponto */
.slider{margin-top:26px}
.slider input{-webkit-appearance:none;appearance:none;width:100%;height:10px;border-radius:6px;
  background:var(--scale);outline:none;cursor:pointer}
.slider input::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;
  background:var(--paper);border:3px solid var(--coal);cursor:grab;
  box-shadow:0 0 0 1px rgba(235,216,188,.5),0 6px 20px -4px rgba(0,0,0,.9)}
.slider input::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--paper);
  border:3px solid var(--coal);cursor:grab;box-shadow:0 0 0 1px rgba(235,216,188,.5)}
.slider__labels{display:flex;justify-content:space-between;margin-top:11px;gap:6px}
.slider__labels span{font-family:'Space Mono',monospace;font-size:.52rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ash);text-align:center;flex:1;line-height:1.35;
  transition:color .3s var(--ease-2)}
.slider__labels span.on{color:var(--ember)}
.slider__labels span:first-child{text-align:left}
.slider__labels span:last-child{text-align:right}

.ideal{margin-top:20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ash)}
.ideal b{color:var(--ember);font-weight:400}
.ideal button{border:1px solid var(--hairline);border-radius:999px;padding:8px 14px;
  font-family:'Space Mono',monospace;font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--paper-dim);transition:all .3s var(--ease-2)}
.ideal button:hover{border-color:var(--ember);color:var(--ember)}

/* ---------- Calculadora ---------- */
.calc{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(24px,3.4vw,54px);align-items:start}
@media(max-width:900px){.calc{grid-template-columns:1fr}}
.form{display:grid;gap:18px;padding:clamp(22px,3vw,36px);border:1px solid var(--hairline);
  border-radius:4px;background:var(--coal-2)}
.field label{display:block;font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ash);margin-bottom:9px}
.stepper{display:flex;align-items:center;border:1px solid var(--hairline);border-radius:3px;
  overflow:hidden;background:var(--coal);max-width:210px}
.stepper button{width:54px;height:52px;flex:none;font-size:1.7rem;font-weight:400;
  line-height:1;color:var(--paper);background:rgba(235,216,188,.05);
  transition:background .25s var(--ease-2),color .25s var(--ease-2)}
.stepper button:hover{background:var(--ember);color:#140A02}
.stepper input{flex:1;min-width:0;height:52px;border:0;background:transparent;text-align:center;
  font-family:'Anton',sans-serif;font-size:1.6rem;color:var(--paper);
  -moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0}
.toggle{display:flex;gap:8px}
.toggle button{flex:1;padding:13px 10px;border:1px solid var(--hairline);border-radius:3px;
  background:var(--coal);font-family:'Anton',sans-serif;text-transform:uppercase;font-size:.8rem;
  letter-spacing:.02em;color:var(--paper-dim);transition:all .28s var(--ease-2);line-height:1.2}
.toggle button[aria-pressed="true"]{background:var(--ember);border-color:var(--ember);color:#140A02}

/* Ordem de serviço */
.order{border:1px solid var(--hairline);border-radius:4px;overflow:hidden;background:var(--coal-2)}
.order__h{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:20px clamp(20px,2.6vw,30px);border-bottom:1px solid var(--hairline);
  background:linear-gradient(180deg,rgba(255,103,0,.09),transparent)}
.order__h h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-weight:400;
  font-size:clamp(1.06rem,2vw,1.42rem);letter-spacing:-.006em;line-height:1.1}
.order__h span{font-family:'Space Mono',monospace;font-size:.56rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ash)}
.order__b{padding:clamp(18px,2.4vw,28px) clamp(20px,2.6vw,30px) clamp(22px,2.8vw,32px)}
.order__grp{margin-bottom:22px}
.order__grp:last-of-type{margin-bottom:0}
.order__grp h4{font-family:'Space Mono',monospace;font-size:.56rem;letter-spacing:.2em;
  text-transform:uppercase;color:var(--ember);margin:0 0 11px;font-weight:400}
.order__grp ul{list-style:none;margin:0;padding:0;display:grid;gap:0}
.order__grp li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:10px 0;border-bottom:1px dashed rgba(235,216,188,.13);font-size:.93rem}
.order__grp li:last-child{border-bottom:0}
.order__grp li i{font-style:normal;color:var(--paper-dim)}
.order__grp li b{font-family:'Anton',sans-serif;font-weight:400;font-size:1.02rem;
  letter-spacing:.01em;white-space:nowrap}
.order__grp li b em{font-style:normal;color:var(--ember)}
.order__tot{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  margin-top:20px;padding-top:18px;border-top:1px solid var(--hairline)}
.order__tot span{font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ash)}
.order__tot b{font-family:'Anton',sans-serif;font-size:clamp(1.5rem,3vw,2.1rem);
  line-height:1;letter-spacing:-.014em;color:var(--ember)}
.order__act{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.order__act button{padding:13px 20px;border:1px solid var(--hairline);border-radius:3px;
  font-family:'Space Mono',monospace;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--paper-dim);transition:all .3s var(--ease-2);display:flex;align-items:center;gap:9px}
.order__act button:hover{border-color:var(--ember);color:var(--ember)}
.order__act button svg{width:14px;height:14px}

/* ---------- CTA ---------- */
.tcta{position:relative;overflow:hidden;text-align:center;padding-block:clamp(64px,9vw,120px);
  border-top:1px solid var(--hairline)}
.tcta h2{margin-inline:auto;max-width:20ch;font-size:clamp(1.7rem,4.2vw,3.7rem)}
.tcta p{max-width:52ch;margin:22px auto 0}