/* CRM Gremi Labs. Aparença triada: la A, com GoHighLevel.
   Graella del full a 1440: 1440 - 232 (menú) = 1208; 1208 - 2×24 = 1160; dues columnes: (1160 - 24) / 2 = 568. */
:root{
  --chart-1:var(--projecte);--chart-2:var(--control);--chart-muted:var(--control);--grid:var(--border);--axis-ink:var(--muted);--ink:var(--text);--track:var(--active);
  --ground:#f4f5f7;--surface:#fff;--raised:#f4f6f8;--active:#ebedee;--border:#e4e6e9;--rule:#eff0f2;--control:#cdced1;
  --text:#131416;--muted:#5d5f60;--primary:#1d1f20;--primary-ink:#fff;--mix:#fff;
  --positive:#1e7b4f;--negative:#c4242a;--warn-bg:#fffbeb;--warn-ink:#92400e;--warn-line:#fde68a;
  --pill-bg:#ebedee;--pill-ink:#353736;--pill-ok-bg:#dcfae5;--pill-ok-ink:#04250e;--pill-no-bg:#ffedea;--pill-no-ink:#831c1e;
  --menu-bg:#ffffff;--menu-text:#4b4e52;--menu-actiu-bg:#ebedee;--menu-actiu-text:#131416;--menu-marca:#131416;--menu-ctrl:#fff;--menu-ctrl-line:#cdced1;
  --radi:8px;--radi-ctrl:6px;--gap:24px;--pad:24px;--ctrl:32px;--font:"Inter",system-ui,sans-serif;
  --projecte:#0d9488;--etapa-cap:none;
}
/* A · Com GoHighLevel: menú fosc amb etiquetes, botó blau, capçaleres d'etapa pintades */
[data-tema=a]{--ground:#f3f4f6;--primary:#1570ef;--primary-ink:#fff;--menu-bg:#1f2933;--menu-text:#c4cbd3;--menu-actiu-bg:#111820;--menu-actiu-text:#fff;--menu-marca:#fff;--menu-ctrl:#2f3b47;--menu-ctrl-line:#2f3b47;--radi:6px;--radi-ctrl:6px;--gap:16px}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--text);font:400 15px/22px var(--font)}
h1,h2,h3,p,ul{margin:0;padding:0}ul{list-style:none}
button,select,input{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.num,td.num,th.num{font-variant-numeric:tabular-nums}td.num,th.num{text-align:right}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.fluix{color:var(--muted)}


.app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.costat{display:flex;flex-direction:column;gap:16px;padding:16px 12px;background:var(--menu-bg);position:sticky;top:0;height:100vh;align-self:start}
.marca{display:flex;align-items:center;gap:10px;padding:0 6px;color:var(--menu-marca)}
.marca b{display:block;font-weight:600;font-size:15px;line-height:18px}.marca small{display:block;font-size:12px;line-height:14px;color:var(--menu-text)}
.selector select{width:100%;height:40px;padding:0 10px;border:1px solid var(--menu-ctrl-line);border-radius:var(--radi-ctrl);background:var(--menu-ctrl);color:var(--menu-marca);font-weight:500;cursor:pointer}
.menu{display:flex;flex-direction:column;gap:2px}
.menu a{display:flex;align-items:center;gap:10px;height:36px;padding:0 10px;border-radius:var(--radi-ctrl);color:var(--menu-text)}
.menu a svg{flex:none;width:16px;height:16px}
.menu a:hover{color:var(--menu-actiu-text)}
.menu a[aria-current=page]{background:var(--menu-actiu-bg);color:var(--menu-actiu-text);font-weight:500}
.menu a .compte{margin-left:auto;font-size:12px;font-variant-numeric:tabular-nums}

.full{min-width:0;padding:var(--pad);background:var(--ground);outline:none}

.cap{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:12px 24px;margin-bottom:var(--pad)}
h1{font-size:22px;line-height:28px;font-weight:600;letter-spacing:-.01em}
.cap p{margin-top:4px;color:var(--muted);font-size:15px;max-width:72ch}
h2{font-size:16px;line-height:24px;font-weight:600}
.boto{display:inline-flex;align-items:center;height:var(--ctrl);padding:0 12px;border:1px solid var(--control);border-radius:var(--radi-ctrl);background:transparent;cursor:pointer;white-space:nowrap}
.boto.primari{background:var(--primary);color:var(--primary-ink);border-color:var(--primary);font-weight:500}
.boto:hover{border-color:var(--text)}.boto.primari:hover{opacity:.9}

.quadre{background:var(--surface);border:1px solid var(--border);border-radius:var(--radi);padding:20px;min-width:0}
.quadre-cap{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.quadre-cap a{color:var(--muted);white-space:nowrap}.quadre-cap a:hover{color:var(--text)}
.dues{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);align-items:start;margin-top:var(--gap)}

/* La cinta de l'embut: l'element propi del CRM. Cada tros és una etapa, a la seva mida real */
.cinta{display:flex;height:14px;gap:2px;border-radius:3px;overflow:hidden;background:var(--active)}
.cinta i{display:block;min-width:3px}
.cinta i[data-g=abans]{background:color-mix(in srgb,var(--projecte) 22%,var(--mix))}
.cinta i[data-g=seguiment]{background:color-mix(in srgb,var(--projecte) 60%,var(--mix))}
.cinta i[data-g=conversa]{background:var(--projecte)}
.cinta i[data-g=guanyat]{background:var(--positive)}
.cinta i[data-g=fora]{background:var(--control)}
.llegenda{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:10px;color:var(--muted);font-size:13px}
.llegenda b{color:var(--text);font-weight:500;font-variant-numeric:tabular-nums}
.llegenda i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px}
.llegenda i[data-g=abans]{background:color-mix(in srgb,var(--projecte) 22%,var(--mix))}
.llegenda i[data-g=seguiment]{background:color-mix(in srgb,var(--projecte) 60%,var(--mix))}
.llegenda i[data-g=conversa]{background:var(--projecte)}
.llegenda i[data-g=guanyat]{background:var(--positive)}
.llegenda i[data-g=fora]{background:var(--control)}

.xifres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:20px}
.xifres>div{padding:0 20px;border-left:1px solid var(--border)}.xifres>div:first-child{padding-left:0;border-left:0}
.xifres span{display:block;color:var(--muted);font-size:13px}
.xifres b{display:block;font-size:24px;line-height:32px;font-weight:500;font-variant-numeric:tabular-nums}
.xifres b small{font-size:14px;font-weight:400;color:var(--muted)}

