/* Arztpraxis Thäsler: the look of the old WordPress theme, without the theme.
   Sizes come from the computed styles of the old site at 1440 px and from the
   theme's responsive.css (breakpoints 1279, 1023, 767 and 479 px). */

/* Fonts, self-hosted (SIL OFL, see fonts/OFL-*.txt) */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/poppins-400.43751174b6b8.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/poppins-500.792477d09826.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/poppins-600.b550bca8934b.woff2") format("woff2");
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/poppins-700.0bd523f60499.woff2") format("woff2");
}

@font-face {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/raleway-400.fd35320bf967.woff2") format("woff2");
}

@font-face {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/raleway-600.4fc5e18d5623.woff2") format("woff2");
}

/* Tokens */
:root {
  --c-primary: #51d0f7;
  --c-teal: #307b92;
  --c-accent: #0284a6;
  --c-footer-1: #352219;
  --c-footer-2: #3e3836;
  --c-footer-3: #25211e;
  --c-neutral-1: #eceae6;
  --c-neutral-2: #f3f2f0;
  --c-neutral-3: #cccccc;
  --c-text: #4d3f38;
  --c-menu: #5e4f48;
  --c-footer-main: #424242;
  --c-rule: #dddddd;
  --c-white: #ffffff;
  --font-body: "Poppins", sans-serif;
  --font-head: "Raleway", sans-serif;

  /* Content width (the theme's content_wrap minus its column padding). */
  --wrap: 1180px;
  --gutter: 20px;
  --band: min(100% - 44px, 1294px);

  /* Type scale of the old heading levels. */
  --fs-body: 16.8px;
  --fs-big: 20.16px;
  --fs-small: 15.6px;
  --h1: 72px;
  --h1-lh: 86.4px;
  --h2: 60px;
  --h2-lh: 72px;
  --h3: 43.2px;
  --h3-lh: 51.84px;
  --h4: 36px;
  --h4-lh: 50.4px;
  --h5: 22.28px;
  --h5-lh: 31.57px;
  --h6: 24px;
  --h6-lh: 36px;
  --space: 80px;
}

@media (max-width: 1439px) {
  :root {
    --wrap: 1070px;
  }
}

@media (max-width: 1279px) {
  :root {
    --wrap: 934px;
    --fs-body: 15.6px;
    --fs-big: 18.72px;
    --h1: 36px;
    --h1-lh: 50px;
    --h2: 32px;
    --h2-lh: 45px;
    --h3: 24px;
    --h3-lh: 34px;
    --h4: 20px;
    --h4-lh: 28px;
    --h5: 16px;
    --h5-lh: 22px;
    --h6: 14px;
    --h6-lh: 20px;
  }
}

@media (max-width: 1023px) {
  :root {
    --wrap: 678px;
    --h1: 32px;
    --h1-lh: 46px;
    --h2: 28px;
    --h2-lh: 38px;
    --h3: 22px;
    --h3-lh: 30px;
    --h4: 18px;
    --h4-lh: 26px;
  }
}

@media (max-width: 767px) {
  :root {
    --wrap: 410px;
    --band: calc(100% - 94px);
    --h1: 28px;
    --h1-lh: 36px;
    --h2: 26px;
    --h2-lh: 32px;
    --h3-lh: 28px;
    --h4-lh: 22px;
    --h5-lh: 20px;
    --h6-lh: 18px;
    --space: 30px;
  }
}

@media (max-width: 479px) {
  :root {
    --wrap: 350px;
    --h2: 24px;
    --h2-lh: 32px;
    --h3: 20px;
    --h3-lh: 26px;
    --h4: 17px;
    --h4-lh: 22px;
    --h5: 15px;
    --h5-lh: 20px;
    --h6: 13px;
    --h6-lh: 18px;
  }
}

/* Reset and base */
*,
*::before,
*::after {
  box-sizing: border-box;
}

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

body {
  margin: 0;
  background: var(--c-neutral-2);
  color: var(--c-text);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  font-weight: 400;
  line-height: 30px;
}

img,
svg {
  display: block;
  max-width: 100%;
  height: auto;
}

figure {
  margin: 0;
}

p,
ul {
  margin: 0 0 28.56px;
}

ul {
  padding: 0;
  list-style: none;
}

a {
  color: var(--c-primary);
  overflow-wrap: anywhere;
  text-decoration: none;
}

a:hover,
a:focus-visible {
  color: var(--c-accent);
}

strong {
  color: var(--c-teal);
  font-weight: 700;
}

