/* Segprolatam — estilos compartidos */
:root{
  --bg:#f6f7f5;
  --surface:#ffffff;
  --ink:#15241c;
  --muted:#5b6a61;
  --line:#dfe4df;
  --green:#14402b;
  --green-ink:#0e2e1f;
  --yellow:#f6c21a;
  --yellow-ink:#1d1703;
  --blue:#1e6ee8;
  --wa:#1fa855;
  --shadow:0 10px 30px rgba(21,36,28,.12);
  --display:'Nunito Sans',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0f1613; --surface:#18221c; --ink:#e8eee9; --muted:#9db0a4; --line:#2a362f;
    --green:#1c5a3c; --green-ink:#0b1f15; --yellow:#f0c22e; --yellow-ink:#1d1703;
    --blue:#5b96f2; --wa:#2bbf63; --shadow:0 10px 30px rgba(0,0,0,.45);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0f1613; --surface:#18221c; --ink:#e8eee9; --muted:#9db0a4; --line:#2a362f;
  --green:#1c5a3c; --green-ink:#0b1f15; --yellow:#f0c22e; --yellow-ink:#1d1703;
  --blue:#5b96f2; --wa:#2bbf63; --shadow:0 10px 30px rgba(0,0,0,.45);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;margin:0;padding-top:env(safe-area-inset-top,0px)}
img{max-width:100%}
a{color:var(--blue)}
h1,h2,h3{font-family:var(--display);font-style:normal;font-weight:800;letter-spacing:1px;text-wrap:balance;line-height:1.12;margin:0}
button{font-family:var(--body)}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}