/* Inici */
.projectes{display:grid;gap:var(--gap)}
.projecte{--projecte:inherit;display:block}
.projecte:hover h2{text-decoration:underline}
.projecte-cap{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.projecte-cap span{color:var(--muted)}
.projecte-cap .obre{margin-left:auto;color:var(--muted)}
.gluf{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--projecte);margin-right:8px}

/* Avisos */
.avis{padding:10px 14px;margin-bottom:var(--gap);border-radius:var(--radi-ctrl);background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink);font-size:13px}

/* Files */
.files li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-top:1px solid var(--rule)}
.files li:first-child{border-top:0;padding-top:0}.files li:last-child{padding-bottom:0}
.files .fluix{font-size:13px}
.buit{padding:12px;border:1px dashed var(--control);border-radius:var(--radi);color:var(--muted)}

/* Pipeline */
.barra{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:16px}
.barra select,.barra input{height:var(--ctrl);padding:0 10px;border:1px solid var(--control);border-radius:var(--radi-ctrl);background:var(--surface)}
.barra input{width:260px;max-width:100%}.barra input::placeholder{color:var(--muted)}
.barra .dreta{margin-left:auto}
.tauler{display:flex;gap:12px;overflow-x:auto;padding-bottom:12px;align-items:flex-start}
.etapa{flex:0 0 260px;min-width:0;background:color-mix(in srgb,var(--text) 3%,var(--ground));border-radius:var(--radi);padding:0 0 8px}
.etapa.sobre{outline:2px solid var(--text);outline-offset:-2px}
.etapa-cap{padding:10px 12px;border-radius:var(--radi) var(--radi) 0 0}
.etapa-cap b{display:flex;align-items:center;gap:8px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.etapa-cap b::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--e)}
.etapa-cap small{display:block;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
[data-tema=a] .etapa-cap{background:color-mix(in srgb,var(--e) 30%,#fff);color:#131416}
[data-tema=a] .etapa-cap b::before{display:none}
[data-tema=a] .etapa-cap small{color:#3f4246}
.targetes{display:grid;gap:8px;padding:8px;max-height:calc(100vh - 290px);overflow-y:auto}
.targeta{display:block;width:100%;text-align:left;padding:10px 12px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radi-ctrl);cursor:grab}
.targeta:hover{border-color:var(--control)}
.targeta b{display:block;font-weight:500}
.targeta span{display:block;color:var(--muted);font-size:13px;line-height:19px}
.targeta .peu{display:flex;justify-content:space-between;gap:8px;margin-top:4px}
.mes{display:block;padding:6px 8px;color:var(--muted);font-size:13px}
.etapa-buida{padding:8px 12px;color:var(--muted);font-size:13px}

/* Dues columnes: carpetes i taula */
.amb-carpetes{display:grid;grid-template-columns:216px minmax(0,1fr);gap:var(--gap);align-items:start}
.carpetes button{display:flex;justify-content:space-between;gap:8px;width:100%;min-height:34px;padding:7px 10px;background:none;border:0;border-radius:var(--radi-ctrl);text-align:left;cursor:pointer;color:var(--muted)}
.carpetes button:hover{color:var(--text)}
.carpetes button[aria-pressed=true]{background:var(--active);color:var(--text);font-weight:500}
.carpetes .num{font-size:13px}
.carpetes h2{margin:0 0 6px 10px;font-size:13px;font-weight:500;color:var(--muted)}

.pestanyes{display:flex;gap:20px;border-bottom:1px solid var(--border);margin-bottom:16px;overflow-x:auto}
.pestanyes button{height:38px;padding:0;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;color:var(--muted);cursor:pointer;white-space:nowrap}
.pestanyes button:hover{color:var(--text)}
.pestanyes button[aria-pressed=true]{color:var(--text);border-bottom-color:var(--text);font-weight:500}
.pestanyes .num{margin-left:6px;font-size:13px}

.marc-taula{background:var(--surface);border:1px solid var(--border);border-radius:var(--radi);overflow:hidden}
table{width:100%;border-collapse:collapse}
th{height:38px;padding:0 14px;font-weight:400;font-size:13px;color:var(--muted);text-align:left;white-space:nowrap}
td{height:48px;padding:7px 14px;border-top:1px solid var(--rule);vertical-align:middle}
td.nom{font-weight:500;min-width:190px}
td.nom small{display:block;font-weight:400;font-size:13px;line-height:18px;color:var(--muted)}
td .motiu{display:block;max-width:44ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
.movil{display:none}
.pill{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:4px;background:var(--pill-bg);color:var(--pill-ink);font-size:13px;font-weight:500;white-space:nowrap}
.pill.ok{background:var(--pill-ok-bg);color:var(--pill-ok-ink)}
.pill.no{background:var(--pill-no-bg);color:var(--pill-no-ink)}
.nota{display:inline-flex;align-items:baseline;gap:1px;font-weight:600;font-size:15px;font-variant-numeric:tabular-nums}
.nota small{font-weight:400;font-size:13px;color:var(--muted)}
.passos{display:flex;gap:3px}
.passos i{display:block;width:18px;height:6px;border-radius:2px;background:var(--active)}
.passos i.fet{background:var(--projecte)}
.peu-taula{padding:10px 14px;border-top:1px solid var(--rule);color:var(--muted);font-size:13px}

@media(max-width:1100px){
  .amb-carpetes{grid-template-columns:minmax(0,1fr)}
  .carpetes{display:flex;gap:6px;overflow-x:auto}.carpetes h2{display:none}.carpetes button{white-space:nowrap;width:auto;gap:8px}
  .dues{grid-template-columns:minmax(0,1fr)}
  td.opt,th.opt{display:none}
}
@media(max-width:800px){
  .app{display:block;min-height:0;padding-bottom:64px}
  .costat{position:static;height:auto;flex-direction:row;align-items:center;gap:12px;padding:8px 16px}
  .marca small,.marca b{display:none}
  .selector{flex:1;min-width:0}.selector select{height:44px}
  .menu{position:fixed;left:0;right:0;bottom:0;z-index:5;flex-direction:row;gap:0;background:var(--menu-bg);border-top:1px solid var(--border);padding:4px}
  .menu a{flex:1;flex-direction:column;justify-content:center;gap:2px;height:56px;padding:0;font-size:13px;line-height:15px}
  .menu a .compte{display:none}
  .full{padding:16px;margin:0!important;border:0!important;border-radius:0!important}
  h1{font-size:20px}
  .boto{height:44px}.barra select,.barra input{height:44px}.barra input{width:100%}.barra .dreta{margin-left:0}
  .xifres{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:14px}
  .xifres>div:nth-child(odd){padding-left:0;border-left:0}
  .carpetes button{min-height:44px;align-items:center}.pestanyes button{height:44px}
  .targetes{max-height:60vh}.etapa{flex-basis:78vw}
  thead{display:none}table,tbody{display:block}
  tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 14px;border-top:1px solid var(--rule)}
  tr:first-child{border-top:0}
  td{display:block;height:auto;padding:0;border:0}
  td.nom{min-width:0}td.mov-amaga{display:none!important}
  td.num,td.dret{text-align:right;grid-column:2;grid-row:1}
  .movil{display:block;margin-top:2px;font-weight:400;font-size:13px;line-height:18px;color:var(--muted)}
  td.nom small.lloc{display:none}
}
@media(prefers-reduced-motion:no-preference){.boto,.targeta,.menu a{transition:opacity .12s,border-color .12s,color .12s}}

/* Menú amb grups */
.menu-grup{margin:14px 0 4px 10px;font-size:13px;color:var(--menu-text);opacity:.8}
.costat{overflow-y:auto}
.menu a .compte{padding:0 7px;border-radius:9px;background:color-mix(in srgb,var(--menu-text) 22%,transparent);color:var(--menu-actiu-text)}
/* Què et toca */
.accions li{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--rule)}
.accions li:first-child{border-top:0;padding-top:0}.accions li:last-child{padding-bottom:0}
.accions .de{display:flex;align-items:center;color:var(--muted);font-size:13px}
.accions small{display:block;color:var(--muted);font-size:13px;line-height:19px}
/* Objectiu i diners */
.xifres b.gran{font-size:32px;line-height:40px;font-weight:600}
.xifres p{font-size:13px;line-height:19px;color:var(--muted);margin-top:2px}
.pla{height:10px;margin-top:8px;border-radius:999px;background:var(--track);overflow:hidden;display:flex}
.pla i{display:block;background:var(--projecte)}.pla i.aprovat{opacity:.4}
.pla-fins{display:flex;justify-content:space-between;margin-top:4px;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.metes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.metes h3{margin:0;font-size:15px;font-weight:600}
.cal-files li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:4px 20px;padding:9px 0;border-top:1px solid var(--rule)}
.cal-files li:first-child{border-top:0;padding-top:0}
.cal-files li b{font-weight:500;font-variant-numeric:tabular-nums}
.cal-files .fluix{font-variant-numeric:tabular-nums}
.grafic{min-height:220px}
.peu-nota{margin-top:10px;color:var(--muted);font-size:13px;line-height:19px}
.sim{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:16px}
.sim label{display:block;font-weight:500}.sim small{display:block;font-weight:400;color:var(--muted);font-size:13px}
.sim input{width:100%;height:38px;margin-top:6px;padding:0 10px;border:1px solid var(--control);border-radius:var(--radi-ctrl);background:var(--surface);font-variant-numeric:tabular-nums}
.sim-res{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}.sim-res b{font-size:24px;line-height:32px;font-weight:600;font-variant-numeric:tabular-nums}
.sim-res span{color:var(--muted)}
/* Fases */
.fases{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.fases li{padding:8px 10px;border-radius:var(--radi-ctrl);background:var(--raised);min-width:0}
.fases li.ara{outline:2px solid var(--projecte);outline-offset:-2px}
.fases b{display:block;font-weight:500;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fases small{display:block;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
/* Embut */
.embut li{display:grid;grid-template-columns:170px minmax(0,1fr) 48px;gap:12px;align-items:center;padding:5px 0}
.embut .barra-e{height:22px;background:var(--track);border-radius:3px;overflow:hidden}.embut .barra-e i{display:block;height:100%;background:var(--projecte)}
.embut b{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
/* Activitat i accessos */
.heat{display:grid;grid-template-columns:repeat(auto-fill,minmax(28px,1fr));gap:4px}
.heat i{display:block;height:28px;border-radius:3px;background:var(--track)}
.pila{display:grid;gap:var(--gap)}
.accessos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);align-items:start}
.accessos a{display:block;padding:8px 0;border-top:1px solid var(--rule)}.accessos a:first-of-type{border-top:0}.accessos a:hover b{text-decoration:underline}
.accessos b{display:block;font-weight:500}.accessos small{display:block;color:var(--muted);font-size:13px;overflow-wrap:anywhere}
@media(max-width:1100px){.accessos{grid-template-columns:minmax(0,1fr)}.fases{grid-auto-flow:row}.metes{grid-template-columns:minmax(0,1fr)}.accions li{grid-template-columns:minmax(0,1fr) auto}.accions .de{grid-column:1/-1}}
@media(max-width:800px){
  .menu{overflow-x:auto;justify-content:flex-start}.menu a{flex:0 0 76px}.menu-grup{display:none}
  .sim{grid-template-columns:minmax(0,1fr)}.sim input{height:44px}
  .embut li{grid-template-columns:112px minmax(0,1fr) 36px}
  .costat{overflow:visible}
}

.cal-files.mesos li{grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:4px 12px}
.cal-files.mesos li>:not(:first-child){text-align:right}
.mes-menu{display:none}
@media(max-width:800px){
  .menu{overflow:visible;flex-wrap:wrap}
  .menu a{flex:0 0 20%}
  .menu a:nth-of-type(n+5){display:none}
  .menu.obert a:nth-of-type(n+5){display:flex}
  .mes-menu{display:block;flex:0 0 20%;height:56px;margin-left:auto;background:none;border:0;color:var(--menu-text);font-size:13px;cursor:pointer}
  .cal-files.mesos li{font-size:13px}
}

/* Peu del menú: lletra i sortir */
.costat-peu{margin-top:auto;display:flex;align-items:center;gap:6px;padding-top:12px}
.costat-peu button{height:32px;padding:0 10px;background:var(--menu-ctrl);border:0;border-radius:var(--radi-ctrl);color:var(--menu-actiu-text);cursor:pointer}
.costat-peu .surt{margin-left:auto;background:none;color:var(--menu-text)}
/* Entrada */
.entrada{min-height:100vh;display:grid;place-items:center;padding:16px;background:var(--menu-bg)}
.entrada form{width:min(360px,100%);padding:28px;background:var(--surface);border-radius:var(--radi)}
.entrada h1{margin-bottom:4px}.entrada p{color:var(--muted);margin-bottom:18px}
/* Formularis */
dialog{width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 48px);padding:0;border:0;border-radius:var(--radi);background:var(--surface);color:var(--text);box-shadow:0 12px 40px rgba(0,0,0,.25)}
dialog::backdrop{background:rgba(15,20,25,.45)}
.form{display:grid;gap:14px;padding:22px}
.form h2{font-size:18px;line-height:24px}
.camp{display:grid;gap:6px}.camp>span{font-weight:500}.camp small{color:var(--muted);font-size:13px}
.camp input,.camp select,.camp textarea,.entrada input{width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--control);border-radius:var(--radi-ctrl);background:var(--surface);font:inherit;color:inherit}
.camp textarea{min-height:90px;resize:vertical}
.camp input[type=color]{padding:2px;width:64px}
.dos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-peu{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:4px}
.form-peu .dreta{margin-left:auto;display:flex;gap:8px}
.boto.perill{color:var(--negative);border-color:currentColor}
.error{color:var(--negative);font-size:14px}
.ok{color:var(--positive)}
.historial{font-size:13px;color:var(--muted)}.historial li{padding:3px 0}
/* Accions a les llistes */
.boto.petit{height:28px;padding:0 10px;font-size:13px}
.fila-clic{cursor:pointer}.fila-clic:hover td{background:color-mix(in srgb,var(--text) 3%,transparent)}
.targeta{font:inherit;color:inherit}
.etapa-cap{cursor:pointer;width:100%;border:0;text-align:left;font:inherit;display:block}
.nova-etapa{flex:0 0 200px;height:44px}
.carpetes .accio{color:var(--text);font-size:13px;min-height:30px}
.xec{display:flex;gap:10px;align-items:flex-start;width:100%;background:none;border:0;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit}
.xec i{flex:none;width:18px;height:18px;margin-top:2px;border:2px solid var(--control);border-radius:4px}
.xec.fet i{background:var(--positive);border-color:var(--positive)}.xec.fet span{color:var(--muted);text-decoration:line-through}
.barra-cerca{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.barra-cerca input{flex:1 1 220px;height:var(--ctrl);padding:0 10px;border:1px solid var(--control);border-radius:var(--radi-ctrl);background:var(--surface)}
.nota-copia{padding:9px 14px;margin-bottom:16px;border-radius:var(--radi-ctrl);background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-ink);font-size:14px}
@media(max-width:800px){
  .costat-peu{display:none}.dos{grid-template-columns:minmax(0,1fr)}
  .camp input,.camp select{min-height:44px}.barra-cerca input{height:44px}.boto.petit{height:44px}
}

/* Fitxes: dues columnes i els botons sempre a la vista */
@media(min-width:801px){
  .form{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
  dialog{width:min(720px,calc(100vw - 32px))}
  .form>h2,.form>.error,.form>.form-peu,.form>div,.form>.camp:has(textarea){grid-column:1/-1}
}
.form-peu{position:sticky;bottom:0;background:var(--surface);padding:10px 0 2px;margin-top:0}
.error:empty{display:none}
