/* ⛔⭐GARDA GLOBALA, PUSA PRIMA, INTENTIONAT.
   Orice regula de-a noastra care da `display:flex/grid/block` unei clase BATE regula implicita
   a browserului `[hidden]{display:none}`, fiind mai specifica. Consecinta: un element ascuns din
   JS cu `el.hidden = true` ramane vizibil. A costat de doua ori intr-o singura zi, pe doua
   componente diferite: panoul de accesibilitate isi desena umbra peste marginea paginii pe
   telefon, iar cardul de chat NU SE PUTEA INCHIDE.
   ⛔Repararea pe fiecare componenta in parte este exact genul de reparatie pe care o poate ocoli
   componenta urmatoare. Linia asta o repara pe TIP, o data, inclusiv pentru ce nu s-a scris inca. */
[hidden]{display:none!important}

/* Macheta generica de primarie - Devaland. Contrast masurat, vezi footer fiecare pagina. */
:root{
  --bg:#ffffff; --fg:#1c1c1c; --mut:#4a4f4d; --line:#c9d1ce;
  --brand:#003a70; --brand-d:#00305c; --stema:#0066b3; --acc:#8a5a00; --card:#f3f6f5;
  --warn-bg:#fff8e6; --warn-br:#8a5a00; --focus:#0b3d2e;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);
 font:17px/1.65 -apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.skip{position:absolute;left:-9999px;top:0;background:var(--brand);color:#fff;padding:10px 16px;z-index:100}
.skip:focus{left:8px;top:8px}
a{color:var(--brand)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{
 outline:3px solid var(--focus);outline-offset:2px}
.demo{background:var(--warn-bg);border-top:3px solid var(--warn-br);color:#4a3000;
 padding:10px 16px;font-size:14.5px;text-align:center}
.demo strong{color:#6b4400}
header{background:#f4f7fa;color:#12222f;padding:22px 16px;border-bottom:3px solid var(--stema)}
.w{max-width:1000px;margin:0 auto}
header a{color:#12222f}
.brand{display:block;text-decoration:none;line-height:0}
.logo{height:104px;width:auto;max-width:100%;display:block}
.hspacer{flex:1 1 0;min-width:0}
.hact{flex:1 1 0;display:flex;align-items:center;justify-content:flex-end;gap:10px}
.hrow{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.stema{height:58px;width:auto;flex:0 0 auto}
.brandtext{display:block}
.brandtext strong{display:block;font-size:20px;letter-spacing:.2px}
.brandtext span{display:block;font-size:13.5px;font-weight:400;color:#4a5a68;margin-top:2px}

/* bara utilitara: 10,79:1 masurat */
/* ⛔06.09.2026: bara de contact era la 13,5px si scadea la 12,5px pe telefon.
   Textul mic este exact bariera pe care o reclama cititorii peste 45 de ani, iar
   adresa si programul sunt informatia cea mai cautata de un cetatean. 14px minim. */
.util{background:var(--brand-d);color:#dce9f5;font-size:14px}
.util .w{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:7px 16px}
.utilinfo{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 20px}
.utilinfo a{color:#dce9f5}
.utilcta{color:#fff;border:1px solid #6f9dc9;padding:3px 13px;border-radius:3px;text-decoration:none;font-weight:600}
.utilcta:hover{background:#fff;color:var(--brand-d)}

/* buton principal: alb pe #a51c12 = 7,57:1 */
.cta{background:#a51c12;color:#fff;padding:10px 18px;border-radius:3px;text-decoration:none;font-weight:700;font-size:15px;white-space:nowrap}
.cta:hover{background:#8a1710;text-decoration:underline}

/* ⛔Butonul de meniu exista DOAR pe ecran mic si DOAR cand JS a pornit. Fara JS meniul
   ramane deschis, deci pagina merge si cu JavaScript oprit. */
.navtoggle{display:none;align-items:center;gap:8px;background:var(--brand);color:#fff;border:0;
  padding:10px 14px;border-radius:3px;font:600 15px/1 inherit;cursor:pointer}
.bars{display:inline-block;width:17px;height:2px;background:#fff;box-shadow:0 5px 0 #fff,0 10px 0 #fff}
@media(max-width:820px){
  .hrow{gap:12px}
  .hspacer{display:none}
  .brand{order:1;flex:1 1 100%;display:flex;justify-content:center}
  .logo{height:78px;margin:0 auto}
  .hact{order:2;flex:1 1 100%;justify-content:center}
  .utilinfo{gap:2px 14px;font-size:14px;justify-content:center;text-align:center}
  .util .w{justify-content:center;padding:6px 16px;gap:6px}
  .js .navtoggle{display:inline-flex}
  .js nav ul{display:none}
  .js nav ul.openx{display:flex}
  .js nav.open ul{display:flex;flex-direction:column}
  nav a{padding:13px 14px;border-bottom:1px solid rgba(255,255,255,.18)}
  /* ⛔Meniul deschis pe telefon, sub o bara lipita, poate depasi ecranul si devine
     imposibil de derulat. Se limiteaza la inaltimea vizibila si capata derulare proprie. */
  .js nav.open ul{max-height:calc(100vh - 56px);overflow-y:auto;-webkit-overflow-scrolling:touch}
}
@media(max-width:430px){.cta{padding:9px 13px;font-size:14px}.logo{height:60px}}
.stema{height:56px;width:auto;flex:0 0 auto}
/* ⛔Scopat pe .brandtext, nu `.brand span`: dupa ce titlul a fost invelit intr-un span,
   vechiul selector l-ar fi prins si pe el si ar fi micsorat numele primariei la 14px. */
.brandtext{display:block}
.brandtext span{display:block;font-size:14px;font-weight:400;opacity:.95;margin-top:3px}
@media(max-width:520px){.stema{height:44px}.brand{font-size:18px;gap:10px}}
/* ⭐MENIU LIPIT SUS, cerut 29.08.2026, acelasi tipar ca pe site-ul Florariei Symbol.
   ⛔Se lipeste NAV-ul, nu <header>: antetul are sigla de 104px si ar manca o treime din
   ecran la fiecare derulare. Bara albastra este meniul propriu-zis si are ~48px.
   z-index 100 trece peste continut; submeniul .sub (z-index 60) ramane corect in
   interiorul contextului creat de nav, deci se deseneaza tot deasupra paginii. */
nav{background:var(--brand-d);padding:0 16px;position:sticky;top:0;z-index:100}
nav ul{max-width:1000px;margin:0 auto;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:2px}
nav a{display:block;color:#fff;text-decoration:none;padding:12px 14px;font-size:15px}
nav a:hover{background:#00509e;text-decoration:underline}
nav a[aria-current="page"]{background:#fff;color:#00305c;font-weight:700}
/* ⛔Cu meniul lipit, orice ancora din pagina (#continut, #sectiune) ar ateriza SUB bara.
   scroll-padding-top pe <html> rezolva pentru TOATE ancorele, prezente si viitoare. */
html{scroll-padding-top:64px}
main{padding:26px 16px 60px}
h1{font-size:28px;line-height:1.25;color:var(--brand);margin:0 0 14px}
h2{font-size:21px;color:var(--brand);margin:32px 0 10px;border-bottom:2px solid var(--line);padding-bottom:6px}
h3{font-size:17px;margin:20px 0 6px}
.lead{font-size:18px;color:var(--mut)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:18px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:6px;padding:15px 17px}
.card h3{margin-top:0}
table{border-collapse:collapse;width:100%;margin:14px 0;font-size:15px}
caption{text-align:left;font-weight:700;padding:6px 0;color:var(--brand)}
th,td{border:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top}
th{background:var(--card)}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:10px 0}
dl.kv dt{font-weight:700}
dl.kv dd{margin:0}
footer{background:var(--card);border-top:2px solid var(--line);padding:22px 16px;color:var(--mut);font-size:14px}
.a11y{background:#eef4f1;border:1px solid var(--line);border-radius:6px;padding:12px 15px;margin:22px 0;font-size:14.5px}
@media(max-width:560px){body{font-size:16px}h1{font-size:24px}nav a{padding:10px 11px;font-size:14px}}

/* Conducere: acelasi tipar ca la primariile din judet (portret + rol + atributii) */
.pers{display:grid;grid-template-columns:260px 1fr;gap:18px;align-items:start;
 background:var(--card);border:1px solid var(--line);border-radius:6px;padding:16px;margin:14px 0}
.pers .ph{width:132px;height:160px;border-radius:5px;background:#dde5e1;border:1px solid var(--line);
 display:flex;align-items:center;justify-content:center;color:#4a5f57;font-size:13px;text-align:center;
 padding:8px;line-height:1.35}
.pers .ph img{width:100%;height:auto;object-fit:cover;border-radius:4px;display:block;
  box-shadow:0 2px 10px rgba(0,0,0,.18)}
.pers h3{margin:0 0 2px;font-size:19px;color:var(--brand)}
.pers .rol{color:var(--mut);font-weight:700;margin:0 0 10px;font-size:15px}
.pers ul{margin:8px 0 0 18px}
@media(max-width:640px){.pers{grid-template-columns:190px 1fr}}
@media(max-width:460px){.pers{grid-template-columns:1fr}.pers .ph{max-width:240px}}


/* erou institutional: stema mare pe camp albastru, cum au primariile */
.hero{background:linear-gradient(180deg,#00305c 0%,#004a8f 100%);color:#fff;text-align:center;
  padding:34px 16px 30px;border-bottom:4px solid var(--stema)}
.hero img{height:140px;width:auto;margin:0 auto 14px;display:block;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.35))}
.hero h1{color:#fff;border:0;margin:0 0 6px;font-size:29px;line-height:1.2}
.hero p{color:#e2edf8;margin:0;font-size:16.5px}
@media(max-width:640px){.hero img{height:104px}.hero h1{font-size:23px}.hero p{font-size:15px}}

/* ⛔Pe telefon adresa si programul ocupau doua randuri intregi deasupra continutului.
   Raman pe pagina de Contact; sus ramane ce se apasa: emailul. */
@media(max-width:560px){
  .utilinfo li:nth-child(2),.utilinfo li:nth-child(3){display:none}
  .util .w{padding:5px 16px}
  .utilcta{padding:2px 11px}
}




/* ⭐Mesajul primarului la scara pe care o folosesc primariile: portretul ocupa jumatate din
   latime, textul sta intr-o carte alba alaturi. Portretul nativ are 520x693, deci la 460px
   afisati ramane sub rezolutia lui si nu se pixeleaza. */
.mesaj{display:grid;grid-template-columns:1fr 420px;gap:0;margin:26px 0 30px;
  background:linear-gradient(180deg,#eef3f8 0%,#e3ebf3 100%);
  border:1px solid var(--line);border-radius:5px;overflow:hidden}
.mesaj-text{padding:30px 32px;background:#fff;align-self:stretch}
.mesaj-text h2{margin:0 0 14px;border:0;font-size:27px;color:var(--brand-d)}
.mesaj-text p{font-size:16.5px;line-height:1.65}
.mesaj-foto{position:relative;min-height:100%}
.mesaj-foto img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.semnatura{margin-top:18px;font-size:16px;line-height:1.6}
.semnatura strong{font-size:17.5px;color:var(--brand-d)}
.notamacheta{margin-top:16px;font-size:14px;color:#5a4300;background:#fff8e6;
  border-left:3px solid #c9a227;padding:8px 12px;border-radius:0 3px 3px 0}
@media(max-width:860px){.mesaj{grid-template-columns:1fr 320px}.mesaj-text{padding:24px}}
@media(max-width:620px){
  .mesaj{grid-template-columns:1fr}
  .mesaj-foto{order:-1;max-height:420px}
  .mesaj-foto img{object-position:center 18%}
  .mesaj-text{padding:22px 20px}
  .mesaj-text h2{font-size:23px}
}


/* anunturi recente, program si contact pe prima pagina */
.anunturi{list-style:none;margin:14px 0 6px;padding:0}
.anunturi li{display:flex;gap:14px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line)}
.anunturi .data{flex:0 0 128px;color:#5a6b78;font-size:14px;font-variant-numeric:tabular-nums}
.anunturi a{font-weight:600}
.doua{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0}
.doua .box{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:16px 18px}
.doua .box h2{margin-top:0;border:0;font-size:19px}
.maimult{font-weight:600}
.mesajfull{display:grid;grid-template-columns:1fr 300px;gap:28px;align-items:start;margin:16px 0 26px}
.mesajtxt{max-width:70ch}
.mesajportret img{width:100%;height:auto;display:block;border-radius:5px;
  box-shadow:0 4px 18px rgba(0,0,0,.22)}
.mesajportret .cap{margin:10px 0 0;font-size:14.5px;line-height:1.5;color:#3b4a57;text-align:center}
.mesajportret .cap strong{color:var(--brand-d);font-size:15.5px}
@media(max-width:820px){.mesajfull{grid-template-columns:1fr 230px;gap:20px}}
@media(max-width:600px){.mesajfull{grid-template-columns:1fr}
  .mesajportret{order:-1;max-width:260px;margin:0 auto}}
@media(max-width:700px){
  .doua{grid-template-columns:1fr}
  .anunturi li{flex-direction:column;gap:2px}
  .anunturi .data{flex:none}
}


/* sediul primariei si galeria satelor */
.sediu{display:grid;grid-template-columns:300px 1fr;gap:22px;align-items:center;margin:24px 0;
  background:var(--card);border:1px solid var(--line);border-radius:5px;padding:18px}
.sediu img{width:100%;height:auto;border-radius:4px;display:block;box-shadow:0 2px 10px rgba(0,0,0,.16)}
.sediu h2{margin-top:0;border:0}
.galerie{list-style:none;margin:16px 0 6px;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.galerie li{background:#fff;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.galerie img{width:100%;height:170px;object-fit:cover;display:block}
.galerie span{display:block;padding:9px 12px;font-size:14.5px;color:#3b4a57}
.galerie strong{color:var(--brand-d)}
@media(max-width:620px){.sediu{grid-template-columns:1fr}}


/* harta: nu se incarca pana nu o cere vizitatorul (GDPR) */
.harta{border:1px solid var(--line);border-radius:5px;overflow:hidden;margin:14px 0 20px;background:var(--card)}
.harta-placeholder{padding:20px 22px}
.harta-placeholder p{margin:0 0 10px}
.harta-btn{background:var(--brand);color:#fff;border:0;border-radius:4px;padding:12px 20px;
  font:700 15px/1 inherit;cursor:pointer}
.harta-btn:hover{background:var(--brand-d)}
.harta-btn:focus-visible{outline:3px solid #ffd200;outline-offset:2px}
.harta-alt{margin-top:12px !important;font-size:14px;color:#3b4a57}
.harta iframe{display:block}

.evid{background:#eef4fa;border-left:4px solid var(--stema);padding:12px 16px;border-radius:0 4px 4px 0;margin:16px 0}
table{border-collapse:collapse;width:100%;margin:14px 0}
table caption{text-align:left;font-size:14px;color:#4a5a68;padding-bottom:8px}
th,td{border:1px solid var(--line);padding:9px 12px;text-align:left}
thead th{background:var(--card)}


/* fotografii in flux, langa textul pe care il ilustreaza */
figure.fig-dr,figure.fig-st{margin:6px 0 14px;max-width:270px;background:#fff;
  border:1px solid var(--line);border-radius:5px;overflow:hidden}
figure.fig-dr{float:right;margin-left:22px}
figure.fig-st{float:left;margin-right:22px}
figure.fig-dr img,figure.fig-st img{width:100%;height:auto;display:block}
figure figcaption{padding:8px 11px;font-size:13.5px;line-height:1.45;color:#3b4a57}
h2{clear:both}
@media(max-width:640px){
  figure.fig-dr,figure.fig-st{float:none;margin:12px auto 16px;max-width:100%}
}


/* ---- fotografii in flux, MARI ---- */
figure.fig-dr,figure.fig-st,figure.fig-lat{margin:8px 0 18px;background:#fff;
  border:1px solid var(--line);border-radius:6px;overflow:hidden}
figure.fig-dr{float:right;margin-left:26px;max-width:330px}
figure.fig-st{float:left;margin-right:26px;max-width:330px}
figure.fig-dr.fig-mare,figure.fig-st.fig-mare{max-width:400px}
figure.fig-lat{clear:both;max-width:100%;margin:18px 0 22px}
figure img{width:100%;height:auto;display:block}
figure figcaption{padding:10px 14px;font-size:14px;line-height:1.5;color:#3b4a57}
figcaption .credit{display:block;margin-top:5px;font-size:12.5px;color:#5a6b78}
h2{clear:both}

/* sediul, pe contact */
.sediu-foto{max-width:520px;margin:14px 0 18px;background:#fff;border:1px solid var(--line);
  border-radius:6px;overflow:hidden}
.sediu-foto img{width:100%;height:auto;display:block}
.sediu-foto figcaption{padding:10px 14px;font-size:14px;color:#3b4a57}

/* galeria si sediul de pe prima pagina, mai mari */
.galerie{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.galerie img{height:230px}
.sediu{grid-template-columns:400px 1fr}

/* ---- MOBIL: imaginile pe toata latimea, fara float ---- */
@media(max-width:700px){
  figure.fig-dr,figure.fig-st,figure.fig-lat,
  figure.fig-dr.fig-mare,figure.fig-st.fig-mare{
    float:none;margin:16px 0 20px;max-width:100%}
  .galerie{grid-template-columns:1fr;gap:16px}
  .galerie img{height:auto;max-height:340px}
  .sediu{grid-template-columns:1fr}
  .sediu-foto{max-width:100%}
}


/* ⛔Fotografiile ei din 2017 au 240px latime. Intinse peste latimea lor nativa se vad moi,
   iar Lighthouse le semnaleaza corect ca „low resolution". Deci NU le mai marim peste nativ:
   grila se centreaza si celula se opreste la 270px. Marimea reala vine cand primim
   originalele de la primarie. */
.galerie{grid-template-columns:repeat(auto-fit,minmax(230px,270px));justify-content:center}
.galerie img{height:auto;aspect-ratio:4/3;object-fit:cover}
@media(max-width:700px){
  .galerie{grid-template-columns:minmax(0,320px)}
  .galerie img{max-height:none}
}


/* sigle de program in subsol: UE, Guvern, Instrumente Structurale, program-demo */
.ue-logos{border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:16px}
.ue-logos h2{border:0;font-size:16px;margin:0 0 10px}
.ue-logos ul{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:wrap;
  align-items:center;gap:18px 26px}
.ue-logos li{background:#fff;border-radius:4px;padding:7px 10px;display:flex;align-items:center}
.ue-logos img{display:block;height:auto;max-width:100%}
.ue-logos li:first-child img{width:230px}
.ue-logos li+li img{width:74px}
.ue-logos p{font-size:13px;color:#4a5a68;margin:0}
@media(max-width:520px){.ue-logos ul{gap:14px 18px}.ue-logos li:first-child img{width:190px}}


/* ---- carduri de serviciu: TOT cardul este link, nu doar textul ---- */
.srv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:18px;margin:24px 0 28px}
.srv{display:flex;gap:16px;align-items:flex-start;text-decoration:none;color:inherit;
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--stema);
  border-radius:6px;padding:20px;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.srv:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(0,48,92,.16);border-left-color:#a51c12}
.srv:focus-visible{outline:3px solid #ffd200;outline-offset:3px}
.srv-ico{flex:0 0 auto;width:52px;height:52px;border-radius:6px;background:var(--brand);
  display:flex;align-items:center;justify-content:center;transition:background .15s ease}
.srv:hover .srv-ico{background:#a51c12}
.srv-ico svg{width:27px;height:27px;fill:#fff}
.srv-txt{display:block}
.srv-txt strong{display:block;font-size:18px;color:var(--brand-d);line-height:1.28;margin-bottom:6px}
.srv-d{display:block;font-size:15px;color:#3b4a57;line-height:1.55}
.srv-go{display:inline-block;margin-top:10px;font-weight:700;font-size:14.5px;color:#a51c12}
.srv:hover .srv-go{text-decoration:underline}
.srv-go span{display:inline-block;transition:transform .15s ease}
.srv:hover .srv-go span{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){.srv,.srv-ico,.srv-go span{transition:none}
  .srv:hover{transform:none}.srv:hover .srv-go span{transform:none}}
@media(max-width:520px){.srv{padding:16px;gap:13px}.srv-ico{width:44px;height:44px}
  .srv-ico svg{width:23px;height:23px}.srv-txt strong{font-size:16.5px}}


/* ---- ritm si vizual pe telefon, aliniat cu devaland.com si florariasymbol ---- */
@media(max-width:640px){
  body{font-size:16.5px}
  main .w{padding-left:16px;padding-right:16px}
  h1{font-size:27px;line-height:1.22;margin:18px 0 10px}
  h2{font-size:21px;margin:26px 0 10px}
  p.lead{font-size:17px;line-height:1.6}
  /* carduri: mai aerisite, cu pictograma deasupra textului */
  .srv-grid{gap:14px;margin:20px 0 24px}
  .srv{flex-direction:column;gap:12px;padding:18px;border-left-width:5px}
  .srv-ico{width:48px;height:48px}
  .srv-txt strong{font-size:17.5px}
  .srv-go{margin-top:12px;padding:9px 0}
  /* tinte de atins mai mari */
  nav a{padding:15px 14px;font-size:16px}
  .utilcta{padding:6px 14px}
  .cta{padding:13px 22px;font-size:15.5px}
  .navtoggle{padding:13px 18px;font-size:15.5px}
  /* tabele care nu mai ies din ecran */
  table{display:block;overflow-x:auto;white-space:nowrap}
  /* subsol mai lizibil */
  footer .w{padding:18px 16px}
  .ue-logos ul{justify-content:flex-start}
}
@media(max-width:380px){
  .hact{flex-direction:column;width:100%}
  .cta,.navtoggle{width:100%;justify-content:center;text-align:center}
}


/* galerie MARE pe prima pagina: doua coloane late, imagini inalte */
.galerie-mare{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:20px;
  justify-content:stretch}
.galerie-mare img{height:300px;aspect-ratio:auto}
.galerie-mare span{padding:12px 15px;font-size:15px}
.galerie-mare em{display:block;margin-top:4px;font-size:12.5px;color:#5a6b78;font-style:normal}
/* ⛔fotografia sediului are 274px nativ: nu o mai afisam mai lata de atat */
.sediu{grid-template-columns:274px 1fr}
@media(max-width:760px){
  .galerie-mare{grid-template-columns:1fr}
  .galerie-mare img{height:250px}
  .sediu{grid-template-columns:1fr}
  .sediu img{max-width:274px}
}


/* ---- Sediul primariei: imagine mare, centrata, prima impresie a paginii ---- */
.sediu{display:block;max-width:840px;margin:26px auto 30px;padding:0;text-align:center;
  background:#fff;border:1px solid var(--line);border-radius:8px;overflow:hidden;
  box-shadow:0 3px 16px rgba(0,48,92,.10)}
.sediu img{width:100%;height:auto;display:block;margin:0}
.sediu-txt{padding:22px 26px 24px}
.sediu-txt h2{margin:0 0 10px;border:0;font-size:24px;color:var(--brand-d)}
.sediu-txt p{margin:0 auto 8px;max-width:62ch;font-size:16px;line-height:1.6}
.sediu-orar{display:inline-block;margin-top:8px !important;background:var(--card);
  border:1px solid var(--line);border-radius:5px;padding:9px 16px;font-size:15px}
@media(max-width:640px){
  .sediu{margin:20px 0 24px;border-radius:6px}
  .sediu-txt{padding:18px 16px 20px}
  .sediu-txt h2{font-size:21px}
}

/* ritm mai bun intre sectiunile paginii principale */
main h2{margin-top:34px}
main .mesaj+h2,main .sediu+h2{margin-top:30px}


/* harta: linkuri directe, ca pe florariasymbol. Zero module externe incarcate. */
.harta-cta{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--stema);
  border-radius:6px;padding:20px 22px;margin:16px 0 22px}
.harta-adr{margin:0 0 14px;font-size:16.5px;line-height:1.55}
.harta-btns{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 12px}
.btn-harta{display:inline-block;background:var(--brand);color:#fff;text-decoration:none;
  padding:12px 20px;border-radius:5px;font-weight:700;font-size:15px}
.btn-harta:hover{background:var(--brand-d);text-decoration:underline}
.btn-harta:focus-visible{outline:3px solid #ffd200;outline-offset:2px}
.btn-harta.btn-2{background:#a51c12}
.btn-harta.btn-2:hover{background:#8a1710}
.btn-harta.btn-3{background:#fff;color:var(--brand-d);border:1px solid #9db4c8}
.btn-harta.btn-3:hover{background:#e6eef6}
.harta-nota{margin:0;font-size:13.5px;color:#3b4a57;line-height:1.55}
@media(max-width:520px){.harta-btns{flex-direction:column}.btn-harta{text-align:center}}

.ue-logos li a{display:block;line-height:0;border-radius:3px}
.ue-logos li a:focus-visible{outline:3px solid #ffd200;outline-offset:3px}
.ue-logos li:has(a):hover{box-shadow:0 2px 10px rgba(0,48,92,.20)}


/* ⭐Siglele se dimensioneaza dupa INALTIME, nu dupa latime: nativ au 84, 82 si 86 px inaltime,
   deci pe latime fixa ieseau trei inaltimi diferite si randul arata strambat. La 88px sunt
   aliniate si raman practic la rezolutia lor nativa, deci nu se inmoaie. */
.ue-logos li+li img{width:auto;height:88px}
.ue-logos li:first-child img{width:auto;height:112px}
.ue-logos ul{align-items:center}
.ue-logos li{padding:9px 12px}
@media(max-width:520px){
  .ue-logos li+li img{height:70px}
  .ue-logos li:first-child img{height:92px}
}


/* ⭐Sigle mai mari, ca pe site-urile de institutii publice. Fisierele au fost marite in prealabil
   (100x84 -> 300x252), deci la 118px afisati raman peste rezolutia lor si nu se inmoaie in plus. */
.ue-logos li+li img{width:auto;height:118px}
.ue-logos li:first-child img{width:auto;height:150px}
.ue-logos ul{gap:20px 24px}
.ue-logos li{padding:11px 14px;border:1px solid var(--line)}
@media(max-width:640px){
  .ue-logos li+li img{height:92px}
  .ue-logos li:first-child img{height:118px}
}
@media(max-width:420px){
  .ue-logos li+li img{height:76px}
  .ue-logos li:first-child img{height:100px}
}


/* ⭐TOATE cele patru sigle la aceeasi inaltime, inclusiv bannerul program-demo. Fisierele au fost
   refacute la 380px inaltime, deci la 150px afisati raman peste pragul pentru ecrane 2x. */
.ue-logos li img,.ue-logos li:first-child img,.ue-logos li+li img{width:auto;height:150px}
.ue-logos ul{gap:18px 20px;align-items:stretch}
.ue-logos li{padding:10px 12px;display:flex;align-items:center}
@media(max-width:900px){.ue-logos li img,.ue-logos li:first-child img,.ue-logos li+li img{height:120px}}
@media(max-width:640px){.ue-logos li img,.ue-logos li:first-child img,.ue-logos li+li img{height:96px}}
@media(max-width:420px){.ue-logos li img,.ue-logos li:first-child img,.ue-logos li+li img{height:80px}}


/* harta si bannerul de consimtamant */
.harta-box{margin:16px 0 14px;border:1px solid var(--line);border-radius:6px;overflow:hidden;
  min-height:120px;background:var(--card)}
.harta-refuz{padding:24px 20px;text-align:center}
.harta-refuz p{margin:0 0 10px;font-size:15px;color:#3b4a57}
.harta-refuz a{font-weight:700}
.harta-oricum{border:0;background:none;color:#4a5a68;font:inherit;font-size:13.5px;
  text-decoration:underline;cursor:pointer;padding:4px}
.harta-oricum:focus-visible{outline:3px solid #ffd200;outline-offset:2px}
/* ⛔Refuz si Accept: aceeasi marime, aceeasi greutate, aceeasi pozitie. Un refuz stilizat ca
   link palid este cel mai frecvent mod in care bannerele astea devin nelegale. */
#buc-consent{position:fixed;left:0;right:0;bottom:0;z-index:2147483000;background:#00305c;
  color:#dce9f5;padding:16px 18px;box-shadow:0 -8px 30px rgba(0,0,0,.28);font-size:15px;line-height:1.55}
#buc-consent .ck-in{max-width:1080px;margin:0 auto;display:flex;flex-wrap:wrap;gap:14px;
  align-items:center;justify-content:space-between}
#buc-consent p{margin:0;flex:1 1 340px;color:#dce9f5}
#buc-consent a{color:#ffd200;text-decoration:underline}
#buc-consent .ck-btn{display:flex;gap:10px;flex:0 0 auto}
#buc-consent button{padding:12px 24px;border-radius:5px;font:inherit;font-weight:700;cursor:pointer;
  font-size:15px;border:1px solid #dce9f5}
#buc-consent .ck-no{background:transparent;color:#dce9f5}
#buc-consent .ck-no:hover{background:#dce9f5;color:#00305c}
#buc-consent .ck-ok{background:#dce9f5;color:#00305c;border-color:#dce9f5}
#buc-consent .ck-ok:hover{background:#fff}
#buc-consent button:focus-visible{outline:3px solid #ffd200;outline-offset:2px}
@media(max-width:560px){#buc-consent .ck-btn{width:100%}#buc-consent button{flex:1 1 0}}

.btn-retrage{background:var(--brand);color:#fff;border:0;border-radius:5px;padding:12px 22px;
  font:700 15px/1 inherit;cursor:pointer}
.btn-retrage:hover{background:var(--brand-d)}
.btn-retrage:focus-visible{outline:3px solid #ffd200;outline-offset:2px}


/* ⭐Pe laptop cele patru sigle trebuie sa incapa pe UN SINGUR rand. La 150px inaltime suma
   latimilor plus spatiile trecea de 1000px si a patra cadea pe randul doi. Randul devine flexibil:
   inaltimea scade automat cat sa incapa, si nu mai depinde de un numar ghicit. */
.ue-logos ul{flex-wrap:nowrap;gap:14px;align-items:stretch}
.ue-logos li{flex:0 1 auto;min-width:0;padding:8px 10px}
.ue-logos li img{height:auto;max-height:132px;width:100%;object-fit:contain}
.ue-logos li:first-child{flex:1 1 auto;max-width:340px}
.ue-logos li+li{flex:0 1 auto;max-width:190px}
@media(max-width:820px){
  .ue-logos ul{flex-wrap:wrap;gap:14px 18px}
  .ue-logos li,.ue-logos li:first-child,.ue-logos li+li{flex:0 0 auto;max-width:none}
  .ue-logos li img{height:104px;width:auto;max-height:none}
}
@media(max-width:520px){.ue-logos li img{height:82px}}


/* ⭐Banda de macheta pe doua randuri: prima spune CINE, a doua spune CE NU ESTE. Pe un singur
   rand lung, partea care conteaza (nu este pagina oficiala) se pierde in mijlocul frazei. */
.demo{text-align:center}
.demo-1,.demo-2{display:block}
.demo-1{font-size:15.5px;margin-bottom:3px}
.demo-2{font-size:14.5px;line-height:1.55}

/* creditul nostru din subsol, pe randuri, ⛔fara liniuta lunga (regula 9) */
.credit-devaland{border-top:1px solid var(--line);padding-top:12px;margin-top:14px}
.credit-devaland p{margin:0 0 4px;line-height:1.55}
.cd-1{font-size:15.5px}
.cd-2{font-size:14.5px}
.cd-3{font-size:14px;color:#3b4a57}
.cd-4{margin-top:7px !important;font-weight:600}
@media(max-width:520px){.demo-1{font-size:14.5px}.demo-2{font-size:13.5px}}


/* ⭐Sediul pe pagina de contact: mai mare si CENTRAT, cu legenda centrata sub el.
   Fisierul are 820px latime, deci il oprim acolo: peste, s-ar intinde peste rezolutia lui. */
.sediu-foto.sediu-mare{max-width:820px;margin:16px auto 20px;text-align:center;
  box-shadow:0 3px 16px rgba(0,48,92,.12)}
.sediu-foto.sediu-mare img{width:100%;height:auto}
.sediu-foto.sediu-mare figcaption{text-align:center;font-size:15px;padding:12px 16px}
.harta-cta,.harta-box{max-width:820px;margin-left:auto;margin-right:auto}
.harta-cta{text-align:center}
.harta-btns{justify-content:center}
@media(max-width:900px){.sediu-foto.sediu-mare{max-width:100%}}

.sv-h{margin:18px 0 8px;font-size:19px;color:var(--brand-d)}


/* ---- meniu cu submeniuri, tiparul folosit de primarii ---- */
nav ul{position:relative}
nav li{position:relative;display:flex;align-items:stretch}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.subtog{background:transparent;border:0;color:#fff;cursor:pointer;padding:0 11px 0 2px;
  display:flex;align-items:center}
.subtog:hover{background:#00509e}
.subtog:focus-visible{outline:3px solid #ffd200;outline-offset:-3px}
.car{display:block;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;
  border-top:6px solid #fff;transition:transform .15s ease}
.subtog[aria-expanded="true"] .car{transform:rotate(180deg)}
.sub{display:none;position:absolute;top:100%;left:0;min-width:250px;background:#00305c;
  border:1px solid #0a4a80;border-radius:0 0 5px 5px;box-shadow:0 8px 22px rgba(0,0,0,.30);
  z-index:60;padding:5px 0;flex-direction:column}
nav li.open>.sub{display:flex}
.sub li{display:block}
.sub a{display:block;padding:11px 16px;font-size:14.5px;border:0;white-space:nowrap}
.sub a:hover{background:#00509e;text-decoration:underline}
@media(prefers-reduced-motion:reduce){.car{transition:none}}

/* pe telefon submeniul devine acordeon in interiorul meniului deschis */
@media(max-width:820px){
  nav li{flex-wrap:wrap}
  nav li>a{flex:1 1 auto}
  .subtog{flex:0 0 auto;padding:0 18px;border-left:1px solid rgba(255,255,255,.18)}
  .sub{position:static;width:100%;min-width:0;box-shadow:none;border:0;border-radius:0;
    background:#00234a;padding:0}
  .sub a{padding-left:32px;border-bottom:1px solid rgba(255,255,255,.12)}
}


/* ⛔REGRESIE REPARATA 29.08: regula `nav li[data-active="1"]>a{background:#00509e}` avea aceeasi
   specificitate ca `nav a[aria-current="page"]` si venea DUPA ea, deci suprascria doar FONDUL si
   lasa textul inchis. Rezultat: „Acasă" scris cu bleumarin pe albastru, 1,67:1, practic invizibil.
   ⭐Lectia: cand doua reguli ating acelasi element, culoarea de text si fondul se scriu INTOTDEAUNA
   impreuna, in aceeasi regula. Jumatate de pereche mostenita de la alta regula nu este un contrast,
   este un accident.
   Ordinea de mai jos este intentionata: capitolul activ intai, pagina curenta dupa, ca sa castige. */
nav li[data-active="1"]>a:not([aria-current]){background:#00509e;color:#fff}      /* 7,95:1 */
nav a[aria-current="page"]{background:#fff;color:#00305c;font-weight:700}         /* 13,31:1 */
.sub a[aria-current="page"]{background:#fff;color:#00305c}
/* Bara de machetă. Contrast masurat: #FFF6F0 pe #7A2E00 = 8,88:1; link #FFE3D0 = 7,73:1. */
.demobar{background:#7A2E00;color:#FFF6F0;font-size:14px;line-height:1.5}
.demobar .w{padding:10px 16px}
.demobar p{margin:0}
.demobar a{color:#FFE3D0;text-decoration:underline}
.demobar a:hover,.demobar a:focus{color:#fff}

/* ⭐Marca autorului in antet. ⛔NU inlocuieste stema comunei: macheta trebuie sa arate ca site-ul
   institutiei, nu ca al nostru. Sta in stanga, discret, si duce la devaland.cloud.
   Contrast masurat: #1c1c1c pe #ffffff = 17,04:1. */
.madeby{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-decoration:none;
  padding:6px 10px;border-radius:8px;flex:0 0 auto}
.madeby:hover,.madeby:focus-visible{background:#eef3f8}
.madeby-l{font-size:11px;line-height:1.2;color:#1c1c1c;letter-spacing:.02em}
.madeby img{display:block;height:34px;width:auto}
@media(max-width:760px){.madeby-l{display:none}.madeby img{height:26px}}

/* ⭐Sigla autorului in subsol. ⛔Adresa Devaland este REALA: Sântandrei, Simeria, judetul Hunedoara.
   Inlocuirea "judetul Hunedoara" -> "judetul Exemplu" din curatarea machetei o lovise si pe a
   noastra, deci subsolul dadea o adresa gresita pentru o firma reala. Reparat 01.09.2026. */
.cd-logo{display:inline-block;margin:0 0 8px}
.cd-logo img{display:block;height:40px;width:auto}

/* ⭐Antetul foloseste toata latimea, ca pe site-urile reale de primarie: sigla la stanga,
   numele institutiei langa ea, actiunile la dreapta. ⛔`justify-content:center` lasa un gol
   vizibil in stanga. 01.09.2026. */
header .w.hrow{justify-content:flex-start;gap:22px}
header .w.hrow .hact{margin-left:auto}
.brand{flex:0 1 auto}
.brand img.logo{max-width:100%;height:auto}

/* ⛔Sigla la latime naturala (760px) impingea butonul pe rand nou. Se limiteaza pe inaltime. */
.brand img.logo{height:58px;width:auto;max-width:100%}
@media(max-width:900px){.brand img.logo{height:44px}}
@media(max-width:600px){.brand img.logo{height:36px}}

/* ⭐Semnal vizibil ca tabelul se deruleaza: fara el, coloanele ascunse arata ca informatie lipsa.
   Contrast masurat pentru text pe fundal: #1c1c1c pe #eef3f8 = 15,1:1. */
.tbl-scroll{outline-offset:2px}
.tbl-scroll:focus-visible{outline:3px solid #003a70}
.tbl-scroll::after{content:""}
@media(max-width:760px){
  .tbl-scroll{position:relative;
    background-image:linear-gradient(to right,#fff 30%,rgba(255,255,255,0)),
                     linear-gradient(to left,#fff 30%,rgba(255,255,255,0)),
                     linear-gradient(to right,rgba(0,0,0,.16),rgba(0,0,0,0)),
                     linear-gradient(to left,rgba(0,0,0,.16),rgba(0,0,0,0));
    background-position:0 0,100% 0,0 0,100% 0;
    background-repeat:no-repeat;
    background-size:36px 100%,36px 100%,14px 100%,14px 100%;
    background-attachment:local,local,scroll,scroll}
}