@media (max-width: 1279px) {
  body {
    line-height: 28px;
  }

  p,
  ul {
    margin-bottom: 1em;
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  color: var(--c-teal);
  font-family: var(--font-head);
  font-weight: 400;
  letter-spacing: -0.3px;
}

h1 {
  font-size: var(--h1);
  line-height: var(--h1-lh);
  letter-spacing: -1.5px;
}

h2 {
  font-size: var(--h2);
  line-height: var(--h2-lh);
}

h3 {
  font-size: var(--h3);
  line-height: var(--h3-lh);
}

h4 {
  font-size: var(--h4);
  line-height: var(--h4-lh);
}

h5,
h6 {
  font-weight: 600;
  letter-spacing: normal;
}

/* The theme drops the negative tracking of headings below 1280 px. */
@media (max-width: 1279px) {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    letter-spacing: 0;
  }
}

/* Page width: everything in main sits in the content column, except the
   full-width slider and heroes. */
main {
  padding-bottom: 90px;
}

main > * {
  width: min(var(--wrap), 100% - 2 * var(--gutter));
  margin-right: auto;
  margin-left: auto;
}

main > h1 {
  margin-top: var(--space);
  margin-bottom: var(--space);
  text-align: center;
}

main > h2 {
  margin-bottom: 50px;
  text-align: center;
}

/* Header */
.site-header {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 25% 50% 25%;
  align-items: center;
  padding: 0 15px;
  background: var(--c-white);
}

.logo {
  justify-self: start;
  padding-left: 15px;
}

.logo img {
  width: 266px;
}

.site-nav {
  justify-self: center;
  padding-left: 16px;
}

.nav-toggle {
  display: none;
}

#site-menu {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}

#site-menu a {
  position: relative;
  z-index: 0;
  display: block;
  padding: calc(3 * var(--fs-body)) 1em;
  color: var(--c-menu);
  font-size: var(--fs-body);
  font-weight: 500;
  letter-spacing: 0.3px;
  line-height: 30px;
  text-transform: uppercase;
}

#site-menu a:hover,
#site-menu a:focus-visible {
  color: var(--c-footer-1);
}

#site-menu a.is-current {
  color: var(--c-menu);
  font-weight: 600;
}

/* The theme marks the current item with a soft dot behind its middle. */
#site-menu a.is-current::before {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 34px;
  height: 34px;
  margin: -17px 0 0 -17px;
  border-radius: 50%;
  background: var(--c-primary);
  content: "";
  opacity: 0.25;
}

.header-contact {
  justify-self: end;
  margin: 0;
  padding-left: 40px;
  background: no-repeat left center / 30px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23307b92' stroke-width='1.2' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11 11 0 0 0 3.6.6 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.3.2 2.5.6 3.6a1 1 0 0 1-.25 1z'/%3E%3Cpath d='M14.5 3.5a6 6 0 0 1 6 6M14.5 7a2.5 2.5 0 0 1 2.5 2.5'/%3E%3C/svg%3E");
  color: var(--c-footer-1);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}

@media (max-width: 1199px) {
  .site-header {
    grid-template-columns: 25% 75%;
  }

  .header-contact {
    display: none;
  }
}

/* Burger menu */
@media (max-width: 1023px) {
  .site-header {
    grid-template-columns: 1fr auto;
    padding: 20px 15px;
  }

  .logo img {
    width: min(250px, 100%);
  }

  .site-nav {
    justify-self: end;
    padding-right: 20px;
  }

  .nav-toggle {
    display: block;
    width: 32px;
    height: 32px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: no-repeat center / 22px
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18M3 12h18M3 18h18' stroke='%23307b92' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
    color: transparent;
    font-size: 0;
    cursor: pointer;
  }

  #site-menu {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    display: none;
    flex-direction: column;
    padding: 20px 0;
    background: var(--c-footer-2);
  }

  #site-menu.is-open {
    display: flex;
  }

  #site-menu a,
  #site-menu a.is-current {
    padding: 8px 30px;
    color: var(--c-white);
  }

  #site-menu a.is-current,
  #site-menu a:hover,
  #site-menu a:focus-visible {
    color: var(--c-primary);
  }

  #site-menu a.is-current::before {
    display: none;
  }
}

/* Slider */
main > .slider,
main > .hero {
  width: 100%;
}

.slider {
  position: relative;
  overflow: hidden;
  aspect-ratio: 1440 / 675;
  background: var(--c-neutral-1);
}

.slider img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.slider img:last-child {
  object-position: center bottom;
}

/* Before the script runs (or without it) the first photo shows. */
.slider:not(.is-ready) img:first-child,
.slider.is-ready img.is-active {
  opacity: 1;
}

