/*
Theme Name: Attica Editorial
Version: 1.1 FIXED GRID + COLORS + LINKS
*/


/* =========================
FONT
========================= */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');


/* =========================
ROOT COLORS
========================= */

:root{

--blue:#1e4f8a;
--blue-dark:#162f4a;
--blue-light:#2c6bb2;

--accent:#e11d2a;

--bg:#eef2f6;

--text:#0f172a;
--muted:#64748b;

--card:#ffffff;

}


/* =========================
BASE
========================= */

body{

margin:0;
background:var(--bg);
font-family:'Inter',sans-serif;
color:var(--text);

}

.attica-wrap{

max-width:1200px;
margin:auto;

}


/* FIX: links να μην γίνονται μπλε */

a{

color:inherit;
text-decoration:none;

}

a:hover{

color:var(--blue);

}


/* =========================
HEADER
========================= */

.header{

background:var(--blue-dark);
color:white;

padding:18px 0;

border-bottom:4px solid var(--accent);

}

.header .attica-wrap{

display:flex;
align-items:center;
justify-content:space-between;

}

.logo img{

height:64px;

}

.nav{

display:flex;
gap:24px;

}

.nav a{

color:white;
font-weight:700;
font-size:14px;
opacity:0.9;

}

.nav a:hover{

opacity:1;

}
.site-header{
    position: relative;
border-bottom: 7px solid #e30613;
}

/* =========================
GRID
========================= */

.main{

padding:24px 0;

}

.grid{

display:grid;
grid-template-columns:1.7fr .8fr;
gap:24px;

}


/* =========================
HERO
========================= */

.hero-main{

display:block;
color:var(--text);

}

.hero-main .thumb{

aspect-ratio:16/9;
position:relative;

}

.hero-main img{

width:100%;
height:100%;
object-fit:cover;

}

.meta{

padding:16px;

}

.kicker{

font-size:12px;
font-weight:800;
color:var(--blue);
text-transform:uppercase;

}

.h1{

font-size:28px;
font-weight:800;
margin-top:6px;

}

.date{

font-size:12px;
color:var(--muted);

}


/* HERO OVERLAY */

.hero-overlay{

position:absolute;
bottom:0;
left:0;
right:0;

background:rgba(30,79,138,0.85);

color:white;
padding:18px;

}

.hero-municipality{

font-size:12px;
font-weight:800;

}

.hero-excerpt{

font-size:16px;
font-weight:600;
margin-top:6px;

}


/* =========================
SIDEBAR
========================= */

.sidebox{

background:white;
padding:14px;
border-radius:6px;

}

.sidebox .title{

font-weight:800;
color:var(--blue);

margin-bottom:10px;

border-left:4px solid var(--accent);
padding-left:8px;

}

.tick{

display:grid;
grid-template-columns:80px 1fr;
gap:10px;

margin-bottom:12px;

color:var(--text);

}

.tick .thumb{

aspect-ratio:4/3;

}

.tick img{

width:100%;
height:100%;
object-fit:cover;

}

.tick .t{

font-size:14px;
font-weight:700;

}


/* =========================
SECTOR
========================= */

.sector{

margin-top:30px;
padding:16px;

background:white;
border-radius:6px;

}


/* FULL WIDTH BAR */

.section-title{

grid-column:1/-1;

margin-bottom:14px;

}

.section-title h2{

font-size:16px;
font-weight:800;

background:var(--blue);
color:white;

padding:8px 16px;

border-left:5px solid var(--accent);

}


/* =========================
GRID FIX — 4-5 COLUMNS
========================= */

.feed-grid{

display:grid;

grid-template-columns:repeat(5, 1fr);

gap:16px;

}

/* όταν δεν χωράνε 5 */

@media(max-width:1200px){

.feed-grid{
grid-template-columns:repeat(4, 1fr);
}

}

@media(max-width:900px){

.feed-grid{
grid-template-columns:repeat(2, 1fr);
}

}

