/* =========================================================
   public/assects/css/frame.css — Oldschool háttércsíkok, 978-as gerinc, banner,
               breadcrumb, kezdőlap dobozok, notice
   ========================================================= */

/* Háttércsíkok — top/bottom, középre igazítva */
body{
  background-color:var(--bg-page);
}

/* 978-as gerinc */
.container,
.header-main,
.breadcrumb-container,
.page-frame{
  max-width:978px;
  margin:0 auto;
  box-sizing:border-box;
  padding:0 0; /* a belső padding a komponenseknél */
}

/* Fehér „tányér” */
.page-frame{
  background:#fff;
  border:1px solid #bababa;
  border-radius:0 10px 0 10px;
  box-shadow:0 2px 5px rgba(0,0,0,.06);
  padding:18px;
  margin:10px auto 28px;
}
/* Ha a main nem kap .page-frame-et */
body:not(.admin) main:not(.page-frame){
  background:#fff; border:1px solid #bababa; border-radius:0 10px 0 10px;
  box-shadow:0 2px 5px rgba(0,0,0,.06);
  padding:18px; margin:10px auto 28px; max-width:978px;
}

/* Banner */
.banner-frame{
  background:#fff; border:1px solid #d4d4d4; border-radius:10px;
  padding:10px; margin:14px 0 24px; box-shadow:0 2px 5px rgba(0,0,0,.06);
}
.banner-frame img{ display:block; width:100%; height:auto; border-radius:6px; }

/* Breadcrumb */
.breadcrumb-container{ background:#f7f7f7; border:1px solid #ddd; border-radius:4px; padding:.5rem 1rem; }
.breadcrumb{ list-style:none; margin:0; padding:0; display:flex; gap:.4rem; flex-wrap:wrap; color:#666; }
.breadcrumb li::after{ content:"›"; margin-left:.4rem; color:#aaa; }
.breadcrumb li:last-child::after{ content:""; }
.breadcrumb li a{ color:var(--brand-maroon); }
.breadcrumb .active{ font-weight:bold; color:#000; }

/* Kezdőlap dobozok */
.boxes{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:24px;
  padding:0px 0px 15px 0px; margin:0;
  align-items:stretch;
}
.box{
  background:#f6f6f6; border:1px solid #bababa;
  border-radius:0 10px 0 10px; box-shadow:0 2px 5px rgba(0,0,0,.12);
  padding:1.25rem;
}
.box h3{
  /* a teljes doboz tetején fehér csík */
  background:#fff;
  margin:-1.25rem -1.25rem 12px;   /* kiterjesztjük a box padding fölé */
  padding:12px 16px;
  border-top-left-radius:inherit;
  border-top-right-radius:inherit;
  border-bottom:1px solid #ececec;
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.04);
  font-family:var(--font-head);
  font-size:1rem;
  text-transform:uppercase;
  letter-spacing:.2px;
  color:var(--brand-maroon);
}

/* === Box lista: „honlapszürke” háttér, piros kis nyíl, dots === */
.box ul{
  list-style:none;
  margin:0;
  padding:0 16px 4px 16px;         /* belső levegő a lista körül */
  background:var(--bg-page);       /* ugyanaz a háttér, mint az oldalé */
  border-bottom-left-radius:inherit;
  border-bottom-right-radius:inherit;
}
.box ul li{
  position:relative;
  line-height:28px;
  border-bottom:1px dotted #d4d4d4;
}
.box ul li:last-child{ border-bottom:none; }

.box ul li a{
  display:block;
  padding-left:22px;               /* hely a nyílnak */
  color:#333;
  text-decoration:none;
  transition:color .15s ease, transform .15s ease;
}

/* bal oldali nyíl (gif), kicsi lendülés hoverre */
.box ul li a::before{
  content:"";
  position:absolute; left:0; top:50%;
  width:12px; height:12px;
  transform:translateY(-50%) translateX(0);
  background:url("../../storage/site/arrow.gif") no-repeat center/12px 12px;
  opacity:.95;
  transition:transform .15s ease;
}

.box ul li a:hover{
  color:var(--brand-maroon);
}
.box ul li a:hover::before{
  transform:translateY(-50%) translateX(3px);
}

/* Közlemény */
.notice{
  background:#fff; border:1px solid #e5e5e5; border-radius:8px;
  padding:16px 20px; margin:24px 0; box-shadow:0 2px 5px rgba(0,0,0,.05);
}
.notice h2{ margin:0 0 10px; font-family:var(--font-head); color:#003366; text-transform:uppercase; }

/* Reszponzív lépcsők */
@media (max-width:1100px){
  .boxes{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:640px){
  .boxes{ grid-template-columns:1fr; }
}

/* Tartalmi linkek – bordó a belső területen */
.page-frame a,
.page-layout article a,
.news-section a{
  color:var(--brand-maroon);
}
.page-frame a:hover,
.page-layout article a:hover,
.news-section a:hover{ text-decoration:underline; }


/* ===== Mobil oldalpaddings és „fehér tányér” igazítás ===== */
@media (max-width: 768px){
  .container,
  .header-main,
  .breadcrumb-container,
  .page-frame{
    padding-left: 12px;
    padding-right: 12px;
  }

  .page-frame{
    padding: 14px;
    margin: 8px auto 20px;
  }

  /* A .box címcsík negatív margója igazodjon a mobil paddinghez */
  .box{ padding: 14px; }
  .box h3{
    margin: -14px -14px 12px;   /* összhangban a .box paddinggal */
    padding: 10px 12px;
  }
}

/* ===== Box-grid: 1 oszlop inkább 768 alatt ===== */
@media (max-width: 768px){
  .boxes{ grid-template-columns: 1fr; }
}