@media (max-width: 767px) {
  .slider {
    height: 406px;
    aspect-ratio: auto;
  }
}

/* Opening hours band, pulled up over the slider */
main > .hours {
  position: relative;
  z-index: 1;
  display: grid;
  width: var(--band);
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  margin-top: -66px;
  padding: 20px 20px 25px;
  background: var(--c-primary);
  color: var(--c-footer-1);
  font-size: var(--fs-small);
  line-height: 19px;
  text-align: center;
}

.hours h2 {
  margin-bottom: 10px;
  font-size: var(--h5);
  font-weight: 600;
  letter-spacing: normal;
  line-height: var(--h5-lh);
}

.hours-day {
  display: flex;
  flex-direction: column;
  margin-bottom: 10px;
}

.hours-day strong {
  font-size: var(--fs-small);
  line-height: 19px;
}

.hours-note {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0 1%;
}

/* The theme's white shadow separator above the note. */
.hours-note::before {
  display: block;
  height: 12px;
  margin: 14px 3% 18px;
  background: radial-gradient(
    ellipse 50% 100% at 50% 0,
    rgb(255 255 255 / 70%),
    rgb(255 255 255 / 0%)
  );
  content: "";
}

@media (max-width: 1279px) {
  main > .hours {
    margin-top: -50px;
  }
}

@media (max-width: 767px) {
  main > .hours {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 13px;
    padding: 25px 20px 40px;
    font-size: 15px;
    line-height: 17px;
  }

  .hours h2 {
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
  }

  .hours-day {
    margin-bottom: 10px;
  }

  .hours-day strong {
    font-size: 15px;
    line-height: 17px;
  }
}

/* Home: news and address columns on white */
main:has(.slider) {
  background: var(--c-white);
}

main > .home-columns {
  display: grid;
  width: var(--band);
  grid-template-columns: 2fr 1fr;
  margin-top: 60px;
  padding: 20px;
}

.home-columns p {
  margin-bottom: 20px;
  font-size: var(--fs-big);
  line-height: 30px;
}

.aktuelles h3 {
  margin-bottom: 30px;
}

.closure {
  margin-bottom: 20px;
}

.address {
  align-self: start;
  margin-left: 15px;
  padding-left: 20px;
  border-left: 1px solid var(--c-rule);
}

.address h3 {
  margin-bottom: 30px;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: normal;
  line-height: 36px;
}

@media (max-width: 1279px) {
  .address h3 {
    font-size: 22px;
    line-height: 30px;
  }
}

@media (max-width: 767px) {
  main > .home-columns {
    grid-template-columns: 1fr;
    margin-top: 40px;
    padding: 20px 0;
  }

  .aktuelles h3 {
    text-align: center;
  }

  .address {
    margin: 40px 0 0;
  }

  .address h3 {
    font-size: 16px;
    line-height: 22px;
  }
}

/* Subpage hero */
.hero img {
  width: 100%;
  height: auto;
  aspect-ratio: 1920 / 764;
  object-fit: cover;
}

/* Text pages (Impressum, Datenschutz) start right under the header. */
main:not(:has(.hero, .slider)) {
  padding-top: 0;
}

main:not(:has(.hero, .slider)) > h1 {
  margin-top: -14px;
  margin-bottom: 54px;
}

main:not(:has(.hero, .slider, h2)) > h1 {
  margin-top: -12px;
  margin-bottom: 63px;
  font-size: var(--h2);
  letter-spacing: -0.3px;
  line-height: var(--h2-lh);
  text-align: left;
}

main:not(:has(.hero, .slider)) > h2 {
  margin-top: 93px;
  margin-bottom: 63px;
}

main:not(:has(.hero, .slider)) > h3 {
  margin-top: 52px;
  margin-bottom: 48px;
  line-height: 55px;
}

main:not(:has(.hero, .slider)) li {
  margin: 0;
}

/* The theme closes text pages with a dashed rule. */
main:not(:has(.hero, .slider))::after {
  display: block;
  width: min(var(--wrap), 100% - 2 * var(--gutter));
  margin: 70px auto 0;
  border-top: 1px dashed var(--c-neutral-3);
  content: "";
}

@media (max-width: 1279px) {
  main:not(:has(.hero, .slider)) > h1,
  main:not(:has(.hero, .slider, h2)) > h1 {
    margin-top: 0;
    margin-bottom: 20px;
    letter-spacing: 0;
  }

  main:not(:has(.hero, .slider)) > h2 {
    margin-top: 42px;
    margin-bottom: 24px;
  }

  main:not(:has(.hero, .slider)) > h3 {
    margin-top: 40px;
    margin-bottom: 22px;
    line-height: var(--h3-lh);
  }
}

