/*
	Theme Name: radoBAU
	Author: Daniel Schmitzer (daschmi@daschmi.de)
	Version: 1.0
	Text Domain: radoBAU
*/

@import "group.css";
@import "columns.scss";

:root {
	--color-brand:#af4220;
	--color-dark:#000000;
	--color-text-dark:#3b3b33;
	--color-light-1:#f8f8f3;
	--color-light-2:#edede2;
	--header-height:0px;
}

@font-face { font-family:"Trakya Sans"; src:url("assets/fonts/trakya-sans-900-bold.ttf") format("truetype"); font-weight:900; font-style:normal; font-display:swap; }

* { margin:0; padding:0; box-sizing:border-box; }
img { max-width:100%; height:auto; }

html { overflow-y:scroll; scrollbar-gutter:stable; scrollbar-width:auto; scrollbar-color:var(--color-brand) var(--color-light-2); }
html::-webkit-scrollbar { width:16px; }
html::-webkit-scrollbar-track { background:var(--color-light-2); }
html::-webkit-scrollbar-thumb { background:var(--color-brand); border-radius:6px; border:3px solid var(--color-light-2); }
html::-webkit-scrollbar-thumb:hover { background:var(--color-text-dark); }

body, html { scroll-behavior:smooth; font-family:"Funnel Sans", system-ui, sans-serif; font-weight:400; }
body { background-color:#1c1c1c; color:#FFFFFF; }

.page_wrap { margin-left:auto; margin-right:auto; max-width:1600px; }

section#hero { position:relative; line-height:0;
	.img_wrap > img { width:100%; height:auto; object-fit:cover; object-position:center center; }
}

section#hero.hero--compact .img_wrap > img { height:min(300px, 20vh); }

section#hero.hero--compact::after { content:""; position:absolute; inset:0; background:rgba(0,0,0,.35); pointer-events:none; }

