/* =========================================================================
   2026 Summer School · University of Pécs — site styles
   Palette + typography match the printed programme / poster / booklet.
   ========================================================================= */
:root{
  --green:#1c4a33; --green-dk:#12301f; --gold:#9c7a3c; --gold-lt:#c4a560;
  --ink:#222222; --muted:#6e6e6e; --ivory:#fbfaf6; --sand:#f1ede2;
  --rule:#d9cfc2; --white:#ffffff;
  --serif:"Times New Roman", Times, Georgia, serif;
  --maxw:1140px; --radius:6px; --shadow:0 6px 24px rgba(18,48,31,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--serif); color:var(--ink); background:var(--ivory);
  line-height:1.6; font-size:18px; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
a{color:var(--green); text-decoration:none}
a:hover{color:var(--gold)}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
h1,h2,h3,h4{font-family:var(--serif); color:var(--green); line-height:1.15; margin:0 0 .4em}
h2{font-size:2rem} h3{font-size:1.35rem}
p{margin:0 0 1em}
.kicker{font-size:.82rem; letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  font-weight:bold; margin:0 0 .5em}
.center{text-align:center}
.muted{color:var(--muted)}
.rule{height:1px;background:var(--gold);border:0;width:64px;margin:.6em 0}
.center .rule{margin-left:auto;margin-right:auto}

/* ---------- buttons ---------- */
.btn{display:inline-block; font-family:var(--serif); font-size:1rem; letter-spacing:.02em;
  padding:.7em 1.5em; border-radius:var(--radius); border:1px solid var(--green);
  background:var(--green); color:var(--ivory); cursor:pointer; transition:.18s}
.btn:hover{background:var(--green-dk); color:var(--ivory)}
.btn.alt{background:transparent; color:var(--green)}
.btn.alt:hover{background:var(--green); color:var(--ivory)}
.btn.gold{background:var(--gold); border-color:var(--gold)}
.btn.gold:hover{background:#856733; border-color:#856733; color:var(--ivory)}

/* ---------- header / nav ---------- */
.site-header{position:sticky; top:0; z-index:50; background:rgba(251,250,246,.96);
  backdrop-filter:saturate(140%) blur(6px); border-bottom:1px solid var(--rule)}
.header-inner{display:flex; align-items:center; justify-content:space-between; min-height:74px; gap:16px}
.brand{display:flex; align-items:center; gap:12px; color:var(--green)}
.brand-logo{height:46px; width:auto}
.brand-text{font-weight:bold; font-size:1.05rem; letter-spacing:.02em; color:var(--green)}
.site-nav{display:flex; align-items:center; gap:26px}
.site-nav a{font-size:1.02rem; color:var(--ink); position:relative; padding:6px 0}
.site-nav a:hover{color:var(--gold)}
.site-nav a.active{color:var(--green)}
.site-nav a.active::after{content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--gold)}
.site-nav a.btn-nav{color:var(--ivory); background:var(--green); padding:.5em 1.1em; border-radius:var(--radius)}
.site-nav a.btn-nav:hover{background:var(--green-dk); color:var(--ivory)}
.site-nav a.btn-nav.active::after{display:none}
.nav-toggle{display:none; flex-direction:column; justify-content:center; gap:5px; width:44px; height:40px;
  background:none; border:1px solid var(--rule); border-radius:var(--radius); cursor:pointer}
.nav-toggle span{display:block; height:2px; width:22px; margin:0 auto; background:var(--green); transition:.2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero ---------- */
.hero{position:relative; color:var(--ivory); text-align:center;
  background:linear-gradient(rgba(18,48,31,.62),rgba(18,48,31,.72)), var(--hero,none) center/cover no-repeat;
  padding:110px 24px 92px}
.hero h1{color:var(--ivory); font-size:clamp(2.6rem,7vw,4.6rem); margin:.15em 0}
.hero .kicker{color:var(--gold-lt)}
.hero .lede{font-size:clamp(1.1rem,2.4vw,1.5rem); font-style:italic; color:var(--ivory); margin:.2em 0 .1em}
.hero .meta{font-size:1.05rem; letter-spacing:.04em; margin:1.1em 0 1.6em; color:#eef3ee}
.hero .meta b{color:var(--gold-lt)}
.hero .btns{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}
.hero .btn.alt{color:var(--ivory); border-color:var(--gold-lt)}
.hero .btn.alt:hover{background:var(--gold-lt); color:var(--green-dk)}

/* ---------- fact strip ---------- */
.factstrip{background:var(--green); color:var(--ivory)}
.factstrip .wrap{display:flex; flex-wrap:wrap; gap:8px 40px; justify-content:center; padding:18px 24px}
.factstrip .fs{display:flex; align-items:baseline; gap:10px}
.factstrip .fs .l{font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt)}
.factstrip .fs .v{font-size:1.05rem}

/* ---------- sections ---------- */
section{padding:64px 0}
section.alt{background:var(--white)}
.section-head{max-width:760px; margin:0 auto 34px}
.section-head.center{text-align:center}
.lead{font-size:1.12rem}

/* ---------- grids / cards ---------- */
.grid{display:grid; gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--white); border:1px solid var(--rule); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow)}
.card h3{margin-bottom:.15em}
.speaker .role{color:var(--gold); font-size:.86rem; letter-spacing:.04em; text-transform:uppercase; margin:0 0 .3em}
.speaker .aff{color:var(--muted); font-style:italic; font-size:.96rem; margin:0 0 .5em}
.speaker .talk{font-size:1rem}

