/*
Theme Name: Școala Gimnazială Târgu Trotuș 2026
Theme URI: https://scoalatgtrotus.ro/
Author: Școala Gimnazială Târgu Trotuș
Description: Temă clasică WordPress pentru Școala Gimnazială Târgu Trotuș. Editare 100% normală (Articole pentru anunțuri, Pagini Gutenberg), fără page builder. Inspirată după designul original Nicepage, refăcută curat în PHP.
Version: 2.7.1
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tgtrotus
*/

/* ============================================================
   VARIABILE DE CULOARE / FONT  (extrase din site-ul original)
   ============================================================ */
:root{
  --rosu:        #db545a;
  --rosu-inchis: #c63f45;
  --roz:         #fbeced;
  --albastru:        #004a90;
  --albastru-inchis: #003a73;
  --albastru-deschis:#218df3;
  --text:    #111111;
  --text-2:  #4d4d4d;
  --gri:     #808080;
  --gri-bg:  #f2f2f2;
  --linie:   #e6e6e6;
  --alb:     #ffffff;
  --font-titlu: 'Ubuntu', sans-serif;
  --font-text:  'Roboto', 'Open Sans', sans-serif;
  --container: 1180px;
  --radius: 10px;
  --umbra: 0 8px 24px rgba(0,0,0,.08);
}

/* ============================================================
   RESET / BAZA
   ============================================================ */
*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0;
  font-family:var(--font-text);
  color:var(--text);
  line-height:1.6;
  background:var(--alb);
  font-size:17px;
}
h1,h2,h3,h4,h5{ font-family:var(--font-titlu); color:var(--text); line-height:1.2; margin:0 0 .5em; font-weight:700; }
h1{ font-size:2.4rem; } h2{ font-size:2rem; } h3{ font-size:1.35rem; }
a{ color:var(--albastru); text-decoration:none; transition:color .15s; }
a:hover{ color:var(--rosu); }
img{ max-width:100%; height:auto; }
p{ margin:0 0 1em; }

/* ============================================================
   ACCESIBILITATE
   ============================================================ */
/* Link „Sari la conținut" — vizibil doar la focus din tastatură */
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:1000;
  background:var(--albastru); color:#fff; padding:12px 18px; border-radius:0 0 8px 0;
  font-family:var(--font-titlu); font-weight:500;
}
.skip-link:focus{ left:0; color:#fff; }
#continut{ outline:none; }
/* Contur clar la navigarea cu tastatura */
a:focus-visible, button:focus-visible, .card:focus-visible,
.btn:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:3px solid var(--albastru-deschis); outline-offset:2px; border-radius:4px;
}

.container{ width:90%; max-width:var(--container); margin:0 auto; }
.sectiune{ padding:64px 0; }
.text-centru{ text-align:center; }
.titlu-sectiune{ text-align:center; margin-bottom:8px; }
.titlu-sectiune::after{ content:""; display:block; width:64px; height:4px; background:var(--rosu); border-radius:4px; margin:14px auto 0; }
.subtitlu{ text-align:center; color:var(--gri); max-width:680px; margin:0 auto 40px; }

