/*
Theme Name: Lutz + Achleitner Blocks
Theme URI: https://lutz-achleitner.at/
Author: Lutz + Achleitner
Description: Eigenständiges, blockbasiertes WordPress-Theme ohne Page-Builder-Abhängigkeit.
Version: 1.1.4
Requires at least: 6.6
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: lutz-achleitner
*/

@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url('assets/fonts/mulish-latin.woff2') format('woff2');
}
@font-face {
  font-family: 'Arapey';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/arapey-italic-latin.woff2') format('woff2');
}

:root {
  --la-yellow: #e8b820;
  --la-yellow-dark: #e8ad00;
  --la-gold-text: #8a6500;
  --la-ink: #31333f;
  --la-muted: #6d6f78;
  --la-paper: #ffffff;
  --la-width: 1180px;
}

html { scroll-behavior: smooth; }
body { background: var(--la-paper); color: var(--la-ink); font-family: 'Mulish', sans-serif; }
a { text-underline-offset: .2em; }
:where(a, button, summary, [tabindex]):focus-visible { outline: 3px solid var(--la-ink); outline-offset: 3px; }
.site-header :where(a, button):focus-visible,
.la-contact :where(a, button):focus-visible,
.site-footer :where(a, button):focus-visible { outline-color: var(--la-yellow); }
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(49,51,63,.98); box-shadow: 0 2px 18px rgba(0,0,0,.18); }
.site-header-inner { min-height: 78px; padding: 0 24px; }
.brand-logo img { display: block; width: min(334px, 36vw); height: auto; }
.primary-nav .wp-block-navigation-item__content { color: #fff !important; font-size: .9375rem; font-weight: 600; letter-spacing: 0; text-decoration: none; }
.primary-nav .wp-block-navigation-item__content:hover, .primary-nav .wp-block-navigation-item__content:focus { color: var(--la-yellow) !important; }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--la-ink) !important; color: #fff !important; padding: 32px; }
.wp-block-navigation__responsive-container.is-menu-open a { color: #fff !important; font-size: .9375rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start !important; justify-content: flex-start !important; width: 100%; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
  align-items: flex-start !important;
  justify-content: flex-start !important;
  width: 100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
  align-self: flex-start !important;
  margin-inline: 24px auto !important;
}
.wp-block-navigation__responsive-container-close,
.wp-block-navigation__responsive-container-open { color: #fff; }
.la-map { margin-block-start: 0 !important; line-height: 0; }
.la-map iframe { display: block; width: 100%; height: 440px; border: 0; }
.la-quick-nav {
  box-sizing: border-box;
  position: fixed;
  z-index: 20;
  top: 58%;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 60px;
  padding: 8px 10px;
  background: #fff;
  border-top: 4px solid var(--la-yellow);
  box-shadow: 0 8px 20px rgba(21, 24, 35, .18);
}
.la-quick-nav a {
  display: grid;
  width: 40px;
  height: 38px;
  place-items: center;
  color: var(--la-ink);
  border-bottom: 1px solid #e5e5e5;
}
.la-quick-nav a:last-child { border-bottom: 0; }
.la-quick-nav a:hover,
.la-quick-nav a:focus-visible { color: var(--la-yellow); background: #f6f6f6; }
.la-quick-nav svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s ease; }
.la-screen-reader-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 767px) { .la-quick-nav { display: none; } }
@media (max-width: 599px) {
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open {
    box-sizing: border-box;
    inset: 68px 12px auto auto;
    width: max-content;
    min-width: 0;
    max-width: calc(100vw - 24px);
    height: auto;
    padding: 18px 22px 20px !important;
    border-top: 4px solid var(--la-yellow);
    box-shadow: 0 10px 28px rgba(21, 24, 35, .28);
  }
  .admin-bar .primary-nav .wp-block-navigation__responsive-container.is-menu-open { top: 114px; }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    width: max-content;
    max-width: 100%;
  }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
    margin-top: 0 !important;
  }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    display: none;
  }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    padding-top: 0;
  }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { width: auto; }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 4px !important; }
  .primary-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    width: auto;
    margin: 0 !important;
    padding: 5px 0 !important;
  }
}
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }

.la-hero { min-height: clamp(520px, 72vh, 720px); display: grid; place-items: center; background: linear-gradient(rgba(49,51,63,.88), rgba(49,51,63,.88)), url('/wp-content/uploads/2020/02/Steuerberatung-Lutz-Achleitner.jpg') center/cover no-repeat; }
.la-hero-copy { text-align: center; color: #fff; padding: 80px 24px; }
.la-hero-title { margin: 0; }
.la-hero-line { display: block; margin: 0; font-size: clamp(2.2rem, 4.1vw, 3rem); font-weight: 200; line-height: .8; text-transform: uppercase; }
.la-hero-copy .la-hero-line:last-child { font-weight: 400; }
.la-hero-accent { display: block; margin: .08em 0; color: var(--la-yellow); font-family: 'Arapey', serif; font-size: clamp(3rem, 6.72vw, 4.9rem); font-style: italic; font-weight: 400; line-height: .8; }
.la-cta-wrap { position: relative; z-index: 2; margin-top: -58px !important; padding: 0 24px; }
.la-cta { max-width: 1040px; margin: auto; padding: 28px; background: #fff; border: 8px solid var(--la-yellow); box-shadow: 0 15px 35px rgba(0,0,0,.16); text-align: center; }
.la-cta h2 { margin: 0 0 16px; font-size: 1.3rem; line-height: 1; }
.la-button .wp-block-button__link { padding: 12px 24px; background: var(--la-yellow); border-radius: 0; box-shadow: 0 8px 15px rgba(0,0,0,.14); color: var(--la-ink); font-size: 1.1rem; font-weight: 700; line-height: 1; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.la-button .wp-block-button__link:hover { background: var(--la-yellow-dark); transform: scale(1.045); box-shadow: 0 11px 20px rgba(0,0,0,.2); }

.la-section { padding: clamp(70px, 9vw, 120px) 24px; }
.la-office-photo { min-height: 330px; margin-top: 84px; background: url('/wp-content/uploads/2020/02/Unternehmensgründung-Lutz-Achleitner.jpg') center/cover no-repeat; }
.la-about-card { max-width: 830px; margin: -160px auto 0 !important; padding: clamp(34px, 6vw, 70px); background: #fff; border: 5px solid var(--la-yellow-dark); position: relative; }
.la-about-card img { width: 334px; max-width: 100%; }
.la-about-card p { font-size: 1.1rem; font-weight: 300; line-height: 1.5; }
.la-stats { max-width: var(--la-width); margin: auto; display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.la-stat { text-align: center; }
.la-stat-icon { display: grid; width: 120px; height: 120px; margin: 0 auto 20px; place-items: center; color: #fff; background: var(--la-yellow); border-radius: 50%; transition: transform .2s ease, box-shadow .2s ease; }
.la-stat-icon svg { width: 60px; height: 60px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.la-stat-number { margin: 0; color: var(--la-gold-text); font-size: 5.3125rem; font-weight: 200; line-height: 1; }
.la-stat-label { margin: 0; font-size: .9rem; font-weight: 700; letter-spacing: 5px; line-height: 1.3; text-transform: uppercase; }

.la-person { background: var(--la-ink) url('/wp-content/uploads/2020/02/Stefan-Achleitner-Background-Large.jpg') center/cover no-repeat; color: #fff; }
.la-person-inner { max-width: var(--la-width); margin: auto; display: grid !important; grid-template-columns: minmax(300px, 408px) 1fr; align-items: end; gap: clamp(30px, 6vw, 80px); padding: 70px 24px 155px; }
.la-person-photo img { display: block; width: 100%; }
.la-person-copy { padding-bottom: 54px; }
.la-person-copy h2 { color: var(--la-yellow); font-size: clamp(2rem, 4.1vw, 3rem); font-weight: 200; line-height: 1; }
.la-person-copy p { margin: .55em 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2; }
.la-team { max-width: var(--la-width); margin: auto; display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(300px, 451px); align-items: center; gap: clamp(40px, 7vw, 90px); }
.la-team h2 { color: var(--la-gold-text); font-size: 1.9rem; font-weight: 300; line-height: 1; }
.la-team-copy p { font-size: 1.1rem; font-weight: 300; line-height: 1.2; }
.la-team-badges img { display: block; width: 100%; height: auto; }

.la-services-heading { background: linear-gradient(180deg, var(--la-yellow), var(--la-yellow-dark)); color: var(--la-ink); padding: 72px 24px; }
.la-services-heading h2 { max-width: var(--la-width); margin: auto; font-size: clamp(2rem, 4.1vw, 3rem); font-weight: 300; line-height: 1; }
.la-services { max-width: var(--la-width); margin: auto; display: grid !important; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.la-services-section { padding-bottom: 55px; }
#kunden.la-section { margin-block-start: 0 !important; padding-top: 45px; }
.la-service { border: 1px solid #ddd; border-top: 5px solid var(--la-yellow); background: #fff; box-shadow: 0 8px 24px rgba(49,51,63,.08); transition: transform .22s ease, box-shadow .22s ease; }
.la-service summary { cursor: pointer; padding: 24px; color: var(--la-ink); font-size: 1.18rem; font-weight: 800; transition: color .2s ease, background .2s ease; }
.la-service summary::marker { color: var(--la-yellow-dark); }
.la-service > :not(summary) { margin-left: 24px; margin-right: 24px; }
.la-service ul { padding-left: 1.2rem; }
.la-service li { margin: .55em 0; }

@media (hover: hover) and (pointer: fine) {
  .la-quick-nav a:hover svg { transform: scale(1.16); }
  .la-stat:hover .la-stat-icon { transform: scale(1.1); box-shadow: 0 8px 18px rgba(49,51,63,.2); }
  .la-service:hover { transform: translateY(-4px); box-shadow: 0 14px 32px rgba(49,51,63,.16); }
  .la-service:hover summary { color: var(--la-yellow-dark); background: #fafafa; }
}

.la-clients { max-width: var(--la-width); margin: auto; text-align: center; }
.la-clients-chart { position: relative; width: calc(100% + 28px); max-width: none !important; margin-left: -14px !important; }
.la-clients-chart > figure.wp-block-image { width: 100% !important; max-width: none !important; margin: 0 !important; }
.la-clients img { display: block; width: 100% !important; max-width: none !important; height: auto; }
.la-clients-chart-copy { position: absolute; top: 50%; left: 47.2%; width: 255px; margin: 0 !important; transform: translate(-50%, -50%); }
.la-clients-chart-copy h2 { margin: 0 0 10px; font-size: 2.5rem; font-weight: 500; line-height: 1; }
.la-clients-chart-copy p { margin: 0; font-size: 1.1rem; font-weight: 300; line-height: 1.2; }
.la-clients-list { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; list-style: none; text-align: left; }
.la-clients-list li { position: relative; margin: 0; padding: 12px 12px 12px 34px; border-bottom: 1px solid #e5e5e5; }
.la-clients-list li::before { position: absolute; top: 1.05em; left: 8px; width: 11px; height: 11px; content: ''; background: var(--la-yellow); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 2px var(--la-yellow); }
.la-clients-list strong { display: inline-block; min-width: 48px; color: var(--la-gold-text); }
.la-clients-note { margin-top: 8px; }
.la-email-reveal { color: inherit; font: inherit; font-weight: 700; text-decoration: underline; }
.la-contact { color: #fff; background: linear-gradient(rgba(49,51,63,.9),rgba(49,51,63,.9)), url('/wp-content/uploads/2020/02/Lohnverrechnung.jpg') center/cover no-repeat; }
.la-contact-inner { max-width: var(--la-width); margin: auto; }
.la-contact h2 { color: var(--la-yellow); font-size: clamp(2rem, 3.7vw, 2.7rem); font-weight: 600; line-height: 1; }
.la-contact-grid p { font-size: 1.1rem; font-weight: 300; line-height: 1.2; }
.la-contact-grid { display: grid !important; grid-template-columns: 1fr 1fr; gap: 48px; padding: clamp(32px, 6vw, 70px); background: rgba(232,184,32,.96); color: var(--la-ink); }
.la-contact-grid a { color: var(--la-ink); font-weight: 700; }
.site-footer { padding: 38px 24px; background: #242630; color: #fff; }
.site-footer a { color: #fff; }
.site-footer-inner { max-width: var(--la-width); margin: auto; }

.la-page-main { max-width: 920px; margin: auto; padding: 70px 24px 100px; }
.la-page-main h1 { color: var(--la-ink); font-size: clamp(2.2rem, 5vw, 4rem); }
.la-page-main h2, .la-page-main h3 { margin-top: 1.6em; }
.la-page-main p, .la-page-main li { line-height: 1.7; }
.la-news-grid .wp-block-post-template { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
.la-news-grid .wp-block-post { padding: 28px; border-top: 5px solid var(--la-yellow); box-shadow: 0 8px 24px rgba(49,51,63,.1); }
.la-campaign-archive { margin-top: 32px; }
.la-campaign-archive .display_archive { display: grid; gap: 14px; font: inherit; }
.la-campaign-archive .campaign { padding: 18px 20px; border-left: 5px solid var(--la-yellow); background: #fff; box-shadow: 0 6px 18px rgba(49,51,63,.1); line-height: 1.45; }
.la-campaign-archive .campaign a { margin-left: .45em; color: var(--la-ink); font-weight: 700; }

@media (max-width: 820px) {
  .site-header-inner { min-height: 68px; padding: 0 16px; }
  .brand-logo img { width: min(270px, 67vw); }
  .la-stats { grid-template-columns: repeat(2, 1fr); }
  .la-person-inner { grid-template-columns: 1fr; padding: 50px 24px 60px; }
  .la-person-photo { max-width: 440px; margin: auto; }
  .la-person-copy { padding: 0 0 50px; }
  .la-team { grid-template-columns: 1fr; }
  .la-team-badges { width: min(100%, 477px); margin: auto; }
  .la-services, .la-contact-grid, .la-news-grid .wp-block-post-template { grid-template-columns: 1fr; }
  .la-about-card { margin-top: -90px !important; }
}

@media (max-width: 767px) {
  .la-clients-chart { width: 100%; margin-left: 0 !important; }
  .la-clients-chart > figure { display: none; }
  .la-clients-chart-copy { position: static; width: auto; transform: none; }
  .la-clients-chart-copy h2 { font-size: 2rem; }
  .la-clients-chart-copy p { font-size: 1rem; line-height: 1.55; }
  .la-clients-list { position: static; width: auto; height: auto; margin: 30px auto 0; overflow: visible; clip-path: none; white-space: normal; }
  .la-clients-note { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media (max-width: 480px) {
  .la-hero { min-height: 500px; }
  .la-hero-copy { padding-inline: 16px; }
  .la-cta-wrap { padding: 0 12px; }
  .la-cta { border-width: 5px; padding: 22px 16px; }
  .la-section { padding-inline: 18px; }
  .la-stats { grid-template-columns: 1fr 1fr; gap: 34px 12px; }
  .la-stat-icon { width: 92px; height: 92px; }
  .la-stat-icon svg { width: 48px; height: 48px; }
  .la-stat-label { font-size: .65rem; }
  .la-contact-grid { padding: 30px 22px; }
}