.hero-content--compact { position:absolute; inset:0; z-index:1;
	& .hero-content--compact__inner { height:100%; padding:0 1.5rem; display:flex; flex-direction:column; justify-content:center; gap:.4rem; }
	& h1 { font-size:1.4rem; font-weight:900; color:#fff; line-height:1.2; margin-bottom:0; text-shadow:0 1px 4px rgba(0,0,0,.4); }
	& p { font-size:1rem; color:rgba(255,255,255,.9); margin-bottom:0; text-shadow:0 1px 4px rgba(0,0,0,.4); }
}

.hero-content { position:absolute; bottom:3rem; left:50%; transform:translateX(-50%); width:90%; max-width:600px; z-index:10; text-align:left; opacity:0; animation:heroContentIn .7s ease .35s forwards; background:rgba(59,59,51,.72); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-radius:12px; padding:1.75rem; color:#fff; line-height:normal;
	& h1, & h2 { font-size:1.6rem; font-weight:900; color:#fff; line-height:1.2; margin-bottom:.9rem; }
	& p { font-size:.95rem; color:rgba(255,255,255,.88); line-height:1.6; margin-bottom:1rem;
		&:last-child { margin-bottom:0; }
	}
	& p:last-child { margin-bottom:0; }
	& a { display:inline-block; padding:.9rem 2rem; background:var(--color-brand); color:#fff; text-decoration:none; font-size:1rem; font-weight:700; letter-spacing:.03em; transition:background .25s; margin-top:.5rem; }
	& a:hover { background:var(--color-light-1); color:var(--color-dark); }
}

.scroll-down-arrow { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:5px; text-decoration:none; z-index:5; opacity:0; animation:heroScrollFadeIn 1.2s ease .8s forwards, heroScrollBounce 1.8s ease-in-out 2s infinite;
	& .scroll-down-arrow__chevron { display:block; width:20px; height:20px; border-right:2px solid rgba(255,255,255,.75); border-bottom:2px solid rgba(255,255,255,.75); transform:rotate(45deg); transition:border-color .2s; }
	&:hover .scroll-down-arrow__chevron { border-color:#fff; }
}

#back-to-top { position:fixed; bottom:32px; right:32px; display:flex; flex-direction:column; align-items:center; gap:5px; text-decoration:none; z-index:100; opacity:0; pointer-events:none; transition:opacity .4s ease;
	& .back-to-top__chevron { display:block; width:20px; height:20px; border-right:2px solid rgba(255,255,255,.75); border-bottom:2px solid rgba(255,255,255,.75); transform:rotate(-135deg); transition:border-color .2s; }
	&:hover .back-to-top__chevron { border-color:#fff; }
}
#back-to-top.is-visible { opacity:1; pointer-events:auto; }

@keyframes heroContentIn {
	from { opacity:0; transform:translateX(-50%) translateY(20px); }
	to { opacity:1; transform:translateX(-50%) translateY(0); }
}

@keyframes heroScrollFadeIn {
	from { opacity:0; transform:translateX(-50%) translateY(6px); }
	to { opacity:1; transform:translateX(-50%) translateY(0); }
}

@keyframes heroScrollBounce {
	0%, 100% { transform:translateX(-50%) translateY(0); }
	50% { transform:translateX(-50%) translateY(10px); }
}

@keyframes statusPulse {
	0%, 100% { opacity:1; }
	50% { opacity:.35; }
}

main {
	ul, ol,
	p { margin-bottom:1rem; line-height:160%; font-size:1rem; 
		&:last-child { margin-bottom:0; }
	}
	ul, ol { margin-left:1.5rem; }
	h3 { margin-bottom:1rem; margin-top:0; }
	a { color:inherit; }
}

h1, h2, h3 { font-family:"Trakya Sans", "Funnel Sans", system-ui, sans-serif; font-weight:900; }
h1, h2 { font-size:1.5rem; line-height:125%; margin-bottom:1rem; word-break:break-word; }

.gap-y-default { gap:2rem; display:flex; flex-direction:column; } 

hr { margin-top:2rem; margin-bottom:2rem; border:1px solid black !important; }
.padding-y-default { padding-top:2rem; padding-bottom:2rem; }
.padding-x-default { padding-left:2rem; padding-right:2rem; }
.margin-y-default { margin-top:2rem; margin-bottom:2rem; }

#site-header { position:sticky; top:0; z-index:50; background:var(--color-light-1); color:var(--color-text-dark);
	& .icon { width:15px; height:15px; flex:none; display:block; }
	& .site-header__topbar { background:var(--color-light-2); font-size:.8rem; }
	& .site-header__topbar-inner { display:flex; align-items:center; gap:.5rem; padding:.6rem 1.5rem; }
	& .site-header__contact { display:none;
		& li { display:flex; align-items:center; gap:.4rem; }
	}
	& .site-header__contact a { color:inherit; text-decoration:none; display:flex; align-items:center; gap:.4rem; }
	& .site-header__contact a:hover { color:var(--color-dark); }
	& .site-header__topbar-right { display:flex; align-items:center; justify-content:space-between; gap:1.2rem; flex:1; }
	& .site-header__hours { display:flex; align-items:center; gap:.4rem; font-weight:500; }
	& .site-header__hours-label--short { display:none; }
	& .site-header__status { display:flex; align-items:center; gap:.35rem; font-weight:700; }
	& .site-header__status-dot { width:8px; height:8px; border-radius:50%; background:currentColor; flex:none; }
	& .site-header__status.is-open { color:#2e7d32; }
	& .site-header__status.is-closed { color:var(--color-brand); }
	& .site-header__status.is-open .site-header__status-dot { animation:statusPulse 1.8s ease-in-out infinite; }
	& .site-header__social { list-style:none; display:flex; gap:.9rem; }
	& .site-header__social a { color:inherit; display:flex; }
	& .site-header__social a:hover { color:var(--color-dark); }
	& .site-header__main-inner { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.5rem; }
	& .site-header__logo { display:block; }
	& .site-header__logo img { height:32px; width:auto; display:block; }
	& .site-header__nav { display:none; }
	& .site-header__nav ul { list-style:none; display:flex; flex-direction:column; gap:1.5rem; }
	& .site-header__nav ul li a { color:var(--color-text-dark); text-decoration:none; font-size:1.1rem; font-weight:500; }
	& .site-header__nav ul li a:hover { color:var(--color-dark); }
	& .site-header__nav ul li.menu-item-has-children { display:flex; flex-wrap:wrap; align-items:center; }
	& .site-header__nav ul li.menu-item-has-children > a { flex:1; }
	& .site-header__nav .sub-menu-toggle { display:flex; align-items:center; justify-content:center; width:1.8rem; height:1.8rem; flex:none; background:none; border:none; padding:0; margin:0; cursor:pointer; color:inherit; }
	& .site-header__nav .sub-menu-toggle__chevron { display:block; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); transition:transform .2s ease; }
	& .site-header__nav li.menu-item-has-children.is-open > .sub-menu-toggle .sub-menu-toggle__chevron { transform:rotate(-135deg); }
	& .site-header__nav ul.sub-menu { display:none; flex-basis:100%; list-style:none; flex-direction:column; gap:1rem; margin-top:1rem; padding-left:1.2rem; border-left:2px solid var(--color-light-2); }
	& .site-header__nav li.menu-item-has-children.is-open > ul.sub-menu { display:flex; }
	& .site-header__nav ul.sub-menu li a { display:block; font-size:1rem; font-weight:400; }
	& .site-header__nav ul li.current-menu-item > a, & .site-header__nav ul li.current-menu-parent > a, & .site-header__nav ul li.current-menu-ancestor > a,
	& .site-header__nav ul li.current_page_item > a, & .site-header__nav ul li.current_page_parent > a, & .site-header__nav ul li.current_page_ancestor > a { font-weight:700; }
	& .site-header__cta { display:inline-flex; align-items:center; margin-left:auto; padding:.6rem 1.1rem; background:var(--color-brand); color:var(--color-light-1); text-decoration:none; font-size:.78rem; font-weight:700; letter-spacing:.02em; border-radius:999px; white-space:nowrap; transition:background .2s ease, color .2s ease; }
	& .site-header__cta:hover { background:var(--color-text-dark); color:var(--color-light-1); }
	& .site-header__cta-text--short { display:none; }
	& .site-header__burger { display:flex; flex-direction:column; justify-content:center; gap:5px; width:32px; height:32px; background:none; border:none; cursor:pointer; padding:0;
		& span { display:block; width:100%; height:2px; background:var(--color-text-dark); transition:transform .25s ease, opacity .25s ease; }
	}
	&.nav-is-open .site-header__nav { display:block; position:absolute; top:100%; left:0; width:100%; max-height:calc(100vh - var(--header-height)); overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; background:var(--color-light-1); padding:2rem 1.5rem; box-shadow:0 12px 24px rgba(0,0,0,.1); }
	&.nav-is-open .site-header__burger span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
	&.nav-is-open .site-header__burger span:nth-child(2) { opacity:0; }
	&.nav-is-open .site-header__burger span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
}

#page:has(#site-header) { display:flex; flex-direction:column; min-height:100vh; }
#page:has(#site-header) > main { flex:1; }

#footer { background:var(--color-text-dark); color:var(--color-light-1);
	& .icon { width:16px; height:16px; flex:none; display:block; }
	& .footer__top { padding:3rem 0; }
	& .footer__grid { display:grid; grid-template-columns:1fr; gap:2.5rem; padding-left:1.5rem; padding-right:1.5rem; }
	& .footer__col h4 { font-size:1rem; font-weight:700; margin-bottom:1.1rem; color:var(--color-brand); }
	& .footer__col ul { list-style:none; display:flex; flex-direction:column; gap:.6rem; }
	& .footer__col ul li { display:flex; align-items:flex-start; gap:.5rem; font-size:.9rem; }
	& .footer__col a { color:var(--color-light-1); text-decoration:none; opacity:.85; display:flex; align-items:flex-start; gap:.5rem; }
	& .footer__col a:hover { opacity:1; color:var(--color-brand); }
	& .footer__logo { display:inline-block; margin-bottom:1rem; }
	& .footer__logo img { height:28px; width:auto; display:block; }
	& .footer__about p { font-size:.9rem; line-height:1.6; opacity:.8; margin-bottom:1.2rem; }
	& .footer__about .footer__social { list-style:none; display:flex; flex-direction:row; gap:.9rem; }
	& .footer__social a { color:var(--color-light-1); display:flex; }
	& .footer__social a:hover { color:var(--color-brand); }
	& .footer__badges { border-top:1px solid rgba(255,255,255,.15); border-bottom:1px solid rgba(255,255,255,.15); padding:1.5rem; display:flex; flex-wrap:wrap; justify-content:center; gap:1.2rem 2.5rem; }
	& .footer__badge { display:flex; align-items:center; gap:.5rem; font-size:.8rem; font-weight:500; opacity:.9;
		& .icon { width:20px; height:20px; color:var(--color-brand); }
	}
	& .footer__bottom { padding:1.2rem 1.5rem; display:flex; flex-direction:column; align-items:center; gap:.8rem; text-align:center; font-size:.8rem; opacity:.7; }
	& .footer__legal { list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:1.2rem; }
	& .footer__legal a { color:inherit; text-decoration:none; }
	& .footer__legal a:hover { opacity:.8; text-decoration:underline; }
}

#page > main {	
	
}

.wp-block-group { 
	
}

/* 404 */
.error-404 { padding:5rem 1.5rem; text-align:center;
	& .error-404__number { font-size:8rem; font-weight:700; line-height:1; opacity:.12; letter-spacing:-.04em; margin-bottom:-1.5rem; }
	& .error-404__heading { font-size:2rem; font-weight:700; margin-bottom:1rem; }
	& .error-404__text { font-size:1rem; opacity:.7; max-width:480px; margin:0 auto 2.5rem; line-height:1.7; }
	& .error-404__actions { display:flex; flex-wrap:wrap; justify-content:center; gap:1rem; }
	& .error-404__btn { display:inline-block; padding:.9rem 2rem; border:2px solid #fff; color:#fff; text-decoration:none; font-family:inherit; font-size:1rem; font-weight:700; letter-spacing:.03em; background:none; cursor:pointer; transition:background .25s, color .25s; }
	& .error-404__btn:hover { background:#fff; color:#000; }
	& .error-404__btn--ghost { opacity:.6; }
	& .error-404__btn--ghost:hover { opacity:1; background:#fff; color:#000; }
}

@media (max-width:380px) {

	#site-header .site-header__cta-text--full { display:none; }
	#site-header .site-header__cta-text--short { display:inline; }
	#site-header .site-header__hours-label--full { display:none; }
	#site-header .site-header__hours-label--short { display:inline; }

}

@media (min-width:769px) {

	h1, h2 { font-size:2.5rem; line-height:160%; margin-bottom:2rem; }
	.gap-y-default { gap:4rem; }
	
	main {
		h3 { margin-top:2rem; }
	}
	
	hr { margin-top:4rem; margin-bottom:4rem; }
	.padding-y-default { padding-top:4rem; padding-bottom:4rem; }
	.padding-x-default { padding-left:4rem; padding-right:4rem; }
	.margin-y-default { margin-top:4rem; margin-bottom:4rem; }
	
	.hero-content--compact {
		& .hero-content--compact__inner { padding:0 3rem; }
	}
	
	section#hero .img_wrap > img { height:calc(100vh - var(--header-height)); }
	.hero-content--compact__inner { padding:0 3rem; }
	.hero-content { bottom:5rem; left:5rem; transform:none; padding:2.5rem; }
	.hero-content h1, .hero-content h2 { font-size:2.2rem; }
	.hero-content p { font-size:1.05rem; }
	#site-header .site-header__topbar-inner { justify-content:space-between; padding:.6rem 3rem; }
	#site-header .site-header__topbar-right { flex:none; justify-content:flex-start; }
	#site-header .site-header__contact { display:flex; list-style:none; flex-direction:row; align-items:center; gap:1.8rem; }
	#site-header .site-header__main-inner { justify-content:flex-start; gap:3rem; padding:1rem 3rem; }
	#site-header .site-header__logo img { height:38px; }
	#site-header .site-header__nav { display:block; }
	#site-header .site-header__nav ul { flex-direction:row; gap:2.2rem; }
	#site-header .site-header__nav ul li { position:relative; display:flex; align-items:center; }
	#site-header .site-header__nav ul li a { font-size:1rem; }
	#site-header .site-header__nav ul li.menu-item-has-children:hover > .sub-menu-toggle .sub-menu-toggle__chevron,
	#site-header .site-header__nav ul li.menu-item-has-children:focus-within > .sub-menu-toggle .sub-menu-toggle__chevron { transform:rotate(-135deg); }
	#site-header .site-header__nav ul.sub-menu { position:absolute; top:100%; left:0; flex-direction:column; gap:0; margin-top:0; padding:.6rem 0; min-width:220px; background:var(--color-light-1); border:1px solid var(--color-light-2); box-shadow:0 12px 24px rgba(0,0,0,.08); z-index:10; }
	#site-header .site-header__nav ul.sub-menu ul.sub-menu { top:-.6rem; left:100%; margin-top:0; margin-left:0; }
	#site-header .site-header__nav ul.sub-menu li a { padding:.6rem 1.25rem; font-size:.95rem; }
	#site-header .site-header__nav ul.sub-menu li.menu-item-has-children.is-open > .sub-menu-toggle .sub-menu-toggle__chevron { transform:rotate(-45deg); }
	#site-header .site-header__nav ul.sub-menu li.menu-item-has-children:hover > .sub-menu-toggle .sub-menu-toggle__chevron,
	#site-header .site-header__nav ul.sub-menu li.menu-item-has-children:focus-within > .sub-menu-toggle .sub-menu-toggle__chevron { transform:rotate(-45deg); }
	#site-header .site-header__nav ul.sub-menu li:hover { background:var(--color-light-2); }
	#site-header .site-header__nav ul.sub-menu li:hover > a, #site-header .site-header__nav ul.sub-menu li:hover > .sub-menu-toggle { color:var(--color-dark); }
	#site-header .site-header__nav ul li.menu-item-has-children:hover > ul.sub-menu,
	#site-header .site-header__nav ul li.menu-item-has-children:focus-within > ul.sub-menu { display:flex; }
	#site-header .site-header__cta { display:inline-block; padding:.75rem 1.5rem; background:var(--color-brand); color:var(--color-light-1); text-decoration:none; font-size:.9rem; font-weight:700; letter-spacing:.02em; transition:background .2s ease, color .2s ease; }
	#site-header .site-header__cta:hover { background:var(--color-text-dark); color:var(--color-light-1); }
	#site-header .site-header__burger { display:none; }

	#footer .footer__top { padding:4rem 0; }
	#footer .footer__grid { grid-template-columns:repeat(4, 1fr); gap:3rem; padding-left:3rem; padding-right:3rem; }
	#footer .footer__bottom { flex-direction:row; justify-content:space-between; text-align:left; padding:1.2rem 3rem; }

}