@media(max-width:600px){

.feed-grid{
grid-template-columns:1fr;
}

}


/* =========================
CARD
========================= */

.feed-item{

display:block;

background:var(--card);

border-radius:6px;
max-width:300px;

overflow:hidden;

color:var(--text);

}

.feed-item .thumb{

width:100%;
height:220px;

overflow:hidden;

position:relative;

background:#ddd;

}


}

.feed-item img{

width:100%;
height:100%;
object-fit:cover;

}

.feed-item .thumb img{

width:100%;
height:100%;

object-fit:cover;
object-position:center;

display:block;

}

/* META UNDER IMAGE */

.meta-row{

font-size:12px;
padding:6px 10px 0 10px;

}

.meta-row .municipality{

color:var(--blue);
font-weight:700;

}

.meta-row .date{

color:var(--muted);
margin-left:6px;

}

.feed-item .t{

font-size:15px;
font-weight:700;

padding:4px 10px 12px 10px;

}


/* =========================
LABEL
========================= */

.municipality-label{

position:absolute;
bottom:8px;
left:8px;

background:rgba(0,0,0,0.65);

color:white;

padding:5px 10px;

font-size:11px;
font-weight:800;

pointer-events:none;

}


/* =========================
STRIPS
========================= */

.weather-strip,
.greece-strip,
.newspaper-strip{

background:white;
padding:14px;

margin-top:20px;

border-left:4px solid var(--blue);

border-radius:6px;

}


/* =========================
CLICK FIX
========================= */

.feed-item,
.hero-main,
.tick{

position:relative;
z-index:1;

}


/* =========================
RESPONSIVE
========================= */

@media(max-width:900px){

.grid{

grid-template-columns:1fr;

}

.feed-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:600px){

.feed-grid{

grid-template-columns:1fr;

}

}
.meta-row{

display:flex;
align-items:center;
gap:8px;

margin-top:6px;
margin-bottom:4px;

}

.municipality-badge{

background:#1e4f8a;
color:white;

padding:3px 8px;

font-size:11px;
font-weight:700;

border-radius:3px;

}

.meta-row .date{

color:#64748b;
font-size:12px;

}
.breaking-wrap{

display:flex;

align-items:center;

background:#ffffff;

border-top:3px solid #e11d2a;

border-bottom:1px solid #e5e7eb;

margin-top:16px;

overflow:hidden;

}

.breaking-label{

background:#e11d2a;

color:#fff;

font-weight:800;

font-size:12px;

padding:8px 14px;

white-space:nowrap;

}

.breaking-scroll{

overflow:hidden;

width:100%;

}

.breaking-track{

display:flex;

gap:30px;

padding-left:20px;

animation:breakingScroll 60s linear infinite;

}

.breaking-item{

display:flex;

align-items:center;

gap:10px;

font-size:13px;

color:#111;

white-space:nowrap;

}

.breaking-thumb img{

width:40px;

height:40px;

object-fit:cover;

border-radius:4px;

}

.breaking-item:hover{

color:#1e4f8a;

}

@keyframes breakingScroll{

0%{ transform:translateX(0); }

100%{ transform:translateX(-50%); }

}
.frontpages-wrap {

    margin-top:30px;
}


