/* Static pages styled after the LMU CMS design (physik.lmu.de/observatory).
   Colours and sizes are taken from the LMU stylesheet; 1rem = 10px. */
@font-face{font-family:"Roboto-regular";src:url(fonts/roboto-v18-latin-regular.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Roboto-regular-italic";src:url(fonts/roboto-v18-latin-italic.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Roboto-bold";src:url(fonts/roboto-v18-latin-700.woff2) format("woff2");font-weight:700;font-display:swap}
:root{--green:#00883a;--green-dark:#005524;--text:#232323;--grey:#626468;--line:#e6e6e7;--light:#f5f5f5}
*{box-sizing:border-box}
html{font-size:62.5%}
body{margin:0;color:var(--text);background:#fff;font-family:"Roboto-regular",sans-serif;font-size:1.6rem;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--green)}
a:hover{color:var(--green-dark)}
:focus-visible{outline:2px dashed var(--green);outline-offset:2px}
.container{max-width:1440px;margin:0 auto;padding:0 calc(100% / 14)}
.skiplink{position:absolute;left:-9999px}
.skiplink:focus{left:8px;top:8px;z-index:1000;background:#fff;padding:8px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Header */
.c-header{background:#fff;box-shadow:0 1px 0 var(--line)}
.header__wrapper{display:flex;align-items:center;gap:30px;min-height:72px;padding:7px 0}
.header__logo-wrapper{flex:0 0 125px}
.header__logo{width:125px}
.header__facilities-title{flex:1 1 auto;max-width:260px;font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:1.2rem;line-height:1.3;text-transform:uppercase}
.main-navigation{margin-left:auto}
.main-navigation ul{display:flex;gap:60px;margin:0;padding:0;list-style:none}
.main-navigation a{color:var(--text);font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:1.6rem;letter-spacing:.3px;text-decoration:none;transition:color .2s ease-in-out}
.main-navigation a:hover{color:var(--green)}

/* Breadcrumb */
.breadcrumb{margin:18px 0 30px;font-size:1.4rem}
.breadcrumb ol{display:flex;flex-wrap:wrap;margin:0;padding:0;list-style:none}
.breadcrumb li+li::before{content:"›";margin:0 8px;color:var(--grey)}
.breadcrumb a{color:var(--grey);text-decoration:none}
.breadcrumb a:hover{color:var(--green)}

h1{margin:0 0 25px;font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:4.2rem;line-height:1.19}
h2{margin:0 0 30px;font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:3rem;line-height:1.25}
h3{margin:0 0 12px;font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:2.2rem;line-height:1.3}

/* Tabs: plain anchors, the sections switch with :target and need no script */
.tabs{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--line);margin-bottom:40px}
.tabs ul{display:flex;flex-wrap:wrap;gap:0 34px;margin:0;padding:0;list-style:none}
.tabs a{display:block;padding:14px 0;margin-bottom:-1px;border-bottom:3px solid transparent;color:var(--text);font-family:"Roboto-bold",sans-serif;font-weight:700;text-decoration:none}
.tabs a:hover{color:var(--green)}
.tab-section{scroll-margin-top:70px}
.tabset:not(:has(.tab-section:target)) .tab-section:not(:first-of-type),.tabset:has(.tab-section:target) .tab-section:not(:target){display:none}
.tabset:not(:has(.tab-section:target)) .tabs li:first-child a,
.tabset:has(#phd-ongoing:target) a[href="#phd-ongoing"],.tabset:has(#phd-finished:target) a[href="#phd-finished"],
.tabset:has(#master:target) a[href="#master"],.tabset:has(#bachelor:target) a[href="#bachelor"],
.tabset:has(#how-to-apply:target) a[href="#how-to-apply"]{color:var(--green);border-bottom-color:var(--green)}

/* Project entries */
.project{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 50px;padding:32px 0;border-top:1px solid var(--line)}
.project:first-of-type{border-top:0;padding-top:0}
.project--no-image{grid-template-columns:minmax(0,1fr)}
.project__text{max-width:80rem}
.project__text p{margin:0 0 14px}
.project__author{font-family:"Roboto-bold",sans-serif;font-weight:700}
.project__thesis a{display:inline-block;padding:6px 18px;border:1px solid var(--green);color:var(--green);font-family:"Roboto-bold",sans-serif;font-weight:700;font-size:1.4rem;text-decoration:none;transition:background-color .2s,color .2s}
.project__thesis a:hover{background:var(--green);color:#fff}
.project__image{align-self:start}

/* How to apply */
.apply{max-width:80rem;margin-bottom:40px}
.apply h3{margin-top:34px}
.apply p{margin:0 0 14px}
.apply ul{margin:0 0 18px;padding-left:22px}
.apply__contacts{padding:0 !important;list-style:none}
.apply__image{max-width:100%;margin-bottom:10px}

/* Footer */
.c-footer{margin-top:80px;padding:50px 0 30px;background:var(--text) url(footer-bg.svg) -45% center no-repeat;background-size:150% 150%;color:#fff}
.footer__headline{margin:0 0 20px;color:#fff;font-size:2rem;letter-spacing:.3px}
.footer__columns{display:flex;flex-wrap:wrap;gap:0 100px;color:#c0c1c3}
.footer__columns address{font-style:normal}
.footer__columns p{margin:0 0 10px}
.footer__columns a{color:#c0c1c3}
.footer__columns a:hover,.footer__nav a:hover{color:#fff}
.footer__nav{margin-top:40px;padding-top:20px;border-top:1px solid var(--grey);font-size:1.4rem}
.footer__nav ul{display:flex;flex-wrap:wrap;gap:8px 30px;margin:0;padding:0;list-style:none}
.footer__nav a{color:#c0c1c3;text-decoration:none}

@media (max-width:899px){
 h1{font-size:3.4rem}
 h2{font-size:2.6rem}
 h3{font-size:2rem}
 .main-navigation ul{gap:24px}
 .project{grid-template-columns:minmax(0,1fr)}
 .project__image{margin-top:12px;max-width:340px}
}
@media (max-width:640px){
 h1{font-size:2.6rem}
 .header__wrapper{flex-wrap:wrap;gap:10px 20px}
 .main-navigation{margin-left:0;width:100%}
 .tabs ul{gap:0 20px}
 .tabs a{font-size:1.4rem;padding:10px 0}
 .tab-section{scroll-margin-top:100px}
}
@media print{.tabs,.c-footer{display:none}.tab-section{display:block !important}}

/* Link lists on overview pages */
.intro{max-width:80rem;margin:0 0 40px;font-size:1.8rem}
.link-section{margin-bottom:40px}
.link-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin:0;padding:0;list-style:none}
.link-list a{display:block;height:100%;padding:20px 24px;border:1px solid var(--line);background:var(--light);color:var(--text);text-decoration:none;transition:border-color .2s,color .2s}
.link-list a:hover{border-color:var(--green);color:var(--green)}
.link-list strong{display:block;font-family:"Roboto-bold",sans-serif;font-size:1.8rem;line-height:1.3}
.link-list span{display:block;margin-top:6px;color:var(--grey);font-size:1.4rem}

/* Group logo in the header, same height as the LMU logo */
.header__group-logo{flex:0 0 auto}
.header__group-logo img{width:130px}
@media (max-width:640px){
 .header__wrapper{gap:10px 12px}
 .header__facilities-title{flex:1 1 0;min-width:0;font-size:1.1rem}
 .header__group-logo{margin-left:auto}
 .header__group-logo img{width:92px}
 .main-navigation{order:3}
}