/* day glance */
.daycard{display:block; background:var(--white); border:1px solid var(--rule); border-radius:var(--radius);
  padding:20px; box-shadow:var(--shadow); transition:.18s}
.daycard:hover{transform:translateY(-3px); border-color:var(--gold-lt)}
.daycard .d{font-size:.78rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold)}
.daycard .dt{font-size:1.2rem; color:var(--green); font-weight:bold; margin:.2em 0 .5em}
.daycard .cnt{color:var(--muted); font-size:.95rem}

/* downloads */
.dl{display:flex; gap:14px; align-items:flex-start; background:var(--white); border:1px solid var(--rule);
  border-radius:var(--radius); padding:18px 20px; box-shadow:var(--shadow); transition:.18s}
.dl:hover{border-color:var(--gold-lt); transform:translateY(-2px)}
.dl .ic{flex:0 0 auto; width:40px; height:40px; border-radius:6px; background:var(--sand);
  display:flex; align-items:center; justify-content:center; color:var(--gold); font-size:.7rem;
  font-weight:bold; letter-spacing:.06em; border:1px solid var(--rule)}
.dl .t{font-weight:bold; color:var(--green)}
.dl .s{color:var(--muted); font-size:.92rem; margin:.15em 0 0}

/* ---------- programme ---------- */
.day{margin:0 0 40px}
.day .dhead{border-bottom:2px solid var(--gold); padding-bottom:8px; margin-bottom:6px}
.day .dhead .d{font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.day .dhead h3{margin:.15em 0 0; font-size:1.5rem}
.row{display:grid; grid-template-columns:88px 1fr; gap:16px; padding:14px 4px; border-bottom:1px solid var(--rule)}
.row .time{font-weight:bold; color:var(--green)}
.row .who{font-weight:bold}
.row .tag{display:inline-block; font-size:.66rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold); margin-left:.5em; vertical-align:middle}
.row .ti{font-style:italic; color:var(--ink); margin-top:2px}
.row.break{background:var(--sand); border-radius:var(--radius); border-bottom:1px solid var(--rule)}
.row.break .lbl{grid-column:1 / -1; text-align:center; letter-spacing:.16em; text-transform:uppercase;
  color:var(--muted); font-style:italic; font-size:.9rem}

/* ---------- abstracts ---------- */
.searchbar{display:flex; gap:12px; align-items:center; margin:0 0 26px}
.searchbar input{flex:1; font-family:var(--serif); font-size:1rem; padding:.7em 1em;
  border:1px solid var(--rule); border-radius:var(--radius); background:var(--white)}
.abs-group h3.gh{font-size:1.4rem; border-bottom:2px solid var(--gold); padding-bottom:6px; margin:30px 0 20px}
.abstract{padding:0 0 22px; margin:0 0 22px; border-bottom:1px solid var(--rule)}
.abstract .at{font-size:1.2rem; color:var(--green-dk); font-weight:bold; margin:0 0 .2em}
.abstract .an{font-weight:bold; margin:0 0 .1em}
.abstract .aa{color:var(--muted); font-style:italic; font-size:.95rem; margin:0 0 .6em}
.abstract .kw{font-size:.92rem; color:var(--muted); font-style:italic; margin:.5em 0 0}
.abstract .kw b{color:var(--gold); font-style:italic}
.nomatch{color:var(--muted); font-style:italic}