.frontpages-header {

    background: linear-gradient(90deg,
        #7a0000,
        #c40000,
        #7a0000);

    padding:12px 18px;

    border-left:6px solid #ff0000;

    box-shadow:0 3px 10px rgba(0,0,0,0.3);

}


.frontpages-header-text {

    color:white;

    font-size:18px;

    font-weight:800;

    letter-spacing:1px;

}


.frontpages-scroll-container {

    overflow-x:auto;

    overflow-y:hidden;

    background:#0b0f14;

    padding:10px 0;

}
.frontpages-iframe {

    border:none;

    width:1400px;   /* force horizontal */

    height:350px;

    display:block;

}

.weather-box{

background:white;

padding:18px;

border-radius:6px;

display:flex;

align-items:center;

justify-content:space-between;

box-shadow:0 2px 6px rgba(0,0,0,0.05);

}

.weather-main{

display:flex;

align-items:center;

gap:14px;

}

.weather-icon{

width:60px;

}

.weather-temp{

font-size:28px;

font-weight:800;

color:var(--blue);

}

.weather-desc{

font-size:14px;

color:#555;

}

.weather-extra{

font-size:13px;

color:#666;

display:flex;

gap:18px;

}
.weather-strip-wrap{

display:flex;

align-items:center;

gap:30px;

background:white;

padding:16px;

border-radius:6px;

overflow-x:auto;

}
.weather-editorial{

background:white;

padding:16px;

border-radius:6px;

box-shadow:0 2px 6px rgba(0,0,0,0.05);

}

.weather-title{

font-size:14px;

font-weight:800;

color:var(--blue);

border-left:4px solid var(--accent);

padding-left:10px;

margin-bottom:12px;

}

.weather-title span{

color:#666;

font-weight:600;

}

.weather-row{

display:flex;

align-items:center;

gap:26px;

overflow-x:auto;

}

/* TODAY BIG */

.weather-today{

display:flex;

align-items:center;

gap:12px;

min-width:200px;

}

.weather-today img{

width:60px;

}

.weather-today-temp{

font-size:28px;

font-weight:800;

color:var(--blue);

}

.weather-today-desc{

font-size:13px;

color:#666;

}

/* NEXT DAYS */

.weather-day{

text-align:center;

min-width:80px;

}

.weather-day img{

width:40px;

}

.weather-day-name{

font-size:12px;

font-weight:700;

margin-bottom:4px;

}

.weather-day-temp{

font-size:13px;

font-weight:700;

}
.frontpages-section {

    width:100%;
    max-width:1400px;
    margin:auto;

}


.strip {

    width:100%;
    margin-top:15px;
}


.strip-img {

    height:20%;
    display:block;

}


.frontpages-container {

    overflow:hidden;
    padding-top:10px;
}


.frontpages-scroll {

    display:flex;
    gap:20px;

    overflow-x:auto;

    padding-bottom:10px;
}


.cover {

    height:180px;

    border-radius:6px;

    transition:0.3s;

}


.cover:hover {

    transform:scale(1.05);

}
.weather-header {

    background: linear-gradient(90deg,
        #003c7a,
        #0072c4,
        #003c7a);

    padding:12px 18px;

    border-left:6px solid #00c3ff;

    box-shadow:0 3px 10px rgba(0,0,0,0.3);

    margin-bottom:15px;

}


.weather-header-text {

    color:white;

    font-size:18px;

    font-weight:800;

    letter-spacing:1px;

}

.reels-row{

display:flex;
gap:20px;
overflow-x:auto;

}

.reels-row iframe{

width:320px;
height:570px;
border:none;
border-radius:12px;

}
.reels-row{

display:flex;
gap:20px;
overflow-x:auto;

}

.reel-item iframe{

width:320px;
height:570px;
border:none;
border-radius:12px;

}

.reel-user{

text-align:center;
margin-top:5px;
font-weight:bold;

}
.dimoi-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
gap:20px;
margin-bottom:40px;

}

.dimos-card{

background:#fff;
padding:20px;
border-radius:10px;
text-decoration:none;
color:#111;
font-weight:bold;
box-shadow:0 4px 10px rgba(0,0,0,0.1);

}

.articles-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:20px;
margin-bottom:50px;

}
.municipality-grid{

display:grid;
grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
gap:24px;
margin:40px 0;

}

.municipality-card{

background:#ffffff;
border-radius:16px;
padding:22px;
text-decoration:none;
color:#0f172a;

box-shadow:
0 4px 12px rgba(0,0,0,0.04),
0 12px 28px rgba(0,0,0,0.06);

transition:all .25s ease;

position:relative;
overflow:hidden;

}