@media (max-width: 767px) {
  main:not(:has(.hero, .slider)) > h2 {
    margin-top: 30px;
    margin-bottom: 18px;
  }

  main:not(:has(.hero, .slider)) > h3 {
    margin-top: 28px;
    margin-bottom: 18px;
  }
}

/* Wir über uns: team */
main > .team-lead {
  text-align: center;
}

.team-lead img,
.team-pair img {
  margin: 0 auto 10px;
  padding: 6px;
  background: var(--c-white);
  box-shadow: 0 0 5px rgb(0 0 0 / 10%);
}

.team-lead img {
  width: 601px;
}

.team-lead figcaption,
.team-pair figcaption {
  margin-bottom: 170px;
}

.team-lead p,
.team-pair p {
  margin: 10px 0 0;
  font-size: var(--fs-big);
  line-height: 30px;
}

main > .team-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  text-align: center;
}

.team-pair figure {
  padding: 0 30px;
}

.team-pair img {
  width: 470px;
}

.team-pair figcaption {
  margin-bottom: 100px;
}

/* The theme's separator between the team and the rooms. */
.team-pair + h2 {
  padding-top: 100px;
  border-top: 1px solid var(--c-rule);
}

@media (max-width: 1279px) {
  .team-lead figcaption {
    margin-bottom: 90px;
  }
}

main > .rooms {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
}

.rooms img {
  width: 100%;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* The theme's caption card under each room photo. */
.rooms figcaption {
  padding: 45px 10px;
  background: #f9f9f9;
  color: var(--c-teal);
  font-family: var(--font-head);
  font-size: 18px;
  letter-spacing: -0.3px;
  line-height: 22px;
}

@media (max-width: 767px) {
  main > .team-pair,
  main > .rooms {
    grid-template-columns: 1fr;
  }

  .rooms figcaption {
    padding: 35px 10px;
    font-size: 17px;
  }

  .team-lead figcaption,
  .team-pair figcaption {
    margin-bottom: 40px;
  }

  .team-lead p,
  .team-pair p {
    font-size: 16px;
  }

  main > .team-lead,
  .team-pair figure {
    padding: 0 30px;
  }

  /* The old Wir-über-uns page sets every title to 22 px semibold. */
  main:has(.team-lead) > h1,
  main:has(.team-lead) > h2,
  .team-lead h3,
  .team-pair h3 {
    font-size: 22px;
    font-weight: 600;
    line-height: 28px;
  }

  .team-pair + h2 {
    padding-top: 50px;
  }
}

/* Leistungen: service cards with a round outlined icon */
main > .service {
  position: relative;
  width: calc(var(--wrap) / 2 - 15px);
  min-height: 72px;
  margin-bottom: 60px;
  padding-left: 100px;
}

@media (min-width: 768px) {
  main > h1:has(+ .service) {
    margin-top: 60px;
  }

  main > h1:has(+ blockquote) {
    margin-bottom: 60px;
  }
}

.service::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 72px;
  height: 72px;
  border: 1px solid var(--c-primary);
  border-radius: 50%;
  background: no-repeat center / 34px var(--icon);
  content: "";
}

.service:nth-of-type(1) {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2351d0f7' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 3h6M10 3v6l-5 9a2 2 0 0 0 1.8 3h10.4a2 2 0 0 0 1.8-3l-5-9V3M7.5 14h9'/%3E%3C/svg%3E");
}

.service:nth-of-type(2) {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2351d0f7' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7M5 10v10h14V10M10 20v-6h4v6'/%3E%3C/svg%3E");
}

.service:nth-of-type(3) {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2351d0f7' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3v6a4 4 0 0 0 8 0V3M10 13v3a5 5 0 0 0 10 0v-2'/%3E%3Ccircle cx='20' cy='12' r='2'/%3E%3C/svg%3E");
}

.service:nth-of-type(4) {
  --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2351d0f7' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 3h6v3H9zM9 4.5H6V21h12V4.5h-3M9 12l2 2 4-4M9 17h6'/%3E%3C/svg%3E");
}

.service h2 {
  margin-bottom: 25px;
  font-size: var(--h4);
  line-height: var(--h4-lh);
}

.service li {
  margin-bottom: 30px;
  font-size: 18px;
  line-height: 30px;
}

.service li:last-child {
  margin-bottom: 0;
}

main > .service-photos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 35px;
  margin-top: 140px;
}

.service-photos img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

@media (max-width: 1279px) {
  .service li {
    margin-bottom: 28px;
    line-height: 27px;
  }
}

