/* ============================================================================
   Web CopyHome — estilos
   Montserrat, gris #4A3F45, los 4 colores del logo como acentos.
   ============================================================================ */
:root{
  --gris:#4A3F45; --gris2:#6E636A; --gris3:#B9B0B4;
  --fondo:#F7F5F6; --blanco:#FFFFFF; --linea:#E6E0E3; --linea2:#F0EBED; --suave:#E9E3E6;
  --celeste:#1696B9; --verde:#16966B; --naranja:#E9A22A; --magenta:#C8317C; --magenta2:#B52A6F; --azul:#2D6FB7;
  --ok-bg:#E3F3E8; --ok-fg:#1E6B38; --low-bg:#FDF0D6; --low-fg:#8A5A05; --none-bg:#EEE9EB; --none-fg:#6E636A; --ask-bg:#DCEBF8; --ask-fg:#1C4F85;
  --radio:24px; --ancho:1240px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fondo);color:var(--gris);font-family:'Montserrat',system-ui,sans-serif;font-size:16px;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--azul);outline-offset:3px}
[hidden]{display:none!important}
.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wrap{max-width:var(--ancho);margin:0 auto;padding-inline:32px}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
h1{font-size:48px;letter-spacing:-.035em}
h2{font-size:40px}
h3{font-size:26px}
p{margin:0}
.muted{color:var(--gris2)}
.num{font-variant-numeric:tabular-nums}