/* ---------- travel ---------- */
.figure{margin:0 0 8px; border:1px solid var(--gold); border-radius:var(--radius); overflow:hidden}
.figure img{width:100%; height:100%; object-fit:cover; display:block}
figcaption{color:var(--muted); font-style:italic; font-size:.9rem; text-align:center; margin:8px 0 0}
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.optcard{display:grid; grid-template-columns:52px 1fr auto; gap:16px; align-items:center;
  background:var(--sand); border-radius:var(--radius); padding:18px 22px; margin:0 0 16px}
.optcard .num{font-size:1.8rem; font-weight:bold; color:var(--gold)}
.optcard h4{margin:0 0 .2em; color:var(--green); font-size:1.15rem}
.optcard p{margin:0; font-size:.98rem; color:var(--ink)}
.optcard .price{text-align:right; color:var(--green); font-weight:bold; white-space:nowrap}
.optcard .price small{display:block; color:var(--muted); font-weight:normal; font-style:italic}
.panel{background:var(--sand); border-radius:var(--radius); padding:24px 26px}
.deflist{display:grid; grid-template-columns:190px 1fr; gap:10px 18px; margin:0}
.deflist dt{color:var(--green); font-weight:bold}
.deflist dd{margin:0; color:var(--ink)}
.sight{padding:14px 0; border-bottom:1px solid var(--rule)}
.sight h4{margin:0 0 .15em; color:var(--green); font-size:1.15rem}
.sight p{margin:0; color:var(--ink)}

/* ---------- forms (Netlify) ---------- */
.form{display:grid; gap:16px; max-width:640px}
.form label{font-weight:bold; color:var(--green); display:block; margin-bottom:6px}
.form input, .form select, .form textarea{width:100%; font-family:var(--serif); font-size:1rem;
  padding:.7em .9em; border:1px solid var(--rule); border-radius:var(--radius); background:var(--white)}
.form textarea{min-height:130px; resize:vertical}
.hp{position:absolute; left:-9999px}

/* ---------- teaser ---------- */
.teaser{display:grid; grid-template-columns:1.1fr 1fr; gap:34px; align-items:center}
.teaser .figure{margin:0}

/* ---------- footer ---------- */
.site-footer{background:var(--green-dk); color:#d7e2da; padding:52px 0 30px; margin-top:20px}
.site-footer a{color:var(--gold-lt)}
.site-footer a:hover{color:var(--ivory)}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:34px}
.site-footer h4{color:var(--ivory); font-size:1.05rem; letter-spacing:.02em}
.site-footer .brand-text{color:var(--ivory)}
.site-footer ul{list-style:none; padding:0; margin:0}
.site-footer li{margin:.35em 0}
.foot-bottom{border-top:1px solid #2c5a44; margin-top:30px; padding-top:18px; font-size:.85rem;
  color:#a9c0b3; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .teaser{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .nav-toggle{display:flex}
  .site-nav{position:absolute; top:74px; left:0; right:0; flex-direction:column; align-items:stretch;
    gap:0; background:var(--ivory); border-bottom:1px solid var(--rule); padding:8px 24px 18px;
    box-shadow:var(--shadow); display:none}
  .site-nav.open{display:flex}
  .site-nav a{padding:13px 4px; border-bottom:1px solid var(--rule)}
  .site-nav a.active::after{display:none}
  .site-nav a.btn-nav{margin-top:12px; text-align:center; border-bottom:none}
}
@media (max-width:640px){
  body{font-size:17px}
  section{padding:48px 0}
  .g2,.g3,.g4,.gallery{grid-template-columns:1fr}
  .deflist{grid-template-columns:1fr}
  .deflist dt{margin-top:.4em}
  .optcard{grid-template-columns:40px 1fr; }
  .optcard .price{grid-column:2; text-align:left}
  .foot-grid{grid-template-columns:1fr}
  .row{grid-template-columns:70px 1fr; gap:12px}
  .brand-text{font-size:.95rem}
}