@media (max-width: 1023px) {
  main > .service {
    width: min(var(--wrap), 100% - 2 * var(--gutter));
  }
}

@media (max-width: 767px) {
  main > .service {
    padding: 90px 0 0;
    text-align: center;
  }

  .service::before {
    left: calc(50% - 36px);
  }

  /* The old Leistungen page sets its service titles to 22 px semibold. */
  .service h2 {
    margin-bottom: 20px;
    font-size: 22px;
    font-weight: 600;
  }

  .service li {
    margin-bottom: 25px;
  }

  main > .service-photos {
    grid-template-columns: 1fr;
    margin-top: 60px;
  }
}

/* Kontakt: three centred columns with round outlined icons */
main > .contact-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  text-align: center;
}

.contact-col svg {
  box-sizing: content-box;
  width: 34px;
  height: 34px;
  margin: 0 auto 30px;
  padding: 18px;
  border: 2px solid var(--c-primary);
  border-radius: 50%;
  fill: none;
  stroke: var(--c-primary);
  stroke-linejoin: round;
  stroke-width: 1.2;
}

.contact-col h2 {
  font-size: calc(var(--h6) * 1.2);
  font-weight: 600;
  letter-spacing: normal;
  line-height: calc(var(--h6-lh) * 1.2);
}

.contact-col h2::after {
  content: ":";
}

.contact-col p {
  margin-bottom: 20px;
  font-size: var(--fs-big);
  line-height: 30px;
}

.contact-col a {
  color: inherit;
}

@media (max-width: 767px) {
  main > .contact-cols {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* Anfahrt */
main > blockquote {
  margin-bottom: 30px;
  padding: 84px 135px;
  background: var(--c-primary);
  font-family: var(--font-head);
}

blockquote strong {
  color: var(--c-white);
  font-size: 28.8px;
  font-weight: 600;
  line-height: 43px;
}

main > .accessible {
  display: flex;
  align-items: center;
  gap: 35px;
  margin-bottom: 30px;
  padding-left: 35px;
  color: var(--c-teal);
  font-family: var(--font-head);
  font-size: var(--fs-body);
  letter-spacing: -0.3px;
}

.accessible img {
  flex: none;
  width: 40px;
}

.accessible::after {
  flex: 1;
  border-top: 1px solid var(--c-neutral-1);
  content: "";
}

main > .map {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  min-height: 450px;
  background: var(--c-neutral-1);
}

.map img {
  width: 36px;
}

.map a {
  padding: 10px 24px;
  border-radius: 4px;
  background: var(--c-accent);
  color: var(--c-white);
  font-weight: 500;
}

.map a:hover,
.map a:focus-visible {
  background: var(--c-teal);
  color: var(--c-white);
}

@media (max-width: 767px) {
  main > blockquote {
    padding: 30px 20px;
    text-align: center;
  }

  blockquote strong {
    font-size: 18px;
    line-height: 26px;
  }

  main > .accessible {
    padding-left: 15px;
  }

  .accessible::after {
    display: none;
  }

  main > .map {
    min-height: 300px;
  }
}

/* Footer */
.footer-main {
  padding: 70px 20px 45px;
  background: var(--c-footer-main);
  color: var(--c-white);
  text-align: center;
}

.footer-main img {
  width: 266px;
  margin: 0 auto 30px;
}

.footer-main p {
  margin: 0;
  font-size: var(--fs-big);
  line-height: 30px;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 38px 20px 39px;
  background: var(--c-accent);
}

.footer-links a {
  margin: 0 42px;
  color: var(--c-white);
  line-height: 30px;
  text-transform: uppercase;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  color: var(--c-neutral-2);
}

/* The theme sets the current footer item in semibold, off-white. */
.footer-links a.is-current {
  color: var(--c-neutral-2);
  font-weight: 600;
}

@media (max-width: 767px) {
  .footer-main {
    padding: 60px 45px 30px;
  }

  .footer-main img {
    margin: 0 auto 25px;
    padding: 28px 0;
    border-top: 1px solid rgb(0 0 0 / 15%);
    border-bottom: 1px solid rgb(0 0 0 / 15%);
    box-sizing: content-box;
  }

  .footer-main p {
    font-size: 20px;
    line-height: 28px;
  }

  .footer-links {
    padding: 15px 20px 18px;
    row-gap: 10px;
  }

  .footer-links a {
    margin: 0 12px;
    font-size: 13px;
  }
}

/* Reduced motion: the slider stays on its first photo, nothing fades. */
@media (prefers-reduced-motion: reduce) {
  .slider img {
    transition: none;
  }
}