/* Botones y enlaces */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 28px;border-radius:999px;border:0;font-weight:700;font-size:16px;background:var(--gris);color:#fff;transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,background-color .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px -14px rgba(74,63,69,.55)}
.btn:active{transform:translateY(0) scale(.98);box-shadow:none;transition-duration:.08s}
.btn-dark:hover{background:#36292F}
.btn-primary{background:var(--magenta)}.btn-primary:hover{background:var(--magenta2)}
.btn-amber{background:var(--naranja);color:var(--gris)}.btn-amber:hover{background:#D9931F}
.btn-outline{background:transparent;border:2px solid var(--gris);color:var(--gris)}
.btn-outline.light{border-color:#fff;color:#fff}
.btn-sm{height:44px;padding:0 20px;font-size:14px}
.btn[disabled]{opacity:.45;pointer-events:none}
.lnk{position:relative;display:inline-block;font-weight:700}
.lnk::after{content:"";position:absolute;left:0;bottom:-3px;width:100%;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.lnk:hover::after{transform:scaleX(1)}

/* Cabecera */
.cab{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.cab .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:14px 36px;padding-block:18px}
.logo{display:block;width:168px;flex-shrink:0}
.logo img{width:100%;height:auto}
.buscador{flex:1 1 320px;min-width:0;display:flex;align-items:center;gap:12px;background:var(--fondo);border:1px solid var(--linea);border-radius:999px;padding:0 20px;height:48px;transition:box-shadow .25s,border-color .25s,background-color .25s}
.buscador:focus-within{background:#fff;border-color:var(--gris);box-shadow:0 0 0 4px rgba(74,63,69,.08)}
.buscador input{flex:1;min-width:0;border:0;background:transparent;font-size:15px;outline:none}
.nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}
.nav .carrito{height:42px;padding:0 18px;font-size:14px}
.nav .cuenta{display:inline-flex;align-items:center;gap:8px}
.menu{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;border:1.5px solid var(--linea);background:transparent}

/* Secciones */
main{display:flex;flex-direction:column;gap:88px;padding-block:36px 96px}
.sec-cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;margin-bottom:36px}
.migas{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--gris2);margin-bottom:28px}
.migas .actual{color:var(--gris)}

/* Hero */
.hero{display:flex;flex-wrap:wrap;border-radius:30px;overflow:hidden;background:#fff;border:1px solid var(--linea)}
.hero .texto{flex:1 1 440px;min-width:0;padding:72px 60px;display:flex;flex-direction:column;justify-content:center;gap:26px}
.hero h1{font-size:62px}
.hero .lead{font-size:19px;line-height:1.55;max-width:460px;color:var(--gris2)}
.hero .foto{flex:1 1 420px;min-width:0;min-height:560px;overflow:hidden}
.hero .foto img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.hero:hover .foto img{transform:scale(1.03)}
.hero.oscuro{background:var(--gris);color:var(--fondo)}
.hero.oscuro .lead{color:inherit;opacity:.9}
.hero.oscuro h2{font-size:46px}
.hero.oscuro .texto{padding:64px 60px}
.hero.oscuro .foto{min-height:480px}
.ceja{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--magenta)}
.ceja::before{content:"";width:28px;height:3px;background:currentColor;border-radius:2px}
.ceja.naranja{color:var(--naranja)}
.acciones{display:flex;flex-wrap:wrap;gap:14px}
.drop{display:flex;flex-direction:column;gap:14px;padding:24px;border:2px dashed rgba(255,255,255,.45);border-radius:20px;max-width:520px;transition:border-color .25s,background-color .25s}
.drop:hover{border-color:var(--naranja)}
.drop .fila{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.drop small{font-size:15px;opacity:.85}

/* Grillas de productos y rubros */
.grilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:28px 24px}
.grilla.rubros{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:32px 24px}
.card{display:flex;flex-direction:column;gap:12px;position:relative}
.card .info{display:flex;flex-direction:column;gap:3px}
.card .fila{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:2px}
.card .add{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:999px;border:1.5px solid var(--gris);background:#fff;color:var(--gris);font-size:13px;font-weight:700;transition:background-color .2s,color .2s,transform .2s,border-color .2s}
.card .add:hover{background:var(--gris);color:#fff;transform:translateY(-1px)}
.card .add.ok{background:var(--verde);border-color:var(--verde);color:#fff}
.card .add.off{border-color:var(--linea);color:var(--gris3);background:transparent;cursor:default}
.card .add svg{flex-shrink:0}
.card .add.cnt{padding:0;overflow:hidden;background:var(--gris);color:#fff;transform:none}
.card .add.cnt button{width:34px;height:100%;border:0;background:transparent;color:inherit;font-size:18px;font-weight:700;transition:background-color .15s}
.card .add.cnt button:hover{background:rgba(255,255,255,.15)}
.card .add.cnt output{min-width:26px;text-align:center;font-weight:800;font-size:14px}
.card .ph{position:relative;display:block;overflow:hidden;border-radius:18px;background:var(--suave);aspect-ratio:4/5}
.card.rubro .ph{aspect-ratio:4/3}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.sin-foto{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:16px;text-align:center;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gris2);background:linear-gradient(135deg,var(--suave),#F3EEF1)}
.sin-foto.t1{background:linear-gradient(135deg,#E3EEF4,#EEF4F7)}.sin-foto.t2{background:linear-gradient(135deg,#E3F0EA,#EEF5F1)}.sin-foto.t3{background:linear-gradient(135deg,#F7EEDD,#FAF4E9)}.sin-foto.t4{background:linear-gradient(135deg,#F5E3EC,#F9EEF3)}
.sin-foto::before{content:"";width:40px;height:4px;border-radius:2px;background:currentColor;opacity:.35;position:absolute;top:50%;left:50%;transform:translate(-50%,-22px)}
.card:hover .ph img{transform:scale(1.05)}
.card .ttl{font-weight:700;transition:color .2s}
.card:hover .ttl{color:var(--magenta)}
.card .marca{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gris2)}
.card .nombre{font-size:15px;line-height:1.3}
.card .precio{font-size:16px;font-weight:800}
.card.rubro .ttl{font-size:20px}
.card.apagado{opacity:.7}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;border:1.5px solid var(--linea);background:#fff;font-size:14px;font-weight:700;transition:background-color .2s,color .2s,border-color .2s,transform .2s}
.chip:hover{transform:translateY(-1px);border-color:var(--gris)}
.chip.on{background:var(--gris);color:#fff;border-color:var(--gris)}
.chip.sm{height:38px;padding:0 14px;font-size:13px}

/* Disponibilidad */
.pill{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;padding:7px 14px;border-radius:999px;white-space:nowrap}
.pill::before{content:"";width:8px;height:8px;border-radius:999px;background:currentColor;opacity:.9}
.pill.ok{background:var(--ok-bg);color:var(--ok-fg)}
.pill.low{background:var(--low-bg);color:var(--low-fg)}
.pill.none{background:var(--none-bg);color:var(--none-fg)}
.pill.ask{background:var(--ask-bg);color:var(--ask-fg)}
.card .pill{position:absolute;left:12px;top:12px;font-size:12px;padding:6px 10px}

/* Promesas */
.promesas{background:#fff;border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.promesas .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px 40px;padding-block:36px}
.promo{display:flex;gap:16px;align-items:flex-start}
.promo .ico{width:44px;height:44px;flex-shrink:0;border-radius:999px;background:var(--fondo);display:flex;align-items:center;justify-content:center;transition:background-color .3s,transform .3s cubic-bezier(.2,.8,.2,1)}
.promo .ico svg{transition:stroke .3s}
.promo .pt{font-size:17px;font-weight:700;display:block;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.promo .ps{font-size:14px;color:var(--gris2)}
.promo:hover .ico{transform:translateY(-3px)}
.promo:hover .ico svg{stroke:#fff}
.promo:hover .pt{transform:translateX(2px)}
.promo.c1:hover .ico{background:var(--celeste)}.promo.c2:hover .ico{background:var(--verde)}.promo.c3:hover .ico{background:var(--naranja)}.promo.c4:hover .ico{background:var(--magenta)}

/* Sucursales */
.sucs{display:flex;flex-wrap:wrap;gap:24px}
.suc{flex:1 1 420px;min-width:0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:36px;display:flex;flex-direction:column;gap:10px;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.suc:hover{transform:translateY(-4px);box-shadow:0 24px 40px -28px rgba(74,63,69,.45)}
.franja{display:flex;height:5px;width:64px;border-radius:3px;overflow:hidden}
.franja span{flex-grow:1}
.franja span:nth-child(1){background:var(--celeste)}.franja span:nth-child(2){background:var(--verde)}.franja span:nth-child(3){background:var(--naranja)}.franja span:nth-child(4){background:var(--magenta)}
.suc h3{margin-top:12px}
.suc .acc{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:12px;font-size:15px;font-weight:700}

/* Ficha de producto */
.ficha{display:flex;flex-wrap:wrap;gap:56px;align-items:flex-start}
.ficha .galeria{flex:1 1 480px;min-width:0}
.ficha .galeria .ph{aspect-ratio:4/5;border-radius:26px;overflow:hidden;background:var(--suave)}
.ficha .galeria img{width:100%;height:100%;object-fit:cover}
.miniaturas{display:flex;gap:12px;margin-top:14px}
.mini{width:92px;height:92px;padding:0;border-radius:14px;overflow:hidden;background:var(--suave);border:2px solid transparent;transition:border-color .2s,transform .2s}
.mini:hover{transform:translateY(-2px)}
.mini.on{border-color:var(--gris)}
.mini img{width:100%;height:100%;object-fit:cover}
.ficha .datos{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:26px}
.ficha h1{font-size:40px}
.ficha .codigo{font-size:14px;color:var(--gris2)}
.precio-grande{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.precio-grande b{font-size:38px;font-weight:800;letter-spacing:-.02em}
.caja{display:flex;flex-direction:column;gap:10px;padding:18px 20px;background:#fff;border:1px solid var(--linea);border-radius:18px}
.caja .tit{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gris2)}
.caja .pills{display:flex;flex-wrap:wrap;gap:10px}
.cantidad{display:inline-flex;align-items:center;border:1.5px solid var(--gris);border-radius:999px;height:54px;overflow:hidden}
.cantidad button{width:52px;height:100%;border:0;background:transparent;font-size:20px;font-weight:700;transition:background-color .15s}
.cantidad button:hover{background:var(--suave)}
.cantidad output{min-width:36px;text-align:center;font-weight:700}
.comprar{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.comprar .btn{flex:1 1 220px}
.aviso{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px 18px;border-radius:14px;font-size:14px;font-weight:600}
.aviso.ok{background:var(--ok-bg);color:var(--ok-fg)}
.desc{display:flex;flex-direction:column;gap:10px;padding-top:10px;border-top:1px solid var(--linea)}
.desc dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px 24px;font-size:14px;margin:0}
.desc dt{color:var(--gris2)}.desc dd{margin:0;font-weight:600}

/* Buscador: sugerencias mientras escribís */
.buscador{position:relative}
.sug{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:25;background:#fff;border:1px solid var(--linea);border-radius:22px;box-shadow:0 24px 48px -20px rgba(74,63,69,.35);padding:8px;display:flex;flex-direction:column;max-height:min(70vh,520px);overflow:auto}
.s-it{display:flex;align-items:center;gap:14px;padding:8px 10px;border-radius:14px;transition:background-color .15s}
.s-it:hover,.s-it.on{background:var(--fondo)}
.s-it.apagado{opacity:.65}
.s-ph{width:48px;height:48px;flex-shrink:0;border-radius:10px;overflow:hidden;background:var(--suave)}
.s-ph img,.s-ph .sin-foto{width:100%;height:100%;object-fit:cover}
.s-ph .sin-foto::before{display:none}
.s-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.s-tx b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-tx small{font-size:12px;color:var(--gris2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s-pr{font-size:14px;font-weight:700;white-space:nowrap}
.s-todo{display:block;margin-top:4px;padding:12px 10px;border-top:1px solid var(--linea2);font-size:14px;font-weight:700;color:var(--magenta);border-radius:0 0 14px 14px;transition:background-color .15s}
.s-todo:hover,.s-todo.on{background:var(--fondo)}

/* Catálogo: barra con Filtros + orden, panel desplegable, chips activos */
.resultados{min-width:0;display:flex;flex-direction:column;gap:32px}
.barra{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.f-btn{display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--linea);background:#fff;font-size:14px;font-weight:700;transition:border-color .2s,background-color .2s,color .2s,transform .2s}
.f-btn:hover{border-color:var(--gris);transform:translateY(-1px)}
.f-btn.on,.f-btn[aria-expanded="true"]{background:var(--gris);color:#fff;border-color:var(--gris)}
.chips.activos{flex:1 1 auto;gap:8px}
.chips.activos .chip{gap:8px;cursor:pointer}
.chips.activos .chip span{font-size:16px;line-height:1;opacity:.8}
.chips.activos .limpiar{border:0;background:transparent;padding:0 6px;font-size:13px;color:var(--gris2)}
.orden{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;margin-left:auto}
.orden select{height:44px;padding:0 14px;border:1.5px solid var(--linea);border-radius:999px;background:#fff;font-size:14px;font-weight:600;outline:none}
.f-fondo{position:fixed;inset:0;z-index:21;background:transparent}
.fpanel{position:absolute;left:0;top:calc(100% + 10px);z-index:22;width:min(380px,100%);background:#fff;border:1px solid var(--linea);border-radius:22px;box-shadow:0 28px 56px -24px rgba(74,63,69,.4);display:flex;flex-direction:column;max-height:min(72vh,640px)}
.f-cab{display:flex;align-items:center;justify-content:space-between;padding:18px 22px 14px;font-size:17px}
.f-x{width:36px;height:36px;border-radius:999px;border:0;background:var(--fondo);display:flex;align-items:center;justify-content:center;transition:background-color .2s}
.f-x:hover{background:var(--suave)}
.f-cuerpo{flex:1;min-height:0;overflow:auto;padding:4px 22px 18px;display:flex;flex-direction:column;gap:24px}
.f-cuerpo .grupo{display:flex;flex-direction:column;gap:12px}
.f-cuerpo .tit{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gris2)}
.f-precio{display:flex;align-items:center;gap:10px}
.f-precio input{flex:1;min-width:0;height:44px;padding:0 14px;border:1.5px solid var(--linea);border-radius:999px;background:var(--fondo);font-size:14px;font-weight:600;outline:none;-moz-appearance:textfield}
.f-precio input::-webkit-outer-spin-button,.f-precio input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.f-precio input:focus{border-color:var(--gris);background:#fff}
.f-lista{display:flex;flex-direction:column;gap:10px;max-height:220px;overflow:auto;padding-right:4px}
.f-pie{display:flex;justify-content:space-between;gap:12px;padding:14px 22px 18px;border-top:1px solid var(--linea2)}
.check{display:flex;align-items:center;gap:12px;border:0;background:transparent;padding:0;font-size:15px;font-weight:600;text-align:left}
.check span{flex:1;min-width:0}
.check small{font-size:13px}
.check i{width:22px;height:22px;border-radius:7px;border:2px solid var(--gris);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color .2s}
.check i svg{opacity:0;transition:opacity .2s}
.check.on i{background:var(--gris)}.check.on i svg{opacity:1}
.caja.ayuda{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:6px 10px;font-size:14px}
.vacio{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:48px 32px;background:#fff;border:1px solid var(--linea);border-radius:var(--radio)}
.mas{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;padding-top:8px;font-size:14px;color:var(--gris2)}
@media (min-width:1100px){.ficha .datos{position:sticky;top:110px}}

/* Carrito */
.carrito-pag{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.carrito-pag .lista{flex:1 1 560px;min-width:0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:8px 28px}
.item{display:flex;gap:18px;align-items:center;padding:20px 0;border-bottom:1px solid var(--linea2)}
.item .ph{width:84px;height:84px;flex-shrink:0;border-radius:14px;overflow:hidden;background:var(--suave)}
.item .ph img{width:100%;height:100%;object-fit:cover}
.item .info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.item .info b{font-size:16px}
.item .quitar{align-self:flex-start;border:0;background:transparent;padding:0;font-size:13px;font-weight:600;color:var(--gris2);text-decoration:underline;text-underline-offset:3px;transition:color .2s}
.item .quitar:hover{color:var(--magenta)}
.item .cantidad{height:44px;border-color:var(--linea)}
.item .cantidad button{width:42px;font-size:18px}
.item .total{width:96px;text-align:right;font-weight:700;white-space:nowrap}
.resumen{flex:1 1 320px;min-width:0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:28px;display:flex;flex-direction:column;gap:16px}
.resumen .fila{display:flex;justify-content:space-between;font-size:15px}
.resumen .tot{display:flex;justify-content:space-between;align-items:baseline;padding-top:14px;border-top:1px solid var(--linea)}
.resumen .tot b{font-size:32px;font-weight:800;letter-spacing:-.02em}

/* Cuenta y finalizar compra */
.pill.ultima{background:var(--ask-bg);color:var(--ask-fg)}
.btn.off{opacity:.45;pointer-events:none}
.campo{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:var(--gris2)}
.campo input{height:48px;padding:0 16px;border:1.5px solid var(--linea);border-radius:14px;background:var(--fondo);font-size:15px;font-weight:500;color:var(--gris);outline:none;transition:border-color .2s,background-color .2s}
.campo input:focus{border-color:var(--gris);background:#fff}
.campo input[disabled]{opacity:.7}
.entrar .o{display:flex;align-items:center;gap:12px;color:var(--gris2);font-size:13px}
.entrar .o::before,.entrar .o::after{content:"";flex:1;height:1px;background:var(--linea)}
.cuenta-pag{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.cuenta-pag .col{flex:1 1 320px;min-width:0}
.cuenta-pag .col.ancha{flex:2 1 460px}
.pedidos{display:flex;flex-direction:column;gap:16px}
.pedido{background:#fff;border:1px solid var(--linea);border-radius:20px;padding:20px 22px;display:flex;flex-direction:column;gap:10px}
.pedido .cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;font-size:17px}
.pedido .lineas{display:flex;flex-direction:column;gap:6px;font-size:14px;padding:8px 0;border-top:1px solid var(--linea2);border-bottom:1px solid var(--linea2)}
.pedido .lineas div{display:flex;justify-content:space-between;gap:16px}
.pedido .tot{display:flex;justify-content:space-between;font-size:16px}
.fin{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.pasos{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:20px}
.paso{background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:26px 28px;display:flex;flex-direction:column;gap:16px}
.paso h2{font-size:22px;display:flex;align-items:center;gap:12px}
.paso h2 .n{width:30px;height:30px;border-radius:999px;background:var(--gris);color:#fff;font-size:14px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}
.opciones{display:flex;flex-direction:column;gap:10px}
.opcion{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1.5px solid var(--linea);border-radius:16px;cursor:pointer;transition:border-color .2s,background-color .2s}
.opcion:hover{border-color:var(--gris3)}
.opcion:has(input:checked){border-color:var(--gris);background:var(--fondo)}
.opcion input{margin-top:4px;accent-color:var(--gris);width:18px;height:18px;flex-shrink:0}
.opcion span{display:flex;flex-direction:column;gap:3px;font-size:15px}
.opcion small{font-size:13px;color:var(--gris2);line-height:1.4}
.dir{display:flex;flex-direction:column;gap:12px;padding-top:4px}
.fin-items{display:flex;flex-direction:column;gap:10px;max-height:320px;overflow:auto;padding-right:4px}
.fin-item{display:flex;align-items:center;gap:12px;font-size:14px}
.fin-item .ph{width:46px;height:46px;flex-shrink:0;border-radius:10px;overflow:hidden;background:var(--suave)}
.fin-item .ph img{width:100%;height:100%;object-fit:cover}
.fin-item .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.fin-item .tx b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fin-ok{display:flex;justify-content:center;padding:20px 0}
.fin-cerrada{background:var(--suave);border-radius:14px;padding:14px 16px;font-size:14px;line-height:1.5}
.pedido .pagar{margin-top:4px}
.fin .resumen{position:sticky;top:110px}
.fact{display:flex;flex-direction:column;gap:12px;padding-top:6px;border-top:1px solid var(--linea2);margin-top:4px}
.fact .tit{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gris2)}
.campo select{height:48px;padding:0 16px;border:1.5px solid var(--linea);border-radius:14px;background:var(--fondo);font-size:15px;font-weight:500;color:var(--gris);outline:none}
.check input[type=checkbox]{display:none}

/* Pie */
.pie{background:var(--gris);color:var(--fondo)}
.pie .franja-pie{display:flex;height:6px}
.pie .franja-pie span{flex-grow:1}
.pie .franja-pie span:nth-child(1){background:var(--celeste)}.pie .franja-pie span:nth-child(2){background:var(--verde)}.pie .franja-pie span:nth-child(3){background:var(--naranja)}.pie .franja-pie span:nth-child(4){background:var(--magenta)}
.pie .wrap{display:flex;flex-wrap:wrap;gap:40px 64px;padding-block:56px 40px}
.pie .col{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:10px;font-size:14px}
.pie .col.marca{flex-basis:260px;gap:14px}
.pie .col .tit{font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:12px;opacity:.7}
.pie .col a{align-self:flex-start}
.pie .nombre{font-size:28px;font-weight:700;letter-spacing:-.03em}

/* Asistente (botón) */
.agente{position:fixed;right:24px;bottom:24px;z-index:15;display:flex;align-items:center;gap:10px;border:0;background:var(--azul);color:#fff;font-size:15px;font-weight:700;padding:0 22px;height:52px;border-radius:999px;box-shadow:0 12px 28px -10px rgba(45,111,183,.7);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.agente:hover{transform:translateY(-3px);box-shadow:0 18px 34px -12px rgba(45,111,183,.75)}
.agente:active{transform:scale(.97)}

/* Toast */
.toast{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(20px);z-index:30;background:var(--gris);color:#fff;padding:12px 20px;border-radius:999px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;display:flex;gap:16px;align-items:center}
.toast.on{opacity:1;transform:translateX(-50%);pointer-events:auto}
.toast a{color:var(--naranja);font-weight:700}

/* Celular */
@media (max-width:720px){
  .wrap{padding-inline:16px}
  .cab .wrap{gap:12px 16px;padding-block:12px}
  .logo{width:132px}
  .buscador{order:3;flex-basis:100%}
  .nav{margin-left:auto;gap:12px}
  .nav>a:not(.carrito){display:none}
  .nav .carrito{padding:0 14px;height:40px;font-size:13px}
  .menu{display:flex}
  main{gap:56px;padding-block:20px 72px}
  h1,.hero h1,.ficha h1{font-size:34px}
  h2,.hero.oscuro h2{font-size:26px}
  .hero .texto,.hero.oscuro .texto{padding:32px 20px}
  .hero .foto,.hero.oscuro .foto{min-height:300px}
  .hero .lead{font-size:16px}
  .pie .wrap{padding-block:36px 28px}
  .agente{right:16px;bottom:16px;padding:0;width:52px;justify-content:center}
  .agente span{display:none}
  .menu-abierto .nav>a{display:flex}
  .menu-abierto .nav{flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;order:4;border-top:1px solid var(--linea);padding-top:8px}
  .menu-abierto .nav>a{padding:12px 4px;font-size:16px}
  .menu-abierto .nav .carrito{display:none}
  .sug{max-height:60vh;border-radius:18px;padding:6px}
  .s-tx b{white-space:normal;font-size:13px}
  .orden{margin-left:0;flex-basis:100%}
  .orden select{flex:1}
  .f-fondo{background:rgba(74,63,69,.45);backdrop-filter:blur(2px)}
  .fpanel{position:fixed;left:0;right:0;top:auto;bottom:0;width:auto;max-height:88vh;border-radius:24px 24px 0 0;border:0;padding-bottom:env(safe-area-inset-bottom);animation:subir .28s cubic-bezier(.2,.8,.2,1)}
  .f-lista{max-height:none}
  .f-pie .btn{flex:1}
  body.f-abierto{overflow:hidden}
  /* Destacados y rubros: una fila que se desliza con el dedo */
  .carrusel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:-16px;padding:4px 16px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .carrusel::-webkit-scrollbar{display:none}
  .carrusel>.card{flex:0 0 58%;scroll-snap-align:start}
  .carrusel.rubros>.card{flex-basis:66%}
  .carrusel .card .nombre{font-size:14px}
  .carrusel .card .add span{display:none}
  .carrusel .card .add{padding:0 11px}
  .card .add span{display:none}
  .card .add{padding:0 11px;height:34px}
  .fin .resumen{position:static}
  .paso{padding:20px 18px}
}
@keyframes subir{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

.pie .logo-pie{display:block;width:180px;max-width:60%;height:auto;margin-bottom:6px}

.suc .acc .ico{display:inline-flex;align-items:center;gap:7px}.suc .acc .ico svg{color:var(--magenta);width:18px;height:18px}
.tent{min-width:0;max-width:100%;flex:1 1 100%;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:26px 28px}
.tent-cab{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}.tent-cab h2{font-size:26px;margin:2px 0 4px}.tent-cab p{margin:0;font-size:14px}
.tent-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none}.tent-track::-webkit-scrollbar{display:none}
.tent-card{flex:0 0 172px;scroll-snap-align:start}.tent-card .ph{display:block;aspect-ratio:1;border-radius:16px;overflow:hidden;background:var(--suave)}.tent-card .ph img{width:100%;height:100%;object-fit:cover}
.tent-card .tit{font-size:14px;font-weight:600;line-height:1.3;color:inherit;text-decoration:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tent-card .precio{font-size:15px}
@media(max-width:720px){.tent{padding:20px 16px}.tent-cab h2{font-size:22px}.tent-card{flex-basis:148px}.tent-cab .btn{width:100%}}

/* Presupuesto de lista escolar */
.presu{display:flex;flex-direction:column;gap:20px;margin-top:8px}
.presu-cab{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}.presu-cab h2{font-size:30px;margin:2px 0 4px}.presu-cab p{margin:0;font-size:15px}
.presu-escuela{background:#fff;border:1px solid var(--linea);border-radius:18px;padding:16px 20px;display:flex;flex-direction:column;gap:10px;font-size:14px}.presu-escuela .campos{display:flex;gap:10px;flex-wrap:wrap}.presu-escuela input{flex:1 1 180px;height:44px;border:1.5px solid var(--linea);border-radius:12px;padding:0 14px;font:inherit}
.presu-cond{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-weight:700}.presu-cond .chips{display:flex;gap:8px;flex-wrap:wrap}.presu-cond .chips button{height:40px;padding:0 18px;border-radius:999px;border:1.5px solid var(--gris);background:#fff;font:inherit;font-weight:700;color:var(--gris)}.presu-cond .chips button[aria-pressed="true"]{background:var(--gris);color:#fff}
.presu-grid{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}.presu-lista{flex:1 1 560px;min-width:0;background:#fff;border:1px solid var(--linea);border-radius:var(--radio);padding:6px 24px}.presu-resumen{flex:1 1 300px;position:sticky;top:110px}
.pr{display:grid;grid-template-columns:28px 64px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--linea)}.pr:last-child{border-bottom:0}.pr.off{opacity:.5}
.pr .ph{width:64px;height:64px;border-radius:12px;overflow:hidden;background:var(--suave)}.pr .ph img{width:100%;height:100%;object-fit:cover}
.pr .tx{min-width:0;display:flex;flex-direction:column;gap:3px}.pr .tx b{font-size:15px;line-height:1.3}.pr .tx small{font-size:12.5px;color:var(--gris3)}.pr .tx .acc{display:flex;gap:14px;flex-wrap:wrap;margin-top:4px;font-size:13px;font-weight:700}.pr .tx .acc button{background:none;border:0;padding:0;font:inherit;font-weight:700;color:var(--magenta);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.pr .der{display:flex;flex-direction:column;align-items:flex-end;gap:8px}.pr .der .precio{font-weight:700;font-size:16px;white-space:nowrap}
.pr .cant{display:inline-flex;align-items:center;border:1.5px solid var(--linea);border-radius:999px;height:34px}.pr .cant button{width:32px;height:32px;border:0;background:none;font-size:18px;cursor:pointer}.pr .cant output{min-width:22px;text-align:center;font-weight:700;font-size:14px}
.pr .tick{width:22px;height:22px;accent-color:var(--magenta)}
.pr-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--suave);border-radius:999px;padding:3px 9px;color:var(--gris)}.pr-tag.m{background:#FBE6EE;color:#B3174F}
.pr-op{grid-column:1/-1;display:flex;gap:12px;overflow-x:auto;padding:4px 0 10px;scrollbar-width:none}.pr-op::-webkit-scrollbar{display:none}
.pr-op button{flex:0 0 150px;text-align:left;background:#fff;border:1.5px solid var(--linea);border-radius:14px;padding:10px;font:inherit;cursor:pointer;display:flex;flex-direction:column;gap:6px}.pr-op button.on{border-color:var(--magenta)}.pr-op button:hover{border-color:var(--gris)}
.pr-op .ph{width:100%;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--suave)}.pr-op .ph img{width:100%;height:100%;object-fit:cover}.pr-op .d{font-size:12.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.pr-op .p{font-weight:700;font-size:14px}
.presu-extra,.presu-no{background:#fff;border:1px solid var(--linea);border-radius:18px;padding:18px 22px;display:flex;flex-direction:column;gap:10px}.presu-no ul{margin:0;padding-left:20px;font-size:14px;color:var(--gris3);display:flex;flex-direction:column;gap:4px}
@media(max-width:720px){.presu-resumen{position:static}.pr{grid-template-columns:24px 54px 1fr;gap:10px}.pr .der{grid-column:2/-1;flex-direction:row;justify-content:space-between;align-items:center}.presu-lista{padding:4px 14px}}

.presu-wait{display:flex;justify-content:center;padding:20px 0}
.spin{width:52px;height:52px;border-radius:50%;border:5px solid var(--suave);border-top-color:var(--magenta);animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.carrito-pag .vaciar{padding:14px 0 10px;display:flex;justify-content:flex-end;font-size:13px}.carrito-pag .vaciar .lnk{background:none;border:0;padding:0;font:inherit;font-weight:700;cursor:pointer;color:var(--gris3)}.carrito-pag .vaciar .lnk.ask{color:var(--magenta)}
/* Carrito en celular: foto + nombre arriba, cantidad y precio en una fila abajo */
@media(max-width:720px){
  .carrito-pag .lista{padding:4px 16px}
  .item{display:grid;grid-template-columns:64px 1fr;grid-template-areas:"ph info" "ph abajo";column-gap:14px;row-gap:10px;align-items:start;padding:16px 0}
  .item .ph{grid-area:ph;width:64px;height:64px;border-radius:12px}
  .item .info{grid-area:info}
  .item .info b{font-size:15px;line-height:1.3}
  .item .cantidad{grid-area:abajo;justify-self:start;height:38px}
  .item .cantidad button{width:36px}
  .item .total{grid-area:abajo;justify-self:end;align-self:center;width:auto;font-size:16px}
}

.mt{display:inline-block;vertical-align:2px;font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border-radius:999px;padding:3px 8px;margin-left:4px;white-space:nowrap}
.mt.exacto{background:#E3F4EA;color:#0F6E46}.mt.similar{background:#FFF4D6;color:#8A5A00}.mt.reemplazo{background:#FDE7D8;color:#A4440F}.mt.no{background:var(--suave);color:var(--gris3)}.mt.elegido{background:#E6EEF8;color:#1F5C99}
.presu-cab p .mt{margin:0 4px 6px 0}
/* Listas: banco de listas revisadas (buscador por escuela y grado) */
.banco{gap:12px;margin-top:8px}
.banco input{height:46px;border:1.5px solid var(--linea);border-radius:12px;padding:0 14px;font:inherit;font-size:15px;background:#F7F5F6;outline:none}
.banco-res{display:flex;flex-direction:column;gap:12px}
.banco-esc{display:flex;flex-direction:column;gap:6px}
.banco-esc b{font-size:15px}
.banco-gr{display:flex;flex-wrap:wrap;gap:8px}
.banco-gr button{height:38px;padding:0 16px;border-radius:999px;border:1.5px solid #4A3F45;background:#fff;font:inherit;font-weight:700;font-size:14px;color:#4A3F45;cursor:pointer}
.banco-gr button:hover{background:#4A3F45;color:#fff}
.banco-gr small{font-weight:500;opacity:.7}
.mt.revisada{background:#E6F4EA;color:#1E6B34}
/* Envío: mapa con la dirección */
.mapa-envio{display:flex;flex-direction:column;gap:8px}
.mapa-envio .mapa{height:260px;border-radius:16px;overflow:hidden;border:1px solid var(--linea);background:#EEE9EC;z-index:0}
.mapa-envio p{margin:0;font-size:14px}
.pin-ch span{display:block;width:30px;height:30px;border-radius:50% 50% 50% 0;background:#C8317C;transform:rotate(-45deg);box-shadow:0 3px 8px rgba(0,0,0,.3);border:3px solid #fff}
.banco-gr .ok{color:#1E6B34;font-weight:800}.banco-gr button:hover .ok{color:#fff}
.presu-lista .pr-sec{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#C8317C;margin:18px 0 2px;padding-top:6px}.presu-lista .pr-sec:first-child{margin-top:10px}