/* Notarstelle Wertingen – Übergangsseite
   Farben und Typo aus dem DEV-Projekt (site/templates/css/_variables.scss) */

@font-face{font-family:'Gelasio';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/gelasio-v10-latin-regular.woff2') format('woff2');}
@font-face{font-family:'Gelasio';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/gelasio-v10-latin-600.woff2') format('woff2');}
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/roboto-v30-latin-regular.woff2') format('woff2');}
@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/roboto-v30-latin-500.woff2') format('woff2');}

:root{
  --primary:#064265;
  --accent:#D94932;
  --text:#3C3C3B;
  --light:#e5ebef;
  --line:#d3dde4;
  --bg:#fff;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:'Roboto',system-ui,sans-serif;
  font-size:1.0625rem;
  line-height:1.75;
}

/* Eine gemeinsame Spalte für Kopf, Inhalt und Fuß -> durchgehend
   bündige linke Kante. */
.wrap{width:100%;max-width:85rem;margin:0 auto;padding:0 2rem;}

/* ---------- Kopf ---------- */

header.site{
  background:var(--bg);
  color:var(--text);
  padding:3rem 0 2.5rem;
  border-bottom:1px solid var(--line);
  text-align:left;
}
header.site .name{
  font-family:'Gelasio',Georgia,serif;
  font-size:clamp(1.65rem,4.5vw,2.4rem);
  font-weight:600;
  line-height:1.25;
  letter-spacing:.01em;
  color:var(--primary);
  margin:0;
}
header.site .sub{
  margin:.5rem 0 0;
  font-size:1.0625rem;
  color:var(--text);
}

/* ---------- Inhalt ---------- */

main{padding:4.5rem 0 5rem;}

h1,h2,h3,.pagetitle{font-family:'Gelasio',Georgia,serif;color:var(--primary);font-weight:600;line-height:1.35;}

.pagetitle{
  font-size:clamp(1.6rem,3.4vw,2.15rem);
  margin:0 0 2rem;
}
.pagetitle::after{
  content:"";
  display:block;
  width:4.5rem;
  height:3px;
  background:var(--accent);
  margin-top:1.25rem;
}

h2{font-size:1.35rem;margin:3.5rem 0 1rem;}
h3{font-size:1.0625rem;margin:2rem 0 .5rem;}

p{margin:0 0 1.35rem;}
a{color:var(--primary);text-decoration-thickness:1px;text-underline-offset:.18em;}
a:hover{color:var(--accent);}

.lead{
  font-size:1.2rem;
  line-height:1.65;
  color:var(--primary);
}

/* ---------- Kontaktbox ---------- */

.card{
  background:var(--light);
  padding:2rem 2.25rem 2.25rem;
  margin:3rem 0;
}
.card h2{margin-top:0;font-size:1.2rem;}

dl.kontakt{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.5rem 2.5rem;}
dl.kontakt dt{font-weight:500;color:var(--primary);}
dl.kontakt dd{margin:0;}

/* ---------- Öffnungszeiten ---------- */

table.zeiten{border-collapse:collapse;width:100%;max-width:34rem;margin:1rem 0 0;}
table.zeiten th,table.zeiten td{
  text-align:left;
  padding:.4rem 0;
  vertical-align:top;
}
table.zeiten th{font-weight:500;white-space:nowrap;padding-right:2.5rem;color:var(--primary);}

.hinweis{
  margin-top:1.5rem;
  padding-left:1rem;
  border-left:3px solid var(--accent);
}

hr{border:0;border-top:1px solid var(--line);margin:4rem 0;}

/* ---------- Rechtsseiten ---------- */

main ul{padding-left:1.25rem;margin:0 0 1.35rem;}
main ul li{margin-bottom:.6rem;}
.versal{font-size:.9rem;line-height:1.6;}

.back{
  display:inline-block;
  margin-top:3rem;
  font-weight:500;
  text-decoration:none;
  border-bottom:2px solid var(--accent);
  padding-bottom:.15rem;
}
.back:hover{color:var(--accent);}

/* ---------- Fuß ---------- */

footer.site{
  background:var(--primary);
  color:#fff;
  padding:2.5rem 0;
  font-size:.95rem;
}
footer.site nav a{
  margin-right:2rem;
  display:inline-block;
  color:#fff;
}
footer.site nav a:hover{color:#fff;text-decoration:none;}

/* ---------- Schmale Viewports ---------- */

@media (max-width:768px){
  body{font-size:1rem;}
  .wrap{padding:0 1.25rem;}
  header.site{padding:2.25rem 0 2rem;}
  main{padding:3rem 0 3.5rem;}
  .card{padding:1.5rem 1.5rem 1.75rem;margin:2.25rem 0;}
  h2{margin-top:2.5rem;}
}

@media (max-width:480px){
  dl.kontakt{grid-template-columns:1fr;gap:0;}
  dl.kontakt dd{margin-bottom:.65rem;}
  table.zeiten th{white-space:normal;padding-right:1.25rem;}
}
