@import url("./shared/fonts.css");

:root {
    --po-content-width: 980px;
    --po-color-text: #292929;
    --po-color-muted: #848079;
    --po-color-link-active: #45ba01;
    --po-font-hand: "patrick hand", cursive;
    --po-font-light: "din-next-w01-light", Arial, sans-serif;
    --po-font-serif: "enriqueta", Georgia, serif;
    --po-font-contact: "jockey one", Arial, sans-serif;
}

body { margin: 0; }
.po-container { width: min(var(--po-content-width), 100%); margin-inline: auto; }
.po-site-header, .po-site-footer,
.po-site-header *, .po-site-footer * { box-sizing: border-box; }
.po-site-header a, .po-site-footer a { text-decoration: none; }
.po-site-header a:focus-visible, .po-site-header button:focus-visible,
.po-site-footer a:focus-visible { outline: 2px solid #267b00; outline-offset: 4px; }
.po-skip-link { position: fixed; inset: 8px auto auto 8px; z-index: 1000; transform: translateY(-180%); padding: 10px 16px; background: #fff; color: #292929; font: 18px var(--po-font-hand); }
.po-skip-link:focus { transform: translateY(0); }
.po-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* The original 50px Wix advertising strip is intentionally not reproduced. */
.po-site-header { position: relative; z-index: 20; height: 219px; overflow-x: clip; background: #fff; box-shadow: 0 0 5px rgba(0,0,0,.7); }
.po-header-inner { position: relative; height: 219px; }
.po-header-logo { position: absolute; top: 0; left: -16px; width: 341px; height: 114px; }
.po-header-logo img { display: block; width: 341px; height: 114px; object-fit: cover; }
.po-header-tagline { position: absolute; top: 110px; left: 60px; white-space: nowrap; color: var(--po-color-muted); font: 400 15px/18px var(--po-font-light); }
.po-main-navigation { position: absolute; z-index: 5; top: 39px; left: 297px; width: 673px; min-height: 40px; }
.po-nav-list, .po-submenu { margin: 0; padding: 0; list-style: none; }
.po-nav-list { display: grid; grid-template-columns: 83px 95px 98px 89px 85px 94px 129px; }
.po-nav-item { position: relative; margin: 0; padding: 0; }
.po-nav-link { display: block; padding-inline: 10px; color: var(--po-color-muted); text-align: center; white-space: nowrap; font: 700 14px/40px var(--po-font-hand); transition: color .2s ease; }
.po-nav-item.is-current > .po-nav-link,
.po-nav-link:hover, .po-submenu a:hover, .po-submenu a[aria-current="page"] { color: var(--po-color-link-active); }
.po-submenu { position: absolute; top: 100%; left: 50%; min-width: 190px; width: max-content; max-width: 290px; padding: 8px 10px; border-radius: 10px; background: #fff; transform: translateX(-50%); display: none; }
.po-submenu a { display: block; padding: 6px 10px; color: var(--po-color-muted); text-align: center; font: 700 14px/1.4 var(--po-font-hand); }
.po-nav-item:last-child .po-submenu { left: auto; right: 0; transform: none; }
.po-site-header:not(.is-enhanced) .po-nav-item:hover > .po-submenu,
.po-site-header:not(.is-enhanced) .po-nav-item:focus-within > .po-submenu,
.po-nav-item.is-submenu-open > .po-submenu { display: block; }
.po-submenu-toggle { display: none; position: absolute; top: 10px; right: 0; width: 20px; height: 22px; border: 0; padding: 6px; background: transparent; color: var(--po-color-muted); cursor: pointer; }
.is-enhanced .po-submenu-toggle { display: block; }
.po-submenu-toggle span { display: block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.po-submenu-toggle[aria-expanded="true"] span { transform: rotate(225deg); }
.po-menu-toggle { display: none; }
.po-header-circles { position: absolute; inset: 0; pointer-events: none; }
.po-header-circle { position: absolute; left: var(--circle-x); top: var(--circle-y); width: var(--circle-w); height: var(--circle-h); border: 6px solid #fff; border-radius: 50%; background: #fff; box-shadow: 0 0 14px rgba(0,0,0,.2); overflow: hidden; }
.po-header-circle img { display: block; width: 100%; height: 100%; object-fit: cover; }

.po-site-footer { min-height: 220px; background: #fff; color: var(--po-color-muted); }
.po-footer-inner { position: relative; min-height: 220px; }
.po-footer-brand { position: absolute; top: 25px; left: 1px; width: 228px; }
.po-footer-logo, .po-footer-logo img { display: block; width: 228px; height: 76px; }
.po-footer-tagline { display: block; margin-top: 3px; color: var(--po-color-muted); text-align: center; white-space: nowrap; font: 400 14px/19px var(--po-font-serif); }
.po-footer-phone { position: absolute; top: 46px; left: 265px; display: flex; align-items: flex-start; gap: 22px; }
.po-contact-icon { position: relative; display: block; width: 72px; height: 72px; flex-shrink: 0; }
.po-contact-icon img { display: block; width: 72px; height: 72px; object-fit: contain; }
.po-contact-icon .po-contact-icon-hover { position: absolute; inset: 0; opacity: 0; }
.po-contact-icon:hover .po-contact-icon-hover,
.po-contact-icon:focus-visible .po-contact-icon-hover { opacity: 1; }
.po-phone-numbers { display: flex; flex-direction: column; }
.po-phone-numbers a { display: flex; align-items: center; justify-content: center; width: 96px; height: 40px; color: #000; white-space: nowrap; font: 400 21px/1.4 var(--po-font-contact); }
.po-phone-numbers a + a { margin-top: -2px; }
.po-footer-email { position: absolute; top: 46px; left: 513px; display: flex; align-items: center; gap: 8px; }
.po-email-address { display: flex; align-items: center; justify-content: center; width: 171px; min-height: 45px; margin-top: 7px; color: #000; white-space: nowrap; font: 400 21px/1.4 var(--po-font-contact); }
.po-footer-social { position: absolute; top: 67px; left: 841px; display: flex; align-items: center; gap: 16px; }
.po-footer-social a, .po-footer-social img { display: block; }
.po-social-instagram, .po-social-instagram img { width: 39px; height: 39px; }
.po-social-facebook, .po-social-facebook img { width: 30px; height: 30px; }
.po-social-facebook { margin-top: 3px; }
.po-footer-copyright { position: absolute; left: 0; right: 0; top: 166px; margin: 0; text-align: center; font: 400 14px/19px var(--po-font-serif); }

/* Compact navigation preserves the same links and original decorative art. */
@media (max-width: 1020px) {
    .po-site-header { height: auto; min-height: 219px; }
    .po-header-inner { width: 100%; height: auto; min-height: 219px; padding-top: 137px; padding-bottom: 82px; }
    .po-header-logo { left: 8px; width: 300px; height: 100px; }
    .po-header-logo img { width: 300px; height: 100px; }
    .po-header-tagline { left: 69px; top: 98px; font-size: 14px; }
    .po-menu-toggle { position: absolute; top: 39px; right: 24px; border: 0; background: #fff; color: #5b5751; align-items: center; gap: 9px; padding: 8px; font: 700 18px var(--po-font-hand); cursor: pointer; }
    .is-enhanced .po-menu-toggle { display: flex; }
    .po-menu-bars { display: grid; gap: 4px; width: 22px; }
    .po-menu-bars span { display: block; height: 2px; background: currentColor; }
    .po-main-navigation { position: relative; top: auto; left: auto; width: auto; margin: 0 24px; }
    .is-enhanced:not(.is-nav-open) .po-main-navigation { display: none; }
    .po-nav-list { display: block; }
    .po-nav-link { padding-inline: 16px 48px; text-align: left; font-size: 18px; line-height: 42px; }
    .po-submenu-toggle { top: 0; right: 4px; width: 42px; height: 42px; padding: 17px; }
    .po-submenu { position: static; width: auto; max-width: none; min-width: 0; padding: 0 0 6px 18px; transform: none; border-radius: 0; }
    .po-nav-item:last-child .po-submenu { transform: none; }
    .po-submenu a { padding: 6px 16px; text-align: left; font-size: 16px; }
    .po-site-header:not(.is-enhanced) .po-nav-item:hover > .po-submenu,
    .po-site-header:not(.is-enhanced) .po-nav-item:focus-within > .po-submenu { display: block; }
    .po-nav-item.is-submenu-open > .po-submenu,
    .po-site-header:not(.is-enhanced) .po-submenu { display: block; }
    .po-header-circles { inset: auto auto 0 50%; width: 980px; height: 82px; transform: translateX(-50%) scale(.8); transform-origin: center bottom; }
    .po-header-circle { top: calc(var(--circle-y) - 137px); }
    .po-header-inner { clip-path: inset(-10px -10px -60px); }
    .po-footer-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 32px; align-items: center; justify-content: center; min-height: 260px; padding: 28px 30px 24px; }
    .po-footer-brand, .po-footer-phone, .po-footer-email, .po-footer-social, .po-footer-copyright { position: static; }
    .po-footer-brand { justify-self: center; }
    .po-footer-phone { justify-self: center; }
    .po-footer-email { justify-self: center; }
    .po-footer-social { justify-self: center; }
    .po-footer-copyright { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .po-header-logo { left: 0; width: 260px; height: 87px; }
    .po-header-logo img { width: 260px; height: 87px; }
    .po-header-tagline { top: 91px; left: 49px; font-size: 13px; }
    .po-menu-toggle { top: 24px; right: 8px; flex-direction: column; gap: 4px; font-size: 15px; }
    .po-header-inner { padding-top: 123px; min-height: 205px; }
    .po-main-navigation { margin-inline: 12px; }
    .po-header-circles { transform: translateX(-50%) scale(.56); }
    .po-footer-inner { display: flex; flex-direction: column; gap: 25px; padding: 30px 16px; }
    .po-footer-phone { gap: 22px; }
    .po-footer-email { gap: 8px; }
    .po-footer-copyright { max-width: 340px; }
}

@media (prefers-reduced-motion: reduce) {
    .po-nav-link { transition: none; }
}