/* butoane */
.btn{
  display:inline-block; padding:13px 28px; border-radius:50px; font-family:var(--font-titlu);
  font-weight:500; letter-spacing:.3px; cursor:pointer; border:0; font-size:1rem;
}
.btn-rosu{ background:var(--rosu); color:#fff; }
.btn-rosu:hover{ background:var(--rosu-inchis); color:#fff; }
.btn-albastru{ background:var(--albastru); color:#fff; }
.btn-albastru:hover{ background:var(--albastru-inchis); color:#fff; }
.btn-contur{ background:transparent; border:2px solid #fff; color:#fff; }
.btn-contur:hover{ background:#fff; color:var(--albastru); }

/* ============================================================
   BARA DE SUS (email / telefon / facebook)
   ============================================================ */
.topbar{ background:var(--albastru-inchis); color:#dbe7f3; font-size:.9rem; }
.topbar .container{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:8px 0; flex-wrap:wrap; }
.topbar a{ color:#dbe7f3; } .topbar a:hover{ color:#fff; }
.topbar .info span{ margin-right:18px; white-space:nowrap; }
.topbar .social .fb{ display:inline-flex; align-items:center; }
.topbar .social .fb svg{ width:18px; height:18px; fill:currentColor; transition:transform .15s; }
.topbar .social .fb:hover svg{ transform:scale(1.15); }

/* ============================================================
   ANTET / MENIU
   ============================================================ */
.site-header{ background:#fff; border-bottom:1px solid var(--linie); position:sticky; top:0; z-index:50; }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; padding:14px 0; gap:16px; }
.brand{ display:flex; align-items:center; gap:14px; text-decoration:none; }
.brand img,.brand .brand-logo{ height:64px; width:auto; flex:none; }
.brand .nume{ font-family:var(--font-titlu); font-weight:700; font-size:1.15rem; color:var(--albastru); line-height:1.2; max-width:300px; }
.brand .nume small{ display:block; font-weight:400; font-size:.76rem; color:var(--gri); margin-top:3px; }

.meniu-principal ul{ list-style:none; display:flex; gap:6px; margin:0; padding:0; }
.meniu-principal a{ display:block; padding:10px 16px 8px; color:var(--text); font-family:var(--font-titlu); font-weight:500; border-bottom:3px solid transparent; transition:color .15s, border-color .15s; }
.meniu-principal a:hover,
.meniu-principal .current-menu-item > a{ color:var(--albastru); border-bottom-color:var(--albastru); }

.menu-toggle{ display:none; flex-direction:column; gap:5px; background:var(--albastru); border:0; padding:11px 10px; border-radius:6px; cursor:pointer; z-index:120; }
.menu-toggle span{ display:block; width:24px; height:2px; background:#fff; border-radius:2px; transition:transform .3s, opacity .3s; }
.menu-toggle.deschis span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.menu-toggle.deschis span:nth-child(2){ opacity:0; }
.menu-toggle.deschis span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.meniu-overlay{ position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:90; opacity:0; transition:opacity .3s; }
.meniu-overlay.activ{ opacity:1; }
.meniu-overlay[hidden]{ display:none; }

/* ============================================================
   HERO / VIZIUNE
   ============================================================ */
.hero{
  background-color:var(--albastru);            /* fallback până se încarcă imaginea */
  background-size:cover; background-position:center center; background-attachment:fixed;
  color:#fff; text-align:center; padding:100px 0;
}
.hero h1{ color:#fff; font-size:2.8rem; margin-bottom:18px; }
.hero .motto{ font-size:1.4rem; font-style:italic; max-width:760px; margin:0 auto 10px; opacity:.97; }
.hero .autor{ font-family:var(--font-titlu); letter-spacing:1px; text-transform:uppercase; font-size:.9rem; opacity:.85; }
.hero .actiuni{ margin-top:30px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ============================================================
   CARDURI ACCES RAPID
   ============================================================ */
.carduri{ display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:24px; }
.card{
  background:#fff; border:1px solid var(--linie); border-radius:var(--radius); padding:34px 24px;
  text-align:center; transition:transform .18s, box-shadow .18s; display:flex; flex-direction:column; color:var(--text);
}
.card:hover{ transform:translateY(-6px); box-shadow:var(--umbra); color:var(--text); border-color:transparent; }
.card .icon{ width:64px; height:64px; margin:0 auto 18px; border-radius:50%; background:var(--roz); display:flex; align-items:center; justify-content:center; }
.card .icon svg{ width:30px; height:30px; fill:var(--rosu); }
.card h3{ font-size:1.15rem; margin-bottom:6px; }
.card p{ color:var(--gri); font-size:.95rem; margin:0; }
/* buton „MAI MULTE DETALII" — dreptunghi cu bordură doar jos, ca pe site-ul original */
.card .card-mai{
  margin-top:18px; align-self:center; padding:8px 2px 6px;
  font-family:var(--font-titlu); font-weight:500; font-size:.76rem; letter-spacing:1.5px; text-transform:uppercase;
  color:var(--text-2); border-bottom:2px solid var(--rosu); transition:color .15s;
}
.card:hover .card-mai{ color:var(--rosu); }

/* Carduri suprapuse pe hero (ca pe site-ul original) */
.carduri-zona{ background:var(--gri-bg); padding:50px 0; }
.carduri-zona .carduri{ grid-template-columns:repeat(4,1fr); }
.carduri-zona + .sectiune{ padding-top:0; }  /* spațiu egal sub carduri ca deasupra */
.carduri-zona .card{ border:1px solid var(--linie); border-top:4px solid var(--rosu); border-radius:14px; box-shadow:0 12px 32px rgba(0,0,0,.13); padding:26px 16px; }
.carduri-zona .card h3{ text-transform:uppercase; font-size:.95rem; letter-spacing:.3px; color:var(--text); margin-bottom:14px; }
.carduri-zona .card .icon{ width:82px; height:82px; background:var(--roz); }
.carduri-zona .card .icon img{ width:48px; height:48px; object-fit:contain; }
.carduri-zona .card-mai{ color:var(--albastru); }
.carduri-zona .card:hover .card-mai{ color:var(--rosu); }
@media (max-width:939px){ .carduri-zona .carduri{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .carduri-zona .carduri{ grid-template-columns:1fr; } }

/* ============================================================
   ANUNȚURI (lista din Articole)
   ============================================================ */
.bg-gri{ background:var(--gri-bg); }
.lista-anunturi{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:24px; }
.anunt{
  background:#fff; border:1px solid var(--linie); border-radius:var(--radius); padding:26px; display:flex; flex-direction:column;
}
.anunt:hover{ box-shadow:var(--umbra); }
.anunt .data{ font-family:var(--font-titlu); font-weight:700; font-size:.85rem; color:var(--rosu); text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px; }
.anunt h3{ font-size:1.2rem; margin-bottom:10px; }
.anunt h3 a{ color:var(--text); } .anunt h3 a:hover{ color:var(--rosu); }
.anunt p{ color:var(--text-2); font-size:.97rem; }
.anunt .citeste{ margin-top:auto; font-family:var(--font-titlu); font-weight:500; color:var(--albastru); }
.anunt .citeste:hover{ color:var(--rosu); }
.gol{ text-align:center; color:var(--gri); padding:40px 0; }

/* ============================================================
   CONTACT
   ============================================================ */
.contact-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:24px; }
.contact-item{ text-align:center; padding:24px; }
.contact-item .icon{ width:58px; height:58px; margin:0 auto 14px; border-radius:50%; background:var(--albastru); display:flex; align-items:center; justify-content:center; }
.contact-item .icon svg{ width:26px; height:26px; fill:#fff; }
.contact-item strong{ display:block; font-family:var(--font-titlu); margin-bottom:4px; }
.contact-item span,.contact-item a{ color:var(--text-2); }

/* harta */
.harta{ margin-top:48px; border-radius:var(--radius); overflow:hidden; box-shadow:var(--umbra); line-height:0; }
.harta iframe{ width:100%; height:420px; border:0; display:block; }
@media (max-width:600px){ .harta iframe{ height:300px; } }

/* ============================================================
   GALERIE „Din activitățile noastre"
   ============================================================ */
.galerie{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.galerie-item{
  position:relative; display:block; border-radius:var(--radius); overflow:hidden;
  aspect-ratio:4/3; background:var(--gri-bg); box-shadow:var(--umbra);
}
.galerie-item img{ width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.galerie-item:hover img{ transform:scale(1.06); }
.galerie-titlu{
  position:absolute; left:0; right:0; bottom:0; padding:18px 14px 12px;
  color:#fff; font-family:var(--font-titlu); font-size:.95rem; font-weight:500; line-height:1.25;
  background:linear-gradient(to top, rgba(0,0,0,.78), rgba(0,0,0,0));
}

/* ============================================================
   CONȚINUT PAGINI / ARTICOLE
   ============================================================ */
.page-head{ background:var(--albastru); color:#fff; padding:10px 0; text-align:left; }
.page-head h1{ color:#fff; margin:0; font-size:1.2rem; font-weight:500; }
.continut{ max-width:860px; margin:0 auto; padding:34px 0 44px; }
.continut img{ border-radius:8px; }
.continut h2,.continut h3{ margin-top:1.4em; }
.continut a{ text-decoration:underline; }
/* Atașamentele (PDF) din articole devin butoane de descărcare */
.continut a[href$=".pdf"], .continut a[href$=".PDF"],
.continut a[href$=".doc"], .continut a[href$=".docx"]{
  display:inline-flex; align-items:center; gap:8px; margin:6px 0;
  background:var(--rosu); color:#fff; padding:12px 22px; border-radius:8px;
  font-family:var(--font-titlu); font-weight:500; text-decoration:none; transition:background .15s;
}
.continut a[href$=".pdf"]:hover, .continut a[href$=".PDF"]:hover,
.continut a[href$=".doc"]:hover, .continut a[href$=".docx"]:hover{ background:var(--rosu-inchis); color:#fff; }
.continut ul,.continut ol{ padding-left:1.4em; }
.meta-articol{ color:var(--gri); font-size:.9rem; margin-bottom:24px; }
.atasamente{ background:var(--gri-bg); border-radius:var(--radius); padding:20px 24px; margin:28px 0; }
.atasamente strong{ font-family:var(--font-titlu); }
.atasamente ul{ margin:10px 0 0; padding-left:18px; }

.paginatie{ text-align:center; margin-top:40px; }
.paginatie .page-numbers{ display:inline-block; padding:8px 14px; margin:2px; border:1px solid var(--linie); border-radius:6px; }
.paginatie .current{ background:var(--rosu); color:#fff; border-color:var(--rosu); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{ background:#1a1a1a; color:#cfcfcf; padding:50px 0 0; font-size:.95rem; }
.footer-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:32px; padding-bottom:36px; }
.site-footer h4{ color:#fff; font-size:1.05rem; margin-bottom:14px; }
.site-footer a{ color:#cfcfcf; } .site-footer a:hover{ color:var(--rosu); }
.site-footer ul{ list-style:none; padding:0; margin:0; }
.site-footer ul li{ margin-bottom:8px; }
.footer-jos{ border-top:1px solid #333; padding:18px 0; text-align:center; color:#9a9a9a; font-size:.88rem; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:939px){
  .menu-toggle{ display:flex; }
  .meniu-principal{
    position:fixed; top:0; right:0; bottom:0; width:min(82vw,300px);
    background:var(--albastru-inchis); z-index:100; display:block;
    transform:translateX(100%); transition:transform .32s ease;
    overflow-y:auto; padding:74px 0 24px; box-shadow:-8px 0 28px rgba(0,0,0,.28);
  }
  .meniu-principal.deschis{ transform:translateX(0); }
  .meniu-principal ul{ flex-direction:column; gap:0; padding:0; }
  .meniu-principal a{ color:#fff; padding:15px 26px; display:block; border-radius:0; }
  .meniu-principal a:hover, .meniu-principal .current-menu-item>a{ background:rgba(255,255,255,.10); color:#fff; }
  body.meniu-deschis{ overflow:hidden; }
  .topbar .info span{ display:inline-block; margin-bottom:2px; }
  .hero{ background-attachment:scroll; padding:80px 0; }  /* parallax fix pe mobil */
  .hero h1{ font-size:2rem; } .hero .motto{ font-size:1.15rem; }
  h1{ font-size:1.9rem; } h2{ font-size:1.6rem; }
  .site-header .container{ flex-wrap:wrap; }
}

/* ============================================================
   BUTON „ÎNAPOI SUS"
   ============================================================ */
.sus{
  position:fixed; right:20px; bottom:20px; z-index:60;
  width:48px; height:48px; border:0; border-radius:50%; cursor:pointer;
  background:var(--albastru); color:#fff; box-shadow:var(--umbra);
  display:flex; align-items:center; justify-content:center; transition:background .15s, transform .15s;
}
.sus:hover{ background:var(--rosu); transform:translateY(-3px); }
.sus[hidden]{ display:none; }
.sus svg{ width:26px; height:26px; fill:#fff; }

/* ============================================================
   BANNER COOKIE-URI (GDPR)
   ============================================================ */
.cookie-bar{ position:fixed; left:0; right:0; bottom:0; z-index:100; background:var(--albastru-inchis); color:#fff; box-shadow:0 -4px 16px rgba(0,0,0,.22); }
.cookie-bar[hidden]{ display:none; }
.cookie-bar .container{ display:flex; align-items:center; justify-content:center; gap:18px; padding:14px 0; flex-wrap:wrap; }
.cookie-bar p{ margin:0; font-size:.92rem; color:#eaf1f8; }
.cookie-bar a{ color:#fff; text-decoration:underline; }
.cookie-bar .btn{ padding:9px 22px; font-size:.92rem; white-space:nowrap; }

/* ============================================================
   PRINTARE (pagini/anunțuri pe hârtie)
   ============================================================ */
@media print{
  .topbar, .site-header, .menu-toggle, .site-footer, .sus, .skip-link,
  .hero .actiuni, .galerie, .carduri{ display:none !important; }
  body{ font-size:12pt; color:#000; }
  a{ color:#000; text-decoration:underline; }
  /* arată URL-ul lângă linkuri (utile pe hârtie) */
  .continut a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:9pt; word-break:break-all; }
  .sectiune{ padding:0; }
  .page-head{ background:none; color:#000; padding:0 0 12px; }
  .page-head h1{ color:#000; }
}

/* Respectă preferința de mișcare redusă */
@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}