.municipality-card:hover{

transform:translateY(-6px);
box-shadow:
0 12px 24px rgba(0,0,0,0.08),
0 20px 40px rgba(0,0,0,0.12);

}

.municipality-card::after{

content:"→";
position:absolute;
right:18px;
top:18px;
opacity:0;
transition:.25s;
font-size:18px;

}

.municipality-card:hover::after{

opacity:0.5;
right:14px;

}

.municipality-name{

font-size:18px;
font-weight:700;

}

.municipality-count{

font-size:13px;
margin-top:4px;
color:#64748b;

}

.municipality-header{

display:flex;
justify-content:space-between;
align-items:center;

margin-top:60px;
margin-bottom:20px;

}

.municipality-header h2{

font-size:24px;
font-weight:700;
position:relative;
padding-left:14px;

}

.municipality-header h2::before{

content:"";
position:absolute;
left:0;
top:4px;
bottom:4px;
width:4px;
background:#2563eb;
border-radius:2px;

}

.view-all{

font-size:14px;
color:#2563eb;
text-decoration:none;
font-weight:500;

}

.view-all:hover{

opacity:.7;

}


.article-card{

display:block;
background:#fff;
border-radius:14px;
overflow:hidden;

box-shadow:
0 4px 12px rgba(0,0,0,0.04),
0 10px 24px rgba(0,0,0,0.08);

transition:.25s;

}

.article-card:hover{

transform:translateY(-4px);
box-shadow:
0 14px 28px rgba(0,0,0,0.10),
0 22px 48px rgba(0,0,0,0.14);

}

.article-card img{

width:100%;
height:180px;
object-fit:cover;

}

.article-card h3{

padding:16px;
font-size:15px;
font-weight:600;
line-height:1.5;

}
.sector-hero{

padding:30px 0;
margin-bottom:20px;

}

.sector-hero h1{

font-size:34px;
font-weight:800;
margin-bottom:6px;

}

.sector-hero p{

color:#64748b;
font-size:15px;

}
.layout-grid{

display:grid;
grid-template-columns: 1fr 320px;
gap:40px;

}

.sidebar{

position:sticky;
top:20px;

}

.sidebar-title{

font-size:18px;
font-weight:700;
margin-bottom:16px;

}

.sidebar-news-item{

display:flex;
gap:12px;
margin-bottom:14px;
text-decoration:none;
color:#111;

}

.sidebar-news-image img{

width:70px;
height:70px;
object-fit:cover;
border-radius:8px;

}

.sidebar-news-title{

font-size:14px;
font-weight:600;
line-height:1.4;

}

.sidebar-news-item:hover .sidebar-news-title{

color:#2563eb;

}

/* Tablet */
@media (max-width: 1024px){

.layout-grid{

grid-template-columns: 1fr;
gap:30px;

}

.sidebar{

position:relative;
top:0;

}

}


/* Mobile */
@media (max-width: 768px){

.layout-grid{

grid-template-columns: 1fr;
gap:24px;

}

.sidebar{

margin-top:20px;

}

.sidebar-news-image img{

width:60px;
height:60px;

}

.article-card img{

height:200px;

}

.municipality-grid{

grid-template-columns: 1fr 1fr;

}

}


/* Small mobile */
@media (max-width: 480px){

.municipality-grid{

grid-template-columns: 1fr;

}

.article-card img{

height:220px;

}

}
.site-header{

background:#1e3a5f;
color:#fff;
position:sticky;
top:0;
z-index:1000;

}

.header-inner{

max-width:1200px;
margin:auto;

display:flex;
align-items:center;
justify-content:space-between;

padding:12px 20px;

}

.logo img{

height:50px;

}

.menu{

display:flex;
gap:24px;
list-style:none;
margin:0;
padding:0;

}

.menu a{

color:#fff;
text-decoration:none;
font-weight:500;
font-size:15px;

}

.menu a:hover{

opacity:.7;

}

.menu-toggle{

display:none;
flex-direction:column;
gap:4px;
cursor:pointer;

}

