:root {
                      --bg: #f5f5f7;
                      --card: #fff;
                      --ink: #111;
                      --mut: #6b6b73;
                      --acc: #e63a00;
                      --line: #ececf0
                  }
                  
                  * {
                      box-sizing: border-box;
                      margin: 0;
                      padding: 0
                  }
                  
                  html {
                      scroll-behavior: smooth;
                      scroll-padding-top: 150px
                  }
                  
                  body {
                      font-family: 'Plus Jakarta Sans', sans-serif;
                      background: var(--bg);
                      color: var(--ink);
                      padding-bottom: 110px;
                      -webkit-font-smoothing: antialiased
                  }
                  
                  button {
                      font-family: inherit;
                      cursor: pointer;
                      border: 0
                  }
                  
                  .wrap {
                      max-width: 1100px;
                      margin: auto;
                      padding: 0 16px
                  }
                  /* top bar */
                  
                  .top {
                      position: sticky;
                      top: 0;
                      z-index: 50;
                      background: rgba(255, 255, 255, .96);
                      backdrop-filter: blur(8px);
                      border-bottom: 1px solid var(--line)
                  }
                  
                  .bar {
                      display: flex;
                      align-items: center;
                      gap: 12px;
                      padding: 10px 16px;
                      max-width: 1100px;
                      margin: auto
                  }
                  
                  .brand {
                      display: flex;
                      align-items: center;
                      gap: 10px;
                      font-weight: 800;
                      font-size: 17px;
                      line-height: 1.1;
                      text-decoration: none;
                      color: var(--ink)
                  }
                  
                  .brand img {
                      width: 42px;
                      height: 42px;
                      border-radius: 50%;
                      object-fit: cover
                  }
                  
                  .brand small {
                      display: block;
                      font-weight: 500;
                      font-size: 11px;
                      color: var(--mut)
                  }
                  
                  .search {
                      flex: 1;
                      position: relative
                  }
                  
                  .search input {
                      width: 100%;
                      height: 44px;
                      border: 1px solid var(--line);
                      border-radius: 22px;
                      padding: 0 16px 0 40px;
                      font: 500 14px inherit;
                      font-family: inherit;
                      background: #fff
                  }
                  
                  .search:before {
                      content: "🔍";
                      position: absolute;
                      left: 14px;
                      top: 11px;
                      font-size: 14px
                  }
                  
                  .ic {
                      width: 44px;
                      height: 44px;
                      border-radius: 50%;
                      background: #fff;
                      border: 1px solid var(--line);
                      font-size: 18px;
                      position: relative
                  }
                  
                  .ic b {
                      position: absolute;
                      top: -6px;
                      right: -6px;
                      min-width: 20px;
                      height: 20px;
                      border-radius: 10px;
                      background: #2b8cff;
                      color: #fff;
                      font-size: 11px;
                      display: none;
                      align-items: center;
                      justify-content: center;
                      padding: 0 5px
                  }
                  
                  .chips {
                      display: flex;
                      gap: 8px;
                      overflow-x: auto;
                      padding: 0 16px 10px;
                      max-width: 1100px;
                      margin: auto;
                      scrollbar-width: none
                  }
                  
                  .chips::-webkit-scrollbar {
                      display: none
                  }
                  
                  .chip {
                      flex: none;
                      padding: 10px 16px;
                      border-radius: 22px;
                      background: #efeff2;
                      color: #333;
                      font-weight: 600;
                      font-size: 14px;
                      text-decoration: none;
                      border: 2px solid transparent
                  }
                  
                  .chip.on {
                      background: #fff4ec;
                      border-color: #f5a623;
                      color: #c77800
                  }
                  /* hero */
                  
                  .hero {
                      margin-top: 16px;
                      border-radius: 22px;
                      background: linear-gradient(120deg, #111 0%, #3a1608 55%, var(--acc) 130%);
                      color: #fff;
                      padding: 26px 22px;
                      display: flex;
                      align-items: center;
                      gap: 20px;
                      overflow: hidden
                  }
                  
                  .hero img {
                      width: 120px;
                      height: 120px;
                      border-radius: 50%;
                      object-fit: cover;
                      flex: none;
                      border: 3px solid rgba(255, 255, 255, .25)
                  }
                  
                  .hero h1 {
                      font-size: clamp(22px, 4.6vw, 34px);
                      line-height: 1.15;
                      font-weight: 800
                  }
                  
                  .hero p {
                      margin-top: 8px;
                      font-size: 14px;
                      opacity: .9;
                      line-height: 1.5
                  }
                  
                  .tags {
                      display: flex;
                      flex-wrap: wrap;
                      gap: 8px;
                      margin-top: 14px
                  }
                  
                  .tags span {
                      background: rgba(175, 125, 125, 0.252);
                      border-radius: 14px;
                      padding: 6px 12px;
                      font-size: 12px;
                      font-weight: 600
                  }
                  
                  .promo {
                      margin-top: 12px;
                      background: #fff;
                      border: 1.5px dashed var(--acc);
                      border-radius: 16px;
                      padding: 14px 16px;
                      font-size: 14px;
                      line-height: 1.5
                  }
                  
                  .promo strong {
                      color: var(--acc)
                  }
                  /* menu */
                  
                  h2.cat {
                      font-size: 22px;
                      font-weight: 800;
                      margin: 30px 0 12px;
                      padding-left: 12px;
                      border-left: 5px solid #f5a623
                  }
                  
                  .list {
                      display: grid;
                      gap: 12px;
                      grid-template-columns: 1fr
                  }
                  
                  @media(min-width:800px) {
                      .list {
                          grid-template-columns: 1fr 1fr
                      }
                  }
                  
                  @media(min-width:1150px) {
                      .list {
                          grid-template-columns: 1fr 1fr
                      }
                  }
                  
                  .item {
                      background: var(--card);
                      border-radius: 20px;
                      padding: 14px;
                      display: flex;
                      gap: 14px;
                      box-shadow: 0 1px 2px rgba(0, 0, 0, .05)
                  }
                  
                  .item img {
                      width: 104px;
                      height: 104px;
                      border-radius: 14px;
                      object-fit: cover;
                      flex: none;
                      background: #eee
                  }
                  
                  .info {
                      flex: 1;
                      min-width: 0;
                      display: flex;
                      flex-direction: column
                  }
                  
                  .info h3 {
                      font-size: 16px;
                      font-weight: 700;
                      line-height: 1.25
                  }
                  
                  .info p {
                      font-size: 13px;
                      color: var(--mut);
                      line-height: 1.5;
                      margin-top: 4px
                  }
                  
                  .opts {
                      display: flex;
                      flex-wrap: wrap;
                      gap: 6px;
                      margin-top: 8px
                  }
                  
                  .opts input {
                      display: none
                  }
                  
                  .opts label {
                      padding: 5px 11px;
                      border-radius: 14px;
                      background: #efeff2;
                      font-size: 12px;
                      font-weight: 600;
                      cursor: pointer
                  }
                  
                  .opts input:checked+label {
                      background: var(--ink);
                      color: #fff
                  }
                  
                  .foot {
                      display: flex;
                      align-items: center;
                      justify-content: space-between;
                      margin-top: auto;
                      padding-top: 10px
                  }
                  
                  .price {
                      font-size: 19px;
                      font-weight: 800
                  }
                  
                  .add {
                      background: var(--ink);
                      color: #fff;
                      border-radius: 20px;
                      padding: 10px 20px;
                      font-weight: 700;
                      font-size: 14px
                  }
                  
                  .add.ok {
                      background: #039539
                  }
                  
                  @media(max-width:480px) {
                      .item {
                          flex-direction: column
                      }
                      .item img {
                          width: 100%;
                          height: 150px
                      }
                      .hero img {
                          display: none
                      }
                  }
                  /* seo text */
                  
                  .seo {
                      margin-top: 36px;
                      background: #fff;
                      border-radius: 22px;
                      padding: 24px 20px
                  }
                  
                  .seo h2 {
                      font-size: 20px;
                      margin-bottom: 10px
                  }
                  
                  .seo h3 {
                      font-size: 16px;
                      margin: 18px 0 6px
                  }
                  
                  .seo p {
                      font-size: 14px;
                      color: #444;
                      line-height: 1.7;
                      max-width: 80ch
                  }
                  
                  details {
                      border-top: 1px solid var(--line);
                      padding: 12px 0
                  }
                  
                  summary {
                      font-weight: 700;
                      font-size: 14px;
                      cursor: pointer
                  }
                  
                  details p {
                      margin-top: 8px
                  }
                  
                  .loc {
                      margin-top: 20px;
                      background: #fff;
                      border-radius: 22px;
                      padding: 20px
                  }
                  
                  .loc iframe {
                      width: 100%;
                      height: 280px;
                      border: 0;
                      border-radius: 16px;
                      margin-top: 12px
                  }
                  
                  .apps {
                      display: flex;
                      flex-wrap: wrap;
                      gap: 8px;
                      margin-top: 14px
                  }
                  
                  .apps a {
                      background: #efeff2;
                      border-radius: 18px;
                      padding: 9px 16px;
                      font-size: 13px;
                      font-weight: 700;
                      color: var(--ink);
                      text-decoration: none
                  }
                  /* Facebook responsive */
                  
                  .fb-responsive {
                      width: 100%;
                      max-width: 500px;
                      margin: 25px auto 0;
                      overflow: hidden;
                      border-radius: 14px;
                  }
                  
                  .fb-responsive .fb-page,
                  .fb-responsive .fb-page>span,
                  .fb-responsive iframe {
                      width: 100% !important;
                      max-width: 100% !important;
                  }
                  
                  .fb-responsive iframe {
                      display: block;
                  }
                  /* Celulares */
                  
                  @media (max-width: 600px) {
                      .fb-responsive {
                          width: 100%;
                          max-width: 100%;
                          margin-top: 20px;
                          border-radius: 12px;
                      }
                      .fb-responsive .fb-page {
                          width: 100% !important;
                      }
                  }
                  
                  footer {
                      text-align: center;
                      color: var(--mut);
                      font-size: 12px;
                      padding: 24px 16px;
                      line-height: 1.7
                  }
                  /* cart */
                  
                  #bar {
                      position: fixed;
                      left: 50%;
                      bottom: 16px;
                      transform: translateX(-50%) translateY(140%);
                      width: calc(100% - 32px);
                      max-width: 640px;
                      background: var(--ink);
                      color: #fff;
                      border-radius: 34px;
                      height: 64px;
                      display: flex;
                      align-items: center;
                      gap: 14px;
                      padding: 0 20px 0 10px;
                      font-weight: 700;
                      font-size: 16px;
                      z-index: 60;
                      transition: transform .35s
                  }
                  
                  #bar.show {
                      transform: translateX(-50%)
                  }
                  
                  #bar .n {
                      width: 44px;
                      height: 44px;
                      border-radius: 50%;
                      background: #333;
                      display: flex;
                      align-items: center;
                      justify-content: center
                  }
                  
                  #bar .t {
                      margin-left: auto
                  }
                  
                  #ov {
                      position: fixed;
                      inset: 0;
                      background: rgba(0, 0, 0, .45);
                      opacity: 0;
                      pointer-events: none;
                      transition: .3s;
                      z-index: 70
                  }
                  
                  #ov.on {
                      opacity: 1;
                      pointer-events: auto
                  }
                  
                  #sheet {
                      position: fixed;
                      left: 50%;
                      bottom: 0;
                      transform: translate(-50%, 100%);
                      width: 100%;
                      max-width: 640px;
                      max-height: 88vh;
                      overflow: auto;
                      background: #fff;
                      border-radius: 24px 24px 0 0;
                      padding: 20px;
                      z-index: 80;
                      transition: transform .35s
                  }
                  
                  #sheet.on {
                      transform: translate(-50%, 0)
                  }
                  
                  .sh {
                      display: flex;
                      justify-content: space-between;
                      align-items: center;
                      margin-bottom: 12px
                  }
                  
                  .sh h2 {
                      font-size: 20px
                  }
                  
                  .sh button {
                      background: #efeff2;
                      border-radius: 18px;
                      padding: 8px 14px;
                      font-weight: 600;
                      font-size: 13px
                  }
                  
                  .line {
                      display: flex;
                      align-items: center;
                      gap: 10px;
                      padding: 10px 0;
                      border-bottom: 1px solid var(--line)
                  }
                  
                  .line div {
                      flex: 1;
                      font-size: 14px;
                      font-weight: 600
                  }
                  
                  .line small {
                      display: block;
                      color: var(--mut);
                      font-weight: 500
                  }
                  
                  .q {
                      display: flex;
                      align-items: center;
                      gap: 10px;
                      font-weight: 700
                  }
                  
                  .q button {
                      width: 30px;
                      height: 30px;
                      border-radius: 50%;
                      background: #efeff2;
                      font-size: 18px
                  }
                  
                  .type {
                      display: flex;
                      gap: 10px;
                      margin: 14px 0 8px
                  }
                  
                  .type label {
                      flex: 1;
                      padding: 12px;
                      border-radius: 14px;
                      border: 2px solid var(--line);
                      font-size: 13px;
                      font-weight: 600;
                      text-align: center;
                      cursor: pointer
                  }
                  
                  .type input {
                      display: none
                  }
                  
                  .type input:checked+span {
                      color: var(--acc)
                  }
                  
                  .type label:has(input:checked) {
                      border-color: var(--ink)
                  }
                  
                  #dir {
                      display: none;
                      width: 100%;
                      height: 46px;
                      border: 1px solid #ccc;
                      border-radius: 14px;
                      padding: 0 14px;
                      font: 500 14px inherit;
                      font-family: inherit;
                      margin-bottom: 8px
                  }
                  
                  #tot {
                      font-size: 20px;
                      font-weight: 800;
                      margin: 12px 0
                  }
                  
                  .wa {
                      width: 100%;
                      height: 52px;
                      border-radius: 26px;
                      background: #039539;
                      color: #fff;
                      font-weight: 800;
                      font-size: 16px
                  }
                  
                  .empty {
                      text-align: center;
                      color: var(--mut);
                      padding: 24px 0;
                      font-size: 14px
                  }
                  /* location gate */
                  
                  #lm {
                      position: fixed;
                      inset: 0;
                      background: rgba(0, 0, 0, .55);
                      display: none;
                      align-items: center;
                      justify-content: center;
                      padding: 16px;
                      z-index: 100
                  }
                  
                  #lm.on {
                      display: flex
                  }
                  
                  .lbox {
                      background: #fff;
                      border-radius: 28px;
                      padding: 28px 24px;
                      width: 100%;
                      max-width: 440px;
                      text-align: center;
                      max-height: 92vh;
                      overflow: auto
                  }
                  
                  .lbox .lg {
                      width: 64px;
                      height: 64px;
                      border-radius: 50%;
                      object-fit: cover
                  }
                  
                  .pin {
                      width: 56px;
                      height: 56px;
                      border-radius: 50%;
                      background: #fdeeee;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      font-size: 24px;
                      margin: 14px auto 10px
                  }
                  
                  .lbox h2 {
                      font-size: 22px;
                      font-weight: 800
                  }
                  
                  .lbox p {
                      font-size: 14px;
                      color: var(--mut);
                      line-height: 1.5;
                      margin: 8px 0 18px
                  }
                  
                  .blk {
                      width: 100%;
                      height: 50px;
                      border-radius: 14px;
                      background: var(--ink);
                      color: #fff;
                      font-weight: 700;
                      font-size: 15px
                  }
                  
                  .or {
                      display: flex;
                      align-items: center;
                      gap: 10px;
                      color: #999;
                      font-size: 11px;
                      font-weight: 600;
                      margin: 16px 0;
                      letter-spacing: .04em
                  }
                  
                  .or:before,
                  .or:after {
                      content: "";
                      flex: 1;
                      height: 1px;
                      background: var(--line)
                  }
                  
                  #addr {
                      width: 100%;
                      height: 48px;
                      border: 1px solid var(--line);
                      border-radius: 14px;
                      padding: 0 14px;
                      font: 500 14px inherit;
                      font-family: inherit;
                      background: #fafafa
                  }
                  
                  #sug {
                      list-style: none;
                      text-align: left;
                      margin-top: 6px
                  }
                  
                  #sug li {
                      padding: 11px 12px;
                      font-size: 13px;
                      border-radius: 10px;
                      cursor: pointer;
                      line-height: 1.4
                  }
                  
                  #sug li:hover {
                      background: #f2f2f5
                  }
                  
                  .skip {
                      background: none;
                      color: var(--mut);
                      font-size: 13px;
                      font-weight: 600;
                      margin-top: 14px;
                      text-decoration: underline
                  }
                  
                  .res {
                      border-radius: 18px;
                      padding: 18px;
                      text-align: left;
                      margin-bottom: 14px
                  }
                  
                  .res.ok {
                      background: #eaf7ee;
                      border: 1.5px solid #039539
                  }
                  
                  .res.far {
                      font-family: 'Plus Jakarta Sans';
                      background: #fff4ec;
                      border: 1.5px solid #f5a623
                  }
                  
                  .res h3 {
                      font-size: 17px;
                      margin-bottom: 6px
                  }
                  
                  .res p {
                      margin: 0;
                      font-size: 13.5px;
                      color: #333
                  }
                  
                  .plat {
                      display: grid;
                      gap: 8px;
                      margin: 14px 0
                  }
                  
                  .plat a {
                      display: flex;
                      align-items: center;
                      justify-content: space-between;
                      background: #fff;
                      border: 1px solid var(--line);
                      border-radius: 14px;
                      padding: 13px 16px;
                      font-weight: 700;
                      font-size: 14px;
                      color: var(--ink);
                      text-decoration: none
                  }
                  
                  .plat a:after {
                      content: "›";
                      font-size: 20px;
                      color: #999
                  }
                  
                  .pill {
                      margin-top: 12px;
                      display: flex;
                      align-items: center;
                      gap: 10px;
                      flex-wrap: wrap;
                      background: #fff;
                      border-radius: 16px;
                      padding: 11px 16px;
                      font-size: 13px;
                      font-weight: 600
                  }
                  
                  .pill.ok {
                      color: #027a2e
                  }
                  
                  .pill.far {
                      font-family: 'Plus Jakarta Sans';
                      color: #b45f00
                  }
                  
                  .pill button {
                      background: #efeff2;
                      border-radius: 14px;
                      padding: 6px 12px;
                      font-size: 12px;
                      font-weight: 700;
                      margin-left: auto
                  }
                  
                  #domNote {
                      display: none;
                      background: #fff4ec;
                      border-radius: 14px;
                      padding: 12px;
                      font-size: 13px;
                      line-height: 1.5;
                      margin-bottom: 8px
                  }
                  
                  #domNote a {
                      color: var(--acc);
                      font-weight: 700
                  }
                  
                  .type label.off {
                      opacity: .45;
                      pointer-events: none
                  }
                  /* =========================
CARRUSEL MODERNO
========================= */
                  
                  .car {
                      position: relative;
                      margin-top: 18px;
                      padding: 0;
                  }
                  
                  .track {
                      display: flex;
                      gap: 14px;
                      overflow-x: auto;
                      scroll-snap-type: x mandatory;
                      scrollbar-width: none;
                      border-radius: 20px;
                      background: transparent;
                  }
                  
                  .track::-webkit-scrollbar {
                      display: none;
                  }
                  
                  .sl {
                      flex: 0 0 100%;
                      scroll-snap-align: center;
                      position: relative;
                      border-radius: 20px;
                      overflow: hidden;
                      height: clamp(220px, 35vw, 350px);
                      background: #e9e9e9;
                      box-shadow: 0 5px 18px rgba(0, 0, 0, .08);
                  }
                  /* IMAGEN */
                  
                  .sl img {
                      width: 100%;
                      height: 100%;
                      object-fit: cover;
                      display: block;
                      transition: transform .5s ease;
                  }
                  /* Solo la segunda imagen */
                  
                  .sl:nth-child(2) img {
                      object-position: center 5%;
                  }
                  /* ligero zoom al pasar el mouse */
                  
                  .sl:hover img {
                      transform: scale(1.025);
                  }
                  /* DEGRADADO MUY SUAVE */
                  
                  .sl::after {
                      content: "";
                      position: absolute;
                      left: 0;
                      right: 0;
                      bottom: 0;
                      height: 42%;
                      background: linear-gradient( to top, rgba(0, 0, 0, .62), rgba(0, 0, 0, .20), transparent);
                      pointer-events: none;
                  }
                  /* TEXTO */
                  
                  .sl .cap {
                      position: absolute;
                      z-index: 2;
                      left: 0;
                      right: 0;
                      bottom: 0;
                      padding: 55px 20px 18px;
                      color: #fff;
                      font-size: 14px;
                      font-weight: 600;
                      line-height: 1.45;
                      background: linear-gradient(transparent, rgba(0, 0, 0, .78));
                      text-shadow: 0 2px 8px rgba(0, 0, 0, .7), 0 4px 18px rgba(0, 0, 0, 0.5);
                  }
                  
                  .sl .cap b {
                      display: block;
                      font-size: 20px;
                      font-weight: 800;
                      margin-bottom: 3px;
                  }
                  /* TEXTO ESPECIAL */
                  
                  .sl.tx {
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      text-align: center;
                      padding: 24px;
                      color: #fff;
                      background: linear-gradient( 135deg, #2a2a2a, #4a2515);
                  }
                  
                  .sl.tx.pay {
                      background: linear-gradient( 135deg, #222, #3a2419);
                  }
                  
                  .sl.tx h3 {
                      font-size: clamp(22px, 4.4vw, 34px);
                      font-weight: 800;
                      line-height: 1.15;
                  }
                  
                  .sl.tx p {
                      margin-top: 10px;
                      font-size: 15px;
                      line-height: 1.5;
                      opacity: .95;
                  }
                  
                  .sl.tx .big {
                      display: inline-block;
                      background: #fff;
                      color: var(--acc);
                      border-radius: 12px;
                      padding: 3px 11px;
                      margin: 0 2px;
                  }
                  /* BOTONES */
                  
                  .nx {
                      position: absolute;
                      top: 50%;
                      transform: translateY(-50%);
                      width: 38px;
                      height: 38px;
                      border-radius: 50%;
                      background: rgba(255, 255, 255, .92);
                      color: #222;
                      font-size: 22px;
                      line-height: 1;
                      display: none;
                      box-shadow: 0 3px 12px rgba(0, 0, 0, .15);
                      transition: transform .2s ease, background .2s ease;
                  }
                  
                  .nx:hover {
                      background: #fff;
                      transform: translateY(-50%) scale(1.06);
                  }
                  
                  .nx.p {
                      left: 12px;
                  }
                  
                  .nx.n {
                      right: 12px;
                  }
                  
                  @media(min-width:700px) {
                      .nx {
                          display: block;
                      }
                  }
                  /* INDICADORES */
                  
                  .dots {
                      display: flex;
                      justify-content: center;
                      align-items: center;
                      gap: 6px;
                      margin-top: 10px;
                  }
                  
                  .dots button {
                      width: 7px;
                      height: 7px;
                      border-radius: 50%;
                      background: #c8c8cc;
                      padding: 0;
                      transition: width .25s ease, background .25s ease;
                  }
                  
                  .dots button.on {
                      width: 20px;
                      border-radius: 5px;
                      background: #333;
                  }
                  /* MÓVIL */
                  
                  @media(max-width:600px) {
                      .car {
                          margin-top: 14px;
                      }
                      .sl {
                          height: 235px;
                          border-radius: 18px;
                      }
                      .sl .cap {
                          padding: 48px 15px 15px;
                          font-size: 13px;
                      }
                      .sl .cap b {
                          font-size: 17px;
                      }
                      .track {
                          border-radius: 18px;
                      }
                  }
                  /* horario */
                  
                  .tags span.o {
                      background: #0a7d34
                  }
                  
                  .tags span.c {
                      background: #a51c1c
                  }
                  
                  .ostat {
                      display: inline-block;
                      margin: 10px 0 4px;
                      padding: 8px 14px;
                      border-radius: 16px;
                      font-size: 13px;
                      font-weight: 700
                  }
                  
                  .ostat.o {
                      background: #eaf7ee;
                      color: #027a2e
                  }
                  
                  .ostat.c {
                      background: #fdeeee;
                      color: #a51c1c
                  }
                  
                  #clNote {
                      display: none;
                      background: #fdeeee;
                      color: #a51c1c;
                      border-radius: 14px;
                      padding: 10px 12px;
                      font-size: 13px;
                      font-weight: 600;
                      margin-top: 10px
                  }
                  /* contacto oscuro */
                  
                  .dark {
                      margin-top: 20px;
                      background: linear-gradient(135deg, #171212, #2c1810);
                      color: #fff;
                      border-radius: 28px;
                      padding: 34px 20px;
                      text-align: center
                  }
                  
                  .dark .mo {
                      width: 68px;
                      height: 68px;
                      border-radius: 50%;
                      background: #d92b2b;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      font-size: 30px;
                      margin: 0 auto 14px
                  }
                  
                  .dark h2 {
                      font-size: clamp(24px, 5vw, 34px);
                      font-weight: 800
                  }
                  
                  .dark h2 em {
                      font-style: normal;
                      color: #ff7a2b
                  }
                  
                  .dark>p {
                      font-size: 14.5px;
                      opacity: .85;
                      line-height: 1.6;
                      max-width: 52ch;
                      margin: 10px auto 20px
                  }
                  
                  .pl a,
                  .so a {
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      gap: 8px;
                      height: 52px;
                      border-radius: 12px;
                      font-weight: 800;
                      font-size: 15px;
                      color: #fff;
                      text-decoration: none
                  }
                  
                  .pl .u {
                      background: #06c167
                  }
                  
                  .pl .d {
                      background: #ff7a00
                  }
                  
                  .pl .r {
                      background: #ff441f
                  }
                  
                  .dark .lbl {
                      font-size: 13px;
                      opacity: .75;
                      margin: 22px 0 10px
                  }
                  
                  .info2 {
                      display: grid;
                      gap: 12px;
                      margin-top: 26px;
                      text-align: left
                  }
                  
                  @media(min-width:700px) {
                      .info2 {
                          grid-template-columns: 1fr 1fr
                      }
                  }
                  
                  .box {
                      background: rgba(255, 255, 255, .07);
                      border: 1px solid rgba(255, 255, 255, .12);
                      border-radius: 18px;
                      padding: 16px 18px
                  }
                  
                  .box h3 {
                      font-size: 15px;
                      margin-bottom: 8px
                  }
                  
                  .box p {
                      font-size: 13.5px;
                      line-height: 1.7;
                      opacity: .9
                  }
                  
                  .pay {
                      display: flex;
                      flex-wrap: wrap;
                      gap: 8px
                  }
                  
                  .pay span {
                      background: rgba(255, 255, 255, .12);
                      border-radius: 14px;
                      padding: 7px 13px;
                      font-size: 13px;
                      font-weight: 600
                  }
                  
                  #dopen {
                      font-weight: 700;
                      margin-top: 8px;
                      font-size: 13.5px
                  }
                  /* stats row estilo app de delivery */
                  
                  .stats {
                      display: grid;
                      grid-template-columns: repeat(4, 1fr);
                      gap: 8px;
                      margin-top: 12px
                  }
                  
                  .stat2 {
                      background: #fff;
                      border-radius: 14px;
                      padding: 10px 6px;
                      text-align: center;
                      box-shadow: 0 1px 2px rgba(0, 0, 0, .05)
                  }
                  
                  .stat2 b {
                      display: block;
                      font-size: 10.5px;
                      color: var(--mut);
                      font-weight: 700;
                      letter-spacing: .03em;
                      text-transform: uppercase;
                      margin-bottom: 4px
                  }
                  
                  .stat2 span {
                      font-size: 13.5px;
                      font-weight: 800;
                      color: var(--ink)
                  }
                  
                  .stat2 span.o {
                      color: #0a7d34
                  }
                  
                  .stat2 span.c {
                      color: #a51c1c
                  }
                  
                  .stat2.click {
                      cursor: pointer
                  }
                  
                  @media(max-width:480px) {
                      .stats {
                          grid-template-columns: repeat(2, 1fr)
                      }
                      .stat2 span {
                          font-size: 12.5px
                      }
                  }
                  /* tarjetas ícono estilo app (fuera de zona) */
                  
                  .icards {
                      display: grid;
                      gap: 10px;
                      text-align: left;
                      margin: 14px 0
                  }
                  
                  .icard {
                      display: flex;
                      gap: 12px;
                      background: #f7f7f9;
                      border-radius: 16px;
                      padding: 14px
                  }
                  
                  .icard .em {
                      width: 42px;
                      height: 42px;
                      border-radius: 12px;
                      background: #fff;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      font-size: 19px;
                      flex: none;
                      box-shadow: 0 1px 2px rgba(0, 0, 0, .08)
                  }
                  
                  .icard h4 {
                      font-size: 14px;
                      font-weight: 800
                  }
                  
                  .icard p {
                      font-size: 12.5px;
                      color: var(--mut);
                      margin-top: 2px;
                      line-height: 1.4
                  }
                  /* modal horario semanal */
                  
                  #schedm {
                      position: fixed;
                      inset: 0;
                      background: rgba(0, 0, 0, .55);
                      display: none;
                      align-items: center;
                      justify-content: center;
                      padding: 16px;
                      z-index: 110
                  }
                  
                  #schedm.on {
                      display: flex
                  }
                  
                  .schbox {
                      background: #fff;
                      border-radius: 26px;
                      padding: 22px;
                      width: 100%;
                      max-width: 420px;
                      max-height: 90vh;
                      overflow: auto
                  }
                  
                  .schh {
                      display: flex;
                      align-items: center;
                      gap: 12px
                  }
                  
                  .schh img {
                      width: 44px;
                      height: 44px;
                      border-radius: 12px;
                      object-fit: cover
                  }
                  
                  .schh small {
                      display: block;
                      font-size: 11px;
                      color: var(--mut);
                      font-weight: 700;
                      letter-spacing: .03em;
                      text-transform: uppercase
                  }
                  
                  .schh strong {
                      font-size: 16px
                  }
                  
                  .schclose {
                      margin-left: auto;
                      width: 32px;
                      height: 32px;
                      border-radius: 50%;
                      background: #efeff2;
                      font-size: 15px
                  }
                  
                  .schbanner {
                      margin-top: 16px;
                      border-radius: 14px;
                      padding: 12px 14px;
                      font-size: 13.5px;
                      font-weight: 700;
                      display: flex;
                      align-items: center;
                      gap: 8px
                  }
                  
                  .schbanner.o {
                      background: #eaf7ee;
                      color: #027a2e
                  }
                  
                  .schbanner.c {
                      background: #fdeeee;
                      color: #a51c1c
                  }
                  
                  .schbanner i {
                      width: 8px;
                      height: 8px;
                      border-radius: 50%;
                      background: currentColor
                  }
                  
                  .schday {
                      display: flex;
                      justify-content: space-between;
                      align-items: center;
                      padding: 12px 4px;
                      border-bottom: 1px solid var(--line);
                      font-size: 14px
                  }
                  
                  .schday.today {
                      background: #fff9f2;
                      border-radius: 10px;
                      padding-left: 10px;
                      padding-right: 10px;
                      font-weight: 800
                  }
                  
                  .schday .hoy {
                      background: var(--ink);
                      color: #fff;
                      font-size: 10px;
                      font-weight: 800;
                      border-radius: 8px;
                      padding: 2px 7px;
                      margin-left: 6px
                  }
                  
                  .schdone {
                      width: 100%;
                      height: 48px;
                      border-radius: 24px;
                      background: var(--ink);
                      color: #fff;
                      font-weight: 800;
                      font-size: 14px;
                      margin-top: 14px
                  }
                  /* Contenedor del texto */
                  
                  .promo-central {
                      position: absolute;
                      z-index: 2;
                      left: 50%;
                      top: 50%;
                      transform: translate(-50%, -50%);
                      width: min(90%, 650px);
                      padding: 22px 30px;
                      text-align: center;
                      display: flex;
                      flex-direction: column;
                      align-items: center;
                      justify-content: center;
                      color: #fff;
                      /* Fondo negro */
                      background: rgba(0, 0, 0, 0.37);
                      /* Bordes */
                      border-radius: 16px;
                      /* Borde sutil */
                      border: 1px solid rgba(255, 255, 255, .18);
                      /* Sombra */
                      box-shadow: 0 10px 35px rgba(0, 0, 0, .55);
                      text-shadow: 0 2px 8px rgba(0, 0, 0, .7), 0 4px 18px rgba(0, 0, 0, .5);
                      box-sizing: border-box;
                  }
                  /* Título */
                  
                  .promo-central b {
                      font-size: clamp(15px, 3vw, 28px);
                      font-weight: 500;
                      letter-spacing: 1px;
                      margin-bottom: 8px;
                  }
                  /* 5 TACOS GRATIS */
                  
                  .promo-central .big {
                      font-size: clamp(15px, 6vw, 38px);
                      font-weight: 1000;
                      color: #fff;
                      line-height: 1;
                      margin: 8px 0 12px;
                  }
                  /* Texto secundario */
                  
                  .promo-central span:not(.big) {
                      font-size: clamp(15px, 2vw, 21px);
                      font-weight: 700;
                  }
                  /* Fecha */
                  
                  .promo-central small {
                      margin-top: 12px;
                      padding: 7px 14px;
                      border-radius: 30px;
                      background: rgba(0, 0, 0, .55);
                      font-size: 13px;
                      font-weight: 700;
                      backdrop-filter: blur(5px);
                  }
                  /* =================================
MÓVIL
================================= */
                  
                  @media (max-width: 600px) {
                      .promo-central {
                          width: 92%;
                      }
                      .promo-central b {
                          font-size: 17px;
                      }
                      .promo-central .big {
                          font-size: 38px;
                      }
                      .promo-central span:not(.big) {
                          font-size: 14px;
                      }
                      .promo-central small {
                          font-size: 11px;
                      }
                  }
                  /* =========================================
PLATAFORMAS - DISEÑO PROFESIONAL
========================================= */
                  
                  .pl {
                      display: grid;
                      grid-template-columns: repeat(3, 1fr);
                      gap: 16px;
                      width: min(100%, 900px);
                      margin: 25px auto 35px;
                  }
                  
                  .platform-card {
                      position: relative;
                      display: flex;
                      align-items: center;
                      gap: 14px;
                      min-height: 78px;
                      padding: 13px 16px;
                      border-radius: 18px;
                      color: #fff;
                      text-decoration: none;
                      background: rgba(255, 255, 255, .07);
                      border: 1px solid rgba(255, 255, 255, .13);
                      box-shadow: 0 8px 25px rgba(0, 0, 0, .18);
                      overflow: hidden;
                      transition: transform .28s ease, background .28s ease, border-color .28s ease, box-shadow .28s ease;
                  }
                  /* Brillo al pasar el mouse */
                  
                  .platform-card::before {
                      content: "";
                      position: absolute;
                      inset: 0;
                      background: linear-gradient( 120deg, transparent 20%, rgba(255, 255, 255, .08), transparent 80%);
                      transform: translateX(-100%);
                      transition: transform .5s ease;
                      pointer-events: none;
                  }
                  
                  .platform-card:hover::before {
                      transform: translateX(100%);
                  }
                  /* Hover general */
                  
                  .platform-card:hover {
                      transform: translateY(-5px);
                      background: rgba(255, 255, 255, .11);
                      box-shadow: 0 14px 35px rgba(0, 0, 0, .32);
                  }
                  /* =========================================
ICONO
========================================= */
                  
                  .platform-card>i:first-child {
                      width: 52px;
                      height: 52px;
                      flex: 0 0 52px;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      border-radius: 15px;
                      font-size: 25px;
                      background: rgba(255, 255, 255, .08);
                      transition: transform .3s ease, background .3s ease, color .3s ease;
                  }
                  
                  .platform-card:hover>i:first-child {
                      transform: scale(1.1) rotate(-4deg);
                  }
                  /* =========================================
TEXTO
========================================= */
                  
                  .platform-card>span {
                      display: flex;
                      flex-direction: column;
                      gap: 4px;
                      text-align: left;
                  }
                  
                  .platform-card strong {
                      font-size: 16px;
                      font-weight: 800;
                      letter-spacing: .2px;
                  }
                  
                  .platform-card small {
                      font-size: 12px;
                      opacity: .58;
                      font-weight: 500;
                  }
                  /* =========================================
FLECHA
========================================= */
                  
                  .platform-card>i:last-child {
                      margin-left: auto;
                      font-size: 13px;
                      opacity: .4;
                      transition: transform .3s ease, opacity .3s ease;
                  }
                  
                  .platform-card:hover>i:last-child {
                      opacity: 1;
                      transform: translateX(5px);
                  }
                  /* =========================================
COLORES
========================================= */
                  /* Uber Eats */
                  
                  .platform-card.uber {
                      --brand: #06c167;
                  }
                  
                  .platform-card.uber>i:first-child {
                      color: #06c167;
                      background: rgba(6, 193, 103, .12);
                  }
                  
                  .platform-card.uber:hover {
                      border-color: rgba(6, 193, 103, .45);
                  }
                  /* DiDi Food */
                  
                  .platform-card.didi {
                      --brand: #ff7a00;
                  }
                  
                  .platform-card.didi>i:first-child {
                      color: #ff7a00;
                      background: rgba(255, 122, 0, .12);
                  }
                  
                  .platform-card.didi:hover {
                      border-color: rgba(255, 122, 0, .45);
                  }
                  /* Rappi */
                  
                  .platform-card.rappi {
                      --brand: #ff441f;
                  }
                  
                  .platform-card.rappi>i:first-child {
                      color: #ff441f;
                      background: rgba(255, 68, 31, .12);
                  }
                  
                  .platform-card.rappi:hover {
                      border-color: rgba(255, 68, 31, .45);
                  }
                  /* =========================================
HOVER DEL ICONO
========================================= */
                  
                  .platform-card.uber:hover>i:first-child {
                      color: #fff;
                      background: #06c167;
                  }
                  
                  .platform-card.didi:hover>i:first-child {
                      color: #fff;
                      background: #ff7a00;
                  }
                  
                  .platform-card.rappi:hover>i:first-child {
                      color: #fff;
                      background: #ff441f;
                  }
                  /* =========================================
MÓVIL
========================================= */
                  
                  @media (max-width: 750px) {
                      .pl {
                          grid-template-columns: 1fr;
                          width: min(100%, 480px);
                      }
                      .platform-card {
                          min-height: 72px;
                      }
                  }
                  
                  @media (max-width: 420px) {
                      .platform-card {
                          padding: 11px 13px;
                          border-radius: 15px;
                      }
                      .platform-card>i:first-child {
                          width: 48px;
                          height: 48px;
                          flex-basis: 48px;
                          font-size: 22px;
                      }
                      .platform-card strong {
                          font-size: 15px;
                      }
                  }
                  
                  .social-icons {
                      display: flex;
                      justify-content: center;
                      align-items: center;
                      gap: 12px;
                      margin: 20px 0;
                  }
                  
                  .icon-btn {
                      width: 50px;
                      height: 50px;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      border-radius: 50%;
                      background: rgba(255, 255, 255, .08);
                      border: 1px solid rgba(255, 255, 255, .15);
                      text-decoration: none;
                      font-size: 21px;
                      transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
                  }
                  /* WhatsApp */
                  
                  .icon-btn.whatsapp {
                      color: #25D366;
                  }
                  /* Facebook */
                  
                  .icon-btn.facebook {
                      color: #1877F2;
                  }
                  /* Instagram */
                  
                  .icon-btn.instagram {
                      color: #E4405F;
                  }
                  /* TikTok */
                  
                  .icon-btn.tiktok {
                      color: #fff;
                  }
                  /* Teléfono */
                  
                  .icon-btn.phone {
                      color: #4CAF50;
                  }
                  /* ========
HOVER
======= */
                  
                  .icon-btn:hover {
                      transform: translateY(-5px) scale(1.08);
                      background: currentColor;
                      box-shadow: 0 8px 20px rgba(0, 0, 0, .35);
                  }
                  
                  .icon-btn:hover i {
                      color: #fff;
                  }
                  /* ========= BOTÓN FLOTANTE INSTALAR ========= */
                  
                  .shortcut-box {
                      position: fixed;
                      right: 22px;
                      bottom: 22px;
                      z-index: 9999;
                      animation: shortcutIn .5s ease;
                  }
                  /* Botón principal */
                  
                  .shortcut-btn {
                      display: flex;
                      align-items: center;
                      gap: 12px;
                      min-width: 310px;
                      padding: 10px 14px 10px 10px;
                      border: 1px solid rgba(230, 58, 0, .5);
                      border-radius: 18px;
                      background: rgba(17, 17, 17, .96);
                      color: #fff;
                      cursor: pointer;
                      box-shadow: 0 12px 35px rgba(0, 0, 0, .35), 0 0 0 1px rgba(255, 255, 255, .04);
                      backdrop-filter: blur(12px);
                      transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
                  }
                  
                  .shortcut-btn:hover {
                      transform: translateY(-4px);
                      border-color: #e63a00;
                      box-shadow: 0 16px 40px rgba(0, 0, 0, .45), 0 0 25px rgba(230, 58, 0, .20);
                  }
                  /* Icono */
                  
                  .shortcut-icon {
                      width: 48px;
                      height: 48px;
                      flex-shrink: 0;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      border-radius: 14px;
                      background: linear-gradient( 135deg, #e63a00, #ff641f);
                      color: #fff;
                      font-size: 20px;
                      box-shadow: 0 6px 18px rgba(230, 58, 0, .35);
                  }
                  
                  .shortcut-icon i {
                      animation: downloadPulse 2s infinite;
                  }
                  /* Texto */
                  
                  .shortcut-text {
                      display: flex;
                      flex-direction: column;
                      text-align: left;
                      line-height: 1.25;
                      flex: 1;
                  }
                  
                  .shortcut-text strong {
                      font-size: 14px;
                      font-weight: 800;
                      color: #fff;
                  }
                  
                  .shortcut-text small {
                      margin-top: 4px;
                      font-size: 11px;
                      color: #aaa;
                  }
                  /* Flecha */
                  
                  .shortcut-arrow {
                      width: 32px;
                      height: 32px;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      border-radius: 50%;
                      background: rgba(255, 255, 255, .08);
                      color: #fff;
                      font-size: 12px;
                      transition: .25s ease;
                  }
                  
                  .shortcut-btn:hover .shortcut-arrow {
                      background: #e63a00;
                      transform: translateX(3px);
                  }
                  /* Botón cerrar */
                  
                  .shortcut-close {
                      position: absolute;
                      right: -7px;
                      top: -7px;
                      width: 24px;
                      height: 24px;
                      border: 2px solid #111;
                      border-radius: 50%;
                      background: #fff;
                      color: #222;
                      cursor: pointer;
                      display: flex;
                      align-items: center;
                      justify-content: center;
                      font-size: 10px;
                      z-index: 2;
                      box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
                      transition: .2s ease;
                  }
                  
                  .shortcut-close:hover {
                      background: #e63a00;
                      color: #fff;
                      transform: rotate(90deg);
                  }
                  /* Animación entrada */
                  
                  @keyframes shortcutIn {
                      from {
                          opacity: 0;
                          transform: translateY(30px) scale(.95);
                      }
                      to {
                          opacity: 1;
                          transform: translateY(0) scale(1);
                      }
                  }
                  /* Animación del icono */
                  
                  @keyframes downloadPulse {
                      0%,
                      100% {
                          transform: translateY(0);
                      }
                      50% {
                          transform: translateY(3px);
                      }
                  }
                  /* Móvil */
                  
                  @media (max-width: 600px) {
                      .shortcut-box {
                          right: 12px;
                          left: 12px;
                          bottom: 14px;
                      }
                      .shortcut-btn {
                          width: 100%;
                          min-width: 0;
                      }
                      .shortcut-text strong {
                          font-size: 13px;
                      }
                      .shortcut-text small {
                          font-size: 10px;
                      }
                  }

                  .developer-credit {
                    margin-top: 10px;
                    font-size: 0.85rem;
                    opacity: 0.75;
                }

                .developer-credit a {
                    color: #4f8cff;
                    text-decoration: none;
                    font-weight: 600;
                    transition: 0.3s ease;
                }

                .developer-credit a:hover {
                    color: #343434;
                    text-decoration: underline;
                }