/* ---- top bar ---- */
.topbar{background:var(--green-ink);color:#e8eee9;font-size:13.5px;padding:7px 16px;display:flex;gap:6px 22px;flex-wrap:wrap;justify-content:center;align-items:center}
.topbar a{color:#f0c22e;text-decoration:none;font-weight:600}
.topbar span{display:inline-flex;align-items:center;gap:6px}
.topbar svg{flex:none}

/* ---- header ---- */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--surface);border-bottom:1px solid var(--line);padding:10px 16px;display:flex;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{width:52px;height:52px;border-radius:50%}
.brand b{font-family:'Chakra Petch',var(--display);font-style:italic;font-weight:700;font-size:23px;letter-spacing:.5px}
.brand b .pro{color:var(--yellow)}
.brand b .latam{color:var(--blue);font-family:'Poppins',var(--body);font-style:normal;font-size:13px;letter-spacing:3px;display:block;line-height:.9;font-weight:600}
nav.main{margin-left:auto;display:flex;gap:4px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
nav.main a{color:var(--ink);text-decoration:none;font-weight:600;font-size:15px;padding:8px 12px;border-radius:8px}
nav.main a:hover{background:var(--bg)}
nav.main a.active{background:var(--green);color:#fff}
.cartbtn{display:inline-flex;align-items:center;gap:8px;background:var(--green);color:#fff;border:none;border-radius:10px;padding:10px 16px;font-weight:600;font-size:13px;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer}
.cartbtn:hover{filter:brightness(1.1)}
.cartbtn .count{background:var(--yellow);color:var(--yellow-ink);border-radius:999px;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;padding:0 6px;font-variant-numeric:tabular-nums}

/* ---- hero (inicio) ---- */
.hero{background:linear-gradient(100deg,rgba(11,31,21,.93) 0%,rgba(14,46,31,.82) 45%,rgba(14,46,31,.35) 100%),url("img/hero.webp") center/cover no-repeat,var(--green-ink);color:#f2f6f2;position:relative;overflow:hidden}
.hero .inner{max-width:1100px;margin:0 auto;padding:56px 24px 64px;position:relative}
.hero .stripe{position:absolute;inset:auto 0 0 0;height:10px;background:linear-gradient(90deg,var(--yellow) 0 45%,var(--blue) 45% 72%,#fff 72% 100%)}
.hero h1{font-size:clamp(30px,5vw,50px);font-weight:900;color:#fff;max-width:16ch}
.hero h1 em{color:var(--yellow);font-style:normal}
.hero p{max-width:52ch;margin:16px 0 26px;font-size:17.5px;color:#cfe0d4}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:13px 22px;font-weight:600;font-size:14px;letter-spacing:1.2px;text-transform:uppercase;text-decoration:none;border:none;cursor:pointer;font-family:var(--body)}
.btn-y{background:var(--yellow);color:var(--yellow-ink)}
.btn-y:hover{filter:brightness(1.05)}
.btn-g{background:var(--green);color:#fff}
.btn-g:hover{filter:brightness(1.12)}
.btn-ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:#fff}
.hero .tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}
.hero .tags span{border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:5px 14px;font-size:13.5px;letter-spacing:.5px;text-transform:uppercase;color:#d9e6dd}

/* ---- page hero (subpáginas) ---- */
.pagehero{background:linear-gradient(120deg,var(--green-ink) 0 60%,var(--green) 60% 100%);color:#fff;position:relative}
.pagehero .inner{max-width:1100px;margin:0 auto;padding:34px 24px 38px}
.pagehero .crumb{font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#a9c3b2;font-weight:700;margin-bottom:4px}
.pagehero .crumb a{color:var(--yellow);text-decoration:none}
.pagehero h1{font-size:clamp(26px,4.5vw,40px);font-weight:900}
.pagehero p{margin:10px 0 0;max-width:60ch;color:#cfe0d4;font-size:16.5px}
.pagehero .stripe{position:absolute;inset:auto 0 0 0;height:8px;background:linear-gradient(90deg,var(--yellow) 0 45%,var(--blue) 45% 72%,#fff 72% 100%)}
.pagehero.ph-productos{background:linear-gradient(100deg,rgba(11,31,21,.92) 0%,rgba(14,46,31,.78) 45%,rgba(14,46,31,.38) 100%),url("img/hero-productos.webp") center/cover no-repeat,var(--green-ink)}
.pagehero.ph-servicios{background:linear-gradient(100deg,rgba(11,31,21,.92) 0%,rgba(14,46,31,.78) 45%,rgba(14,46,31,.38) 100%),url("img/hero-servicios.webp") center/cover no-repeat,var(--green-ink)}
.pagehero.ph-contacto{background:linear-gradient(100deg,rgba(11,31,21,.92) 0%,rgba(14,46,31,.78) 45%,rgba(14,46,31,.38) 100%),url("img/hero-contacto.webp") center/cover no-repeat,var(--green-ink)}

/* ---- sections ---- */
main{max-width:1100px;margin:0 auto;padding:0 20px}
section{padding-block:52px}
.eyebrow{font-size:13px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);font-weight:700;margin-bottom:6px}
section h2{font-size:clamp(24px,3.8vw,34px);font-weight:800}
.sechead{margin-bottom:28px}

/* ---- tiles (inicio) ---- */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}
.tile{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s;min-width:0}
.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.tile .ic{width:50px;height:50px;border-radius:12px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center}
.tile.t-y .ic{background:var(--yellow);color:var(--yellow-ink)}
.tile.t-b .ic{background:var(--blue)}
.tile h3{font-style:normal;font-family:var(--body);font-size:19px;font-weight:700}
.tile p{margin:0;font-size:14.5px;color:var(--muted);flex:1}
.tile .go{color:var(--blue);font-weight:700;font-size:15px}

/* ---- search ---- */
.search{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:4px 6px 4px 16px;margin:0 0 14px;max-width:560px}
.search:focus-within{border-color:var(--blue)}
.search svg{color:var(--muted);flex:none}
.search input{flex:1;min-width:0;border:none;background:none;color:var(--ink);font-size:16px;font-family:var(--body);padding:10px 0}
.search input:focus{outline:none}
.search .clear{background:var(--bg);border:1px solid var(--line);color:var(--muted);border-radius:8px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer}

/* ---- category filter ---- */
.cats{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px}
.cat{border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:8px 14px;font-size:14.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:border-color .15s,background .15s}
.cat:hover{border-color:var(--green)}
.cat.on{background:var(--green);border-color:var(--green);color:#fff}
.cat .n{background:var(--bg);color:var(--muted);border-radius:999px;font-size:12px;font-weight:700;padding:1px 8px;font-variant-numeric:tabular-nums}
.cat.on .n{background:rgba(255,255,255,.2);color:#fff}
.results-note{font-size:14px;color:var(--muted);margin:0 0 14px}
.noresults{background:var(--surface);border:1px dashed var(--line);border-radius:14px;padding:38px 20px;text-align:center;color:var(--muted);grid-column:1/-1}
.noresults b{color:var(--ink);font-size:17px;display:block;margin-bottom:4px}

/* ---- product grid ---- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:18px}
.card{background:var(--surface);border:2px solid var(--yellow);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.card .pic{aspect-ratio:4/3;max-width:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg),var(--surface));border-bottom:1px solid var(--line);position:relative}
.card .pic svg{width:72px;height:72px;color:var(--green)}
.card .pic.photo{background:#fff}
.card .pic img{width:100%;height:100%;object-fit:contain;padding:12px;box-sizing:border-box}
.card .pic .ex{position:absolute;top:10px;left:10px;background:var(--yellow);color:var(--yellow-ink);font-size:11.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;border-radius:6px;padding:3px 8px;z-index:1}
.card .pic .ex.marca{background:var(--green);color:#fff}
.card .body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.card .catname{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);font-weight:700}
.card h3{font-style:normal;font-family:var(--body);font-size:16.5px;font-weight:700;line-height:1.3}
.card p{margin:0;font-size:14px;color:var(--muted);flex:1}
.card .add{margin-top:10px;display:flex;gap:8px}
.add button.go{flex:1;background:var(--green);color:#fff;border:none;border-radius:9px;padding:10px;font-weight:600;font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer}
.add button.go:hover{filter:brightness(1.12)}
.note-products{margin-top:26px;background:var(--surface);border:1px dashed var(--line);border-radius:12px;padding:14px 18px;font-size:14.5px;color:var(--muted)}

/* ---- paginación ---- */
.pager{display:flex;gap:7px;justify-content:center;align-items:center;margin-top:28px;flex-wrap:wrap}
.pager button{min-width:40px;height:40px;padding:0 10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:9px;font-weight:700;font-size:14.5px;cursor:pointer;font-variant-numeric:tabular-nums}
.pager button:hover:not(:disabled):not(.on){border-color:var(--green)}
.pager button.on{background:var(--green);border-color:var(--green);color:#fff}
.pager button:disabled{opacity:.35;cursor:default}

/* ---- services ---- */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.svc-grid .ccard p{margin:0;font-size:14.5px;color:var(--muted)}
.prevband{margin-top:22px;background:var(--green);color:#eef5ef;border-radius:14px;padding:18px 22px;display:flex;gap:14px;align-items:flex-start}
.prevband svg{flex:none;color:var(--yellow);margin-top:2px}
.prevband p{margin:0;font-size:15.5px;line-height:1.6}
.prevband b{color:#fff}

/* ---- contact ---- */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.ccard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:8px;min-width:0}
.ccard .ic{width:44px;height:44px;border-radius:10px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center}
.ccard.c-y .ic{background:var(--yellow);color:var(--yellow-ink)}
.ccard.c-b .ic{background:var(--blue)}
.ccard b{font-size:15px}
.ccard .val{font-size:16.5px;font-weight:700;word-break:break-word;user-select:all}
.ccard .copy{align-self:flex-start;background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:6px 12px;font-size:13px;font-weight:600;cursor:pointer}
.ccard a.val{text-decoration:none;color:var(--blue)}

/* ---- marcas (portada): marquesina ---- */
.brands{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.brands-track{display:flex;width:max-content;animation:marcas 30s linear infinite}
.brands:hover .brands-track{animation-play-state:paused}
.brand-chip{display:flex;align-items:center;justify-content:center;height:72px;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 24px;margin-right:12px;font-family:var(--display);font-weight:800;font-size:16px;letter-spacing:.6px;color:#15241c;white-space:nowrap}
.brand-chip img{height:44px;width:auto;display:block}
@keyframes marcas{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.brands-track{animation:none}.brands{overflow-x:auto;-webkit-mask-image:none;mask-image:none}}

/* ---- acreditaciones (portada) ---- */
.acredita{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px 28px;display:flex;align-items:center;justify-content:center;gap:16px 36px;flex-wrap:wrap}
.acr-label{font-size:13px;letter-spacing:2.5px;text-transform:uppercase;color:var(--muted);font-weight:700}
.acr-logos{display:flex;gap:18px;align-items:center;flex-wrap:wrap;justify-content:center}
.acr-logos a{display:flex;align-items:center;justify-content:center;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 22px;height:84px}
.acr-logos img{height:56px;width:auto;display:block}

/* ---- CTA band ---- */
.ctaband{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px;display:flex;gap:16px 24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ctaband h3{font-size:21px;font-weight:800}
.ctaband p{margin:4px 0 0;color:var(--muted);font-size:15px}
.ctaband .acts{display:flex;gap:10px;flex-wrap:wrap}

/* ---- footer ---- */
footer{background:var(--green-ink);color:#cfe0d4;margin-top:40px;padding:36px 20px calc(28px + env(safe-area-inset-bottom,0px))}
footer .inner{max-width:1100px;margin:0 auto;display:flex;gap:20px 40px;flex-wrap:wrap;justify-content:space-between;align-items:center}
footer .fb{font-family:'Chakra Petch',var(--display);font-style:italic;font-weight:700;font-size:21px;color:#fff}
footer .fb .pro{color:var(--yellow)}
footer .fb .latam{color:#7db1f7;font-family:'Poppins',var(--body);font-style:normal;font-weight:600;font-size:14px;letter-spacing:3px}
footer small{font-size:13px}
footer a{color:var(--yellow);text-decoration:none;font-weight:600}
footer nav{display:flex;gap:16px;flex-wrap:wrap}

/* ---- cart drawer ---- */
.scrim{position:fixed;inset:0;background:rgba(10,18,14,.5);z-index:60}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--surface);z-index:61;display:flex;flex-direction:column;box-shadow:var(--shadow);padding-top:env(safe-area-inset-top,0px)}
.drawer .dhead{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line)}
.drawer .dhead h3{font-size:21px;font-weight:800}
.xbtn{background:none;border:none;font-size:26px;line-height:1;cursor:pointer;color:var(--muted);padding:4px 8px}
.ditems{flex:1;overflow-y:auto;padding:14px 20px;display:flex;flex-direction:column;gap:12px}
.ditem{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.ditem .nm{flex:1;min-width:0}
.ditem .nm b{font-size:14.5px;display:block}
.ditem .nm span{font-size:12.5px;color:var(--muted)}
.qty{display:flex;align-items:center;gap:2px}
.qty button{width:28px;height:28px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:7px;font-size:16px;font-weight:700;cursor:pointer}
.qty b{min-width:26px;text-align:center;font-variant-numeric:tabular-nums}
.ditem .rm{background:none;border:none;color:var(--muted);cursor:pointer;font-size:17px;padding:4px}
.dempty{text-align:center;color:var(--muted);padding:40px 10px;font-size:15px}
.dempty a{font-weight:700}
.dfoot{border-top:1px solid var(--line);padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:10px}
.dfoot .sum{display:flex;justify-content:space-between;font-size:15px;color:var(--muted)}
.dfoot .sum b{color:var(--ink);font-variant-numeric:tabular-nums}
.btn-quote{background:var(--yellow);color:var(--yellow-ink);border:none;border-radius:10px;padding:14px;font-weight:700;font-size:14px;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer}
.btn-quote:hover{filter:brightness(1.05)}
.btn-quote:disabled{opacity:.5;cursor:default}

/* ---- quote modal ---- */
.modal{position:fixed;inset:0;z-index:70;display:flex;align-items:center;justify-content:center;padding:18px}
.mbox{background:var(--surface);border-radius:16px;width:min(520px,100%);max-height:calc(100% - 20px);overflow-y:auto;box-shadow:var(--shadow);padding:24px;position:relative;z-index:1}
.mbox h3{font-size:22px;font-weight:800;margin-bottom:4px}
.mbox .sub{color:var(--muted);font-size:14.5px;margin:0 0 18px}
.fld{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.fld label{font-size:13.5px;font-weight:700}
.fld label .req{color:var(--blue)}
.fld input,.fld textarea{border:1.5px solid var(--line);background:var(--bg);color:var(--ink);border-radius:9px;padding:11px 12px;font-size:15px;font-family:var(--body);width:100%}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--blue)}
.ferr{color:#c23a3a;font-size:13px;display:none}
.fld.bad input{border-color:#c23a3a}
.fld.bad .ferr{display:block}
.mrow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:460px){.mrow{grid-template-columns:1fr}}
.msummary{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px;margin-bottom:16px}
.msummary b{font-variant-numeric:tabular-nums}
.mactions{display:flex;flex-direction:column;gap:10px}
.btn-wa{background:var(--wa);color:#fff;border:none;border-radius:10px;padding:13px;font-weight:800;font-size:15.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;text-decoration:none}
.btn-mail{background:var(--green);color:#fff;border:none;border-radius:10px;padding:13px;font-weight:700;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:9px;text-decoration:none}
.btn-copy{background:var(--bg);border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:12px;font-weight:600;font-size:14.5px;cursor:pointer}
.mnote{font-size:13px;color:var(--muted);margin:14px 0 0;line-height:1.5}
.mnote b{user-select:all}
.sent-ok{background:var(--bg);border:1px solid var(--line);border-left:4px solid var(--wa);border-radius:10px;padding:12px 14px;font-size:14px;margin-bottom:14px}

/* ---- detalle de producto ---- */
.card.clickable{cursor:pointer}
.pbox{width:min(720px,100%);position:relative}
.pclose{position:absolute;top:10px;right:12px;z-index:2}
.pgrid{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start}
@media (max-width:620px){.pgrid{grid-template-columns:1fr}}
.pimg{border:1px solid var(--line);border-radius:12px;min-height:240px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg),var(--surface));overflow:hidden}
.pimg.photo{background:#fff}
.pimg img{width:100%;height:100%;max-height:300px;object-fit:contain;padding:12px;box-sizing:border-box}
.pinfo{display:flex;flex-direction:column;gap:10px;min-width:0}
.pinfo h3{font-size:21px;font-weight:800;font-family:var(--display);font-style:normal}
.pdesc{margin:0;font-size:15px;color:var(--muted);line-height:1.6}
.pinfo .add{margin-top:4px}
.pinfo .add button.go{flex:1;background:var(--green);color:#fff;border:none;border-radius:9px;padding:10px 14px;font-weight:600;font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;cursor:pointer}
.btn-ficha{display:inline-flex;align-items:center;gap:9px;border:1.5px solid var(--green);color:var(--green);border-radius:10px;padding:11px 16px;font-weight:700;font-size:13px;letter-spacing:.8px;text-transform:uppercase;text-decoration:none;margin-top:6px;align-self:flex-start}
.btn-ficha:hover{background:var(--green);color:#fff}
.btn-ficha.sec{border-color:var(--line);color:var(--muted);font-size:12px;padding:8px 12px;text-transform:none;letter-spacing:.2px}
.btn-ficha.sec:hover{border-color:var(--green);color:var(--green);background:transparent}
.pdocs{display:flex;flex-wrap:wrap;gap:8px}
.pmedia{min-width:0}
.pthumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.pthumbs img{width:54px;height:54px;object-fit:contain;background:#fff;border:1.5px solid var(--line);border-radius:8px;cursor:pointer;padding:4px;box-sizing:border-box}
.pthumbs img.on{border-color:var(--green)}
.pnote{font-size:12.5px;color:var(--muted)}

/* ---- help float + launcher ---- */
.wafloat{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:65;display:flex;align-items:center;gap:10px;background:var(--wa);color:#fff;border:none;border-radius:999px;padding:13px 20px 13px 16px;font-weight:800;font-size:15.5px;text-decoration:none;box-shadow:var(--shadow);cursor:pointer;font-family:var(--body)}
.wafloat:hover{filter:brightness(1.07)}
.wafloat svg{width:24px;height:24px}
@media (max-width:560px){.wafloat span{display:none}.wafloat{padding:14px}}
.launcher{position:fixed;right:18px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:66;background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:16px;display:flex;flex-direction:column;gap:10px;width:min(310px,calc(100vw - 36px))}
.launcher .lt{font-weight:800;font-size:16px}
.launcher .ls{font-size:13.5px;color:var(--muted);margin:-4px 0 4px}
.lbtn{display:flex;align-items:center;gap:12px;border-radius:12px;padding:12px 14px;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);text-align:left;font-family:var(--body)}
.lbtn:hover{border-color:var(--green)}
.lbtn .lic{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:none;color:#fff}
.lbtn .lic.bot{background:var(--green)}
.lbtn .lic.wa{background:var(--wa)}
.lbtn small{display:block;font-weight:500;color:var(--muted);font-size:12.5px}

/* ---- chatbot panel ---- */
.chatpanel{position:fixed;right:18px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:67;width:min(380px,calc(100vw - 36px));height:min(540px,calc(100vh - 150px));background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.chead{background:var(--green);color:#fff;padding:12px 16px;display:flex;align-items:center;gap:10px}
.chead .cav{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;flex:none}
.chead b{font-size:15.5px;display:block;line-height:1.2}
.chead small{font-size:12px;color:#cfe0d4}
.chead .xbtn{margin-left:auto;color:#fff}
.cmsgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:var(--bg)}
.cmsg{max-width:88%;border-radius:12px;padding:9px 12px;font-size:14.5px;line-height:1.5}
.cmsg.bot{background:var(--surface);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px}
.cmsg.user{background:var(--green);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.cmsg .cbtns{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.cbtn{background:var(--bg);border:1.5px solid var(--line);color:var(--ink);border-radius:999px;padding:6px 13px;font-size:13.5px;font-weight:600;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;font-family:var(--body)}
.cbtn:hover{border-color:var(--green)}
.cbtn.wa{background:var(--wa);border-color:var(--wa);color:#fff}
.typing{display:inline-flex;gap:4px;align-items:center;padding:4px 2px}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:tdot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{0%,60%,100%{opacity:.3}30%{opacity:1}}
.cchips{display:flex;gap:6px;flex-wrap:wrap;padding:10px 12px 4px;border-top:1px solid var(--line);background:var(--surface)}
.cform{display:flex;gap:8px;padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));background:var(--surface)}
.cform input{flex:1;min-width:0;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;padding:10px 16px;font-size:14.5px;font-family:var(--body)}
.cform input:focus{outline:none;border-color:var(--green)}
.cform button{background:var(--green);color:#fff;border:none;border-radius:999px;width:42px;height:42px;flex:none;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cform button:hover{filter:brightness(1.12)}

/* ---- modo app (PWA): barra de pestañas inferior ---- */
.tabbar{display:none}
.modo-app .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;background:var(--surface);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));box-shadow:0 -4px 16px rgba(21,36,28,.08)}
.modo-app .tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:var(--muted);text-decoration:none;font-size:11px;font-weight:600;font-family:var(--body);padding:4px 0;cursor:pointer;position:relative}
.modo-app .tab svg{color:inherit}
.modo-app .tab.on{color:var(--green)}
.modo-app .tbadge{position:absolute;top:0;left:calc(50% + 8px);background:var(--yellow);color:var(--yellow-ink);border-radius:999px;min-width:17px;height:17px;font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 4px;font-variant-numeric:tabular-nums}
.modo-app body,.modo-app main{scroll-padding-bottom:70px}
.modo-app footer{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
.modo-app .wafloat{bottom:calc(78px + env(safe-area-inset-bottom,0px))}
.modo-app .toast{bottom:calc(140px + env(safe-area-inset-bottom,0px))}
.modo-app .drawer .dfoot{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}

/* ---- toast ---- */
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(86px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);border-radius:10px;padding:11px 18px;font-size:14.5px;font-weight:600;z-index:80;box-shadow:var(--shadow)}