.menu-toggle span{

width:24px;
height:3px;
background:#fff;
display:block;

}
@media (max-width: 768px){

.menu-toggle{

display:flex;

}

.main-nav{

position:absolute;
top:70px;
left:0;
right:0;

background:#1e3a5f;

display:none;
flex-direction:column;

padding:20px;

}

.main-nav.active{

display:flex;

}

.menu{

flex-direction:column;
gap:16px;

}

}
@media (max-width: 768px){

.main-nav{

display:none;

}

.main-nav.active{

display:block;
position:absolute;
top:70px;
left:0;
right:0;
background:#1e3a5f;
padding:15px;

}

.menu{

flex-direction:column;
gap:12px;

}

.menu-toggle{

display:flex;
cursor:pointer;

}

}
.site-header{

background:#1e3a5f;
padding:12px 0;

}

.header-inner{

display:flex;
justify-content:space-between;
align-items:center;

}

.logo img{

height:50px;

}

body{

font-family:'Inter',sans-serif;

}


/* TOP BAR */

.topbar{

background:#ffffff;
border-bottom:1px solid #e5e7eb;

}

.topbar-inner{

display:flex;
justify-content:flex-end;
padding:6px 0;

}

.social-icons img{

height:16px;
margin-left:12px;
opacity:.7;

}

.social-icons img:hover{

opacity:1;

}


/* HEADER */

.site-header{

background:#1e3a5f;

}

.header-inner{

display:flex;
justify-content:space-between;
align-items:center;

padding:12px 0;

}

.logo img{

height:80px;
margin-right:40px;
}


/* MENU */

.menu{

display:flex;
gap:18px;
list-style:none;
margin:0;
padding:0;
align-items:center;
}

.menu li{

display:flex;
align-items:center;

}

.menu li:not(:last-child)::after{

content:"";
display:block;
width:1px;
height:18px;
background:rgba(255,255,255,0.3);
margin-left:18px;

}
.menu a{

color:#fff;
text-decoration:none;
font-weight:500;

}


/* HAMBURGER */

.menu-toggle{

display:none;
flex-direction:column;
gap:4px;
cursor:pointer;

}

.menu-toggle span{

width:24px;
height:3px;
background:#fff;
display:block;

}


/* MOBILE */

@media(max-width:768px){

.main-nav{

position:absolute;
top:60px;
left:0;
right:0;
background:#1e3a5f;

display:none;

}

.main-nav.active{

display:block;

}

.menu{

flex-direction:column;
padding:20px;

}

.menu li{

padding:10px 0;

}

.menu li::after{

display:none;

}

.menu-toggle{

display:flex;

}

}
.container{

max-width:1200px;
margin:0 auto;
padding:0 20px;

}
.news-title{

font-size:32px;
font-weight:800;
margin-bottom:10px;

}

.news-meta{

display:flex;
gap:12px;
color:#64748b;
font-size:14px;
margin-bottom:20px;

}

.news-image img{

width:100%;
border-radius:12px;
margin-bottom:20px;

}

.news-content{

font-size:17px;
line-height:1.7;

}

.news-content p{

margin-bottom:18px;

}


.related-news{

margin-top:50px;

}

.related-news h3{

margin-bottom:20px;

}
.instagram-strip{
  margin:20px 0;
  padding:10px 0;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
}
/* AI NETWORK LIVE BACKGROUND */

body{
position:relative;
background:#f1f5f9;
overflow-x:hidden;
}

/* base layer */

body::before{

content:"";
position:fixed;
inset:0;

background-image:url('https://attica.digitalinside.gr/wp-content/themes/attica-editorial/ai-network-bg.jpg');

background-size:cover;
background-position:center;

opacity:0.6;

z-index:0;

pointer-events:none;

animation: networkFloat 30s ease-in-out infinite alternate;

}

/* light pulse overlay */

body::after{

content:"";
position:fixed;
inset:0;

background:
radial-gradient(circle at 20% 30%, rgba(215,25,32,0.06), transparent 40%),
radial-gradient(circle at 80% 70%, rgba(0,120,255,0.05), transparent 40%);

z-index:0;

pointer-events:none;

animation: networkPulse 12s ease-in-out infinite alternate;

}

/* animation movement */

@keyframes networkFloat{

0%{
transform:translateY(0px) scale(1);
}

100%{
transform:translateY(-20px) scale(1.02);
}

}

/* pulse effect */

@keyframes networkPulse{

0%{
opacity:0.5;
}

100%{
opacity:0.8;
}

}

/* ensure content above */

.main,
.attica-wrap,
.container{
position:relative;
z-index:1;
background:transparent;
}
/* LIVE SYSTEM BAR */

.system-status-bar{

position:relative;

height:45px;

display:flex;
align-items:center;
justify-content:center;

background:
linear-gradient(
90deg,
rgba(255,255,255,0) 0%,
rgba(255,255,255,0.9) 20%,
rgba(255,255,255,0.9) 80%,
rgba(255,255,255,0) 100%
);

border-bottom:1px solid rgba(0,0,0,0.06);

overflow:hidden;

}


/* inner */

.system-status-inner{

position:relative;

font-size:12px;
font-weight:600;

letter-spacing:1px;

color:#1f2937;

display:flex;
align-items:center;
gap:10px;

}


/* live dot */

.system-live-dot{

width:6px;
height:6px;

background:#e30613;

border-radius:50%;

box-shadow:0 0 10px rgba(227,6,19,0.8);

animation:systemPulse 1.2s infinite;

}


/* scan line */

.system-scan{

position:absolute;

left:-50%;

top:0;

width:50%;
height:100%;

background:
linear-gradient(
90deg,
transparent,
rgba(0,120,255,0.15),
transparent
);

animation:systemScan 4s linear infinite;

}


/* animations */

@keyframes systemPulse{

0%{opacity:1; transform:scale(1);}
50%{opacity:0.4; transform:scale(1.8);}
100%{opacity:1; transform:scale(1);}

}


@keyframes systemScan{

0%{left:-50%;}
100%{left:150%;}

}
.system-status-text{
display:flex;
flex-direction:column;
align-items:center;
gap:2px;
}

.system-primary{
font-size:14px;
font-weight:600;
letter-spacing:1px;
}

.system-secondary{
font-size:13px;
color:#6b7280;
font-weight:500;
letter-spacing:0.3px;
}
.parapolitika-scroll{

display:flex;
gap:14px;

will-change:transform;

}

.parapolitika-strip{

overflow:hidden;

}

/* hide scrollbar clean */
.parapolitika-scroll::-webkit-scrollbar{
height:4px;
}

.parapolitika-scroll::-webkit-scrollbar-thumb{
background:#ccc;
border-radius:3px;
}

.para-card{

flex:0 0 auto;

width:220px;

text-decoration:none;
color:#111;

transition:transform 0.18s ease;

}

.para-card:hover{

transform:translateY(-3px);

}

.para-card img{

width:100%;
height:140px;
object-fit:cover;

border-radius:6px;

}

.para-badge{

position:absolute;
bottom:6px;
left:6px;

background:rgba(0,0,0,0.75);

color:#fff;
font-size:11px;

padding:4px 7px;

border-radius:4px;

}

.para-card .thumb{

position:relative;

}

.para-card .t{

font-size:14px;
margin-top:6px;
line-height:1.35;

}
.region-section{

background:#0a2f6b;
padding:40px 30px;
border-radius:10px;
margin:40px 0;

}

.region-header{

display:flex;
align-items:center;
gap:14px;
margin-bottom:25px;

}

.region-header h2{

color:#fff;
font-size:26px;
font-weight:700;

}

.region-logo{

height:48px;
width:auto;

}

.region-grid .feed-item{

background:#ffffff;
border-radius:8px;
overflow:hidden;
box-shadow:0 4px 14px rgba(0,0,0,0.15);

}

.region-grid .t{

font-weight:600;

}