:root{--green:#244f2a;--lime:#80a941;--line:#6c9868;--yellow:#ffd84d}
*{box-sizing:border-box}
html{background:#fff}
body{margin:0;color:var(--green);font-family:'Oswald',Arial,sans-serif;background:#fff}
.page-shell{width:min(100%,1180px);margin:0 auto;overflow:hidden;background:#fff;box-shadow:none}
.hero{width:100%;background:#fff;display:flex;justify-content:center}
.hero img{display:block;width:100%;height:auto;max-width:1180px}
.content-wrap{max-width:1060px;margin:0 auto;padding:14px 28px 30px}
.contacts{display:flex;flex-direction:column;align-items:center;gap:4px;margin:2px auto 18px;font-size:clamp(14px,1.5vw,21px);text-transform:uppercase;text-align:center}
.contact-line{display:flex;align-items:center;justify-content:center;gap:9px;color:var(--green);text-decoration:none;line-height:1.08}
.contact-line:hover{text-decoration:underline}
.contact-icon{font-family:Arial,sans-serif;font-size:1.05em;line-height:1;color:var(--green)}
.hours-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.hours-card{border:3px solid var(--line);border-radius:17px;min-height:190px;padding:14px 18px 14px;background:#fff;box-shadow:0 1px 0 rgba(16,47,23,.08)}
.hours-card header{display:flex;align-items:center;gap:13px}
.hours-card h2{font-size:clamp(20px,2.1vw,29px);margin:0;font-weight:700;letter-spacing:.01em}
.round-icon{width:68px;height:68px;flex:0 0 68px;border:3px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:35px;filter:saturate(.75)}
.ornament{display:flex;align-items:center;gap:6px;width:39%;margin:0 0 15px 76px}
.ornament span{height:2px;background:var(--lime);flex:1}
.ornament i{width:7px;height:7px;background:var(--lime);border-radius:50%;display:block}
.park-hours-layout{display:flex;align-items:center;justify-content:center;min-height:70px}
.hours-copy{text-align:center;min-width:0}
.days{font-size:clamp(15px,1.45vw,20px);font-weight:700;white-space:nowrap}
.time{font-size:clamp(23px,2.25vw,32px);font-weight:700;white-space:nowrap}
.cafe-hours-layout{display:grid;grid-template-columns:minmax(0,1fr) 2px minmax(0,1fr);align-items:center;gap:14px;min-height:70px}
.cafe-hours-layout .hours-copy{width:100%}
.cafe-hours-layout .days{white-space:nowrap;font-size:clamp(14px,1.25vw,18px)}
.cafe-hours-layout .time{font-size:clamp(21px,2vw,29px)}
.divider{width:2px;height:60px;background:#77a366}
.gate-notice{margin:15px 0;border:2px solid var(--yellow);border-radius:13px;background:linear-gradient(90deg,#fffdf4,#fff);min-height:58px;padding:8px 16px;display:flex;align-items:center;justify-content:center;gap:17px;text-align:center;font-size:clamp(18px,2vw,29px);line-height:1.05}
.warning-triangle{font-family:Arial,sans-serif;display:flex;align-items:center;justify-content:center;width:42px;height:38px;flex:0 0 42px;background:var(--yellow);color:#111;font-weight:900;font-size:25px;clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:9px}
.rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start;max-width:1060px;margin:0 auto}
.rules img{display:block;width:100%;height:auto;border-radius:8px;background:#fff}
@media (max-width:1100px){
  .page-shell{width:100%;box-shadow:none}
  .content-wrap{padding:14px 18px 28px}
  .hours-grid{grid-template-columns:1fr}
  .rules{grid-template-columns:repeat(3,1fr);max-width:960px}
  .hours-card{min-height:auto}
  .contacts{margin-top:0}
}
@media (max-width:650px){
  .content-wrap{padding:10px 10px 22px}
  .contacts{font-size:14px;gap:6px;margin-bottom:14px}
  .contact-line{gap:6px}
  .hours-card{border-width:2px;border-radius:13px;padding:10px}
  .hours-card header{gap:8px}
  .hours-card h2{font-size:20px}
  .round-icon{width:50px;height:50px;flex-basis:50px;font-size:26px;border-width:2px}
  .ornament{margin-left:57px;width:45%;margin-bottom:10px}
  .days{font-size:15px}
  .time{font-size:23px}
  .cafe-hours-layout{grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);gap:7px}
  .cafe-hours-layout .days{font-size:12px;white-space:nowrap}
  .cafe-hours-layout .time{font-size:19px;white-space:nowrap}
  .divider{height:48px;width:1px}
  .gate-notice{gap:9px;padding:8px 9px;border-radius:10px;font-size:18px}
  .warning-triangle{width:34px;height:31px;flex-basis:34px;font-size:20px;padding-top:7px}
  .rules{grid-template-columns:1fr;gap:12px;max-width:360px}
}


/* Centering opening-hours cards */
.hours-card{
    text-align:center;
}
.hours-title{
    justify-content:center !important;
    text-align:center;
    width:100%;
}
.hours-title > div{
    justify-content:center;
}
.ornament{
    margin-left:auto !important;
    margin-right:auto !important;
}
.park-time,
.cafe-time,
.cafe-grid{
    text-align:center;
    justify-content:center;
}
.cafe-grid{
    width:100%;
    margin-left:auto;
    margin-right:auto;
}
.cafe-col{
    text-align:center;
}


/* === Final requested layout === */

/* Both opening-hours boxes: everything centered */
.hours-card{
    text-align:center !important;
    display:flex;
    flex-direction:column;
    align-items:center;
}
.hours-title{
    width:100%;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    gap:7px !important;
}
.hours-title .icon-circle,
.hours-title > span:first-child,
.hours-title > div:first-child{
    margin-left:auto !important;
    margin-right:auto !important;
}
.hours-title h2,
.hours-title strong,
.hours-title span{
    text-align:center !important;
}
.ornament{
    margin:5px auto 10px auto !important;
}
.park-time,
.cafe-time,
.cafe-grid{
    width:100%;
    text-align:center !important;
    justify-content:center !important;
    align-items:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
}
.cafe-grid{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
}
.cafe-col{
    text-align:center !important;
}
.hours-card p{
    text-align:center !important;
}

/* Warning icons: all 9 in one single row on desktop */
.rules{
    display:grid !important;
    grid-template-columns:repeat(9,minmax(0,1fr)) !important;
    gap:7px !important;
    max-width:1180px !important;
    margin:0 auto !important;
    align-items:start !important;
}
.rules img{
    width:100% !important;
    height:auto !important;
    border-radius:5px !important;
}

/* Keep the warning row directly below the gate-closing warning */
.rules-section{
    margin-top:8px !important;
}

/* Responsive: preserve usability on narrower screens */
@media (max-width: 1000px){
    .rules{
        grid-template-columns:repeat(3,1fr) !important;
        max-width:720px !important;
    }
}
@media (max-width: 560px){
    .rules{
        grid-template-columns:repeat(2,1fr) !important;
        max-width:420px !important;
    }
}


/* === Requested update: 5 + 4 warning icons, contact spacing === */

/* Warning icons: 5 in first row, 4 in second row */
.rules{
    display:grid !important;
    grid-template-columns:repeat(10, 1fr) !important;
    gap:14px !important;
    max-width:1160px !important;
    margin:0 auto !important;
}
.rules > *{
    grid-column:span 2;
}
/* Center the second row of 4 items */
.rules > *:nth-child(6){
    grid-column:2 / span 2;
}
.rules > *:nth-child(7){
    grid-column:4 / span 2;
}
.rules > *:nth-child(8){
    grid-column:6 / span 2;
}
.rules > *:nth-child(9){
    grid-column:8 / span 2;
}
.rules img{
    width:100% !important;
    height:auto !important;
}

/* Location icon before the address */
.location-pin{
    display:inline-block;
    margin-right:7px;
    font-size:1.08em;
    line-height:1;
    vertical-align:-0.05em;
}

/* Manager row: no icon, more air above */
.manager,
.manager-row,
.operator,
.operator-row,
.upravljalec{
    margin-top:18px !important;
    padding-top:4px !important;
    text-align:center !important;
}
.manager svg,
.manager img,
.manager .icon,
.manager-row svg,
.manager-row img,
.manager-row .icon,
.operator svg,
.operator img,
.operator .icon,
.operator-row svg,
.operator-row img,
.operator-row .icon,
.upravljalec svg,
.upravljalec img,
.upravljalec .icon{
    display:none !important;
}

/* Responsive layout */
@media (max-width: 900px){
    .rules{
        grid-template-columns:repeat(3,1fr) !important;
        max-width:760px !important;
    }
    .rules > *{
        grid-column:auto !important;
    }
}
@media (max-width: 560px){
    .rules{
        grid-template-columns:repeat(2,1fr) !important;
        max-width:430px !important;
    }
}


/* Exact contact-row refinements */
.location-icon{
    font-size:18px !important;
    width:auto !important;
    margin-right:8px !important;
}
.operator-text{
    display:block;
    width:100%;
}
.contact-item:has(.operator-text){
    margin-top:20px !important;
    padding-top:8px !important;
}


/* Event / location rental application CTA */
.event-application-cta{
    display:block;
    box-sizing:border-box;
    max-width:980px;
    margin:24px auto 18px auto;
    padding:14px 22px;
    border:2px solid #2477b9;
    border-radius:12px;
    color:#2477b9 !important;
    background:#fff;
    text-align:center;
    text-decoration:none !important;
    font-weight:800;
    line-height:1.35;
    letter-spacing:.2px;
    transition:background .15s ease, color .15s ease;
}
.event-application-cta:hover{
    background:#2477b9;
    color:#fff !important;
}
@media (max-width: 700px){
    .event-application-cta{
        margin:18px 14px 14px 14px;
        padding:12px 14px;
        font-size:.92rem;
    }
}


/* Small, intentionally discreet shortcuts in the top-right corner */
.top-shortcuts{
    position:absolute;
    top:10px;
    right:12px;
    z-index:20;
    display:flex;
    gap:5px;
}
.top-shortcuts a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:21px;
    height:21px;
    box-sizing:border-box;
    border:1px solid rgba(255,255,255,.48);
    border-radius:50%;
    background:rgba(255,255,255,.16);
    color:rgba(255,255,255,.66) !important;
    font-size:10px;
    line-height:1;
    font-weight:600;
    text-decoration:none !important;
    opacity:.58;
    transition:opacity .15s ease, background .15s ease;
}
.top-shortcuts a:hover{
    opacity:.95;
    background:rgba(255,255,255,.27);
}
@media (max-width:600px){
    .top-shortcuts{
        top:7px;
        right:8px;
        gap:4px;
    }
    .top-shortcuts a{
        width:19px;
        height:19px;
        font-size:9px;
    }
}


/* Slightly more visible, very light green top shortcuts */
.top-shortcuts a{
    border-color:rgba(91, 143, 91, .48) !important;
    background:rgba(225, 239, 222, .72) !important;
    color:rgba(70, 116, 70, .82) !important;
    opacity:.78 !important;
}
.top-shortcuts a:hover{
    border-color:rgba(75, 130, 75, .70) !important;
    background:rgba(211, 232, 207, .92) !important;
    color:rgba(55, 100, 55, .95) !important;
    opacity:1 !important;
}


/* Footer with discreet quick-access icons */
.site-footer{
    margin-top:22px;
    padding:14px 16px 18px;
    background:#fff;
}
.footer-inner{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    flex-wrap:wrap;
    font-size:12px;
    color:#6f7d6f;
    text-align:center;
}
.footer-copy{
    white-space:nowrap;
}
.footer-separator{
    color:#9dad9d;
}
.footer-shortcuts{
    display:inline-flex;
    align-items:center;
    gap:5px;
}
.footer-shortcuts a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    box-sizing:border-box;
    border:1px solid rgba(91,143,91,.42);
    border-radius:50%;
    background:rgba(225,239,222,.62);
    color:rgba(70,116,70,.80) !important;
    font-size:9px;
    line-height:1;
    font-weight:700;
    text-decoration:none !important;
    opacity:.82;
    transition:opacity .15s ease, background .15s ease;
}
.footer-shortcuts a:hover{
    opacity:1;
    background:rgba(211,232,207,.92);
}
@media (max-width:560px){
    .footer-inner{
        font-size:11px;
        gap:7px;
    }
    .footer-shortcuts a{
        width:19px;
        height:19px;
        font-size:8px;
    }
}

/* Old top-right shortcuts are no longer used */
.top-shortcuts{
    display:none !important;
}


/* Desktop footer centering fix */
.site-footer{
    width:100%;
    box-sizing:border-box;
}
.footer-inner{
    width:100%;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    justify-content:center !important;
    text-align:center !important;
}
@media (min-width: 701px){
    .footer-inner{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        flex-wrap:nowrap !important;
    }
}


/* Next 3 upcoming events from /dogodki/events.sqlite */
.upcoming-events{
    max-width:980px;
    margin:22px auto 0;
}
.upcoming-events-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:14px;
}
.upcoming-event-card{
    box-sizing:border-box;
    min-height:128px;
    padding:18px 16px;
    border:1px solid #dbe6d7;
    border-radius:12px;
    background:#fff;
    text-align:center;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.upcoming-event-card h3{
    margin:0 0 10px;
    font-size:18px;
    line-height:1.18;
    font-weight:700;
    color:#4f704c;
}
.upcoming-event-date{
    font-size:15px;
    font-weight:600;
    color:#333;
}
.upcoming-event-time{
    margin-top:2px;
    font-size:17px;
    font-weight:700;
    color:#333;
}
@media (max-width:700px){
    .upcoming-events{
        margin:18px 14px 0;
    }
    .upcoming-events-grid{
        grid-template-columns:1fr;
        gap:10px;
    }
    .upcoming-event-card{
        min-height:104px;
        padding:14px;
    }
    .upcoming-event-card h3{
        font-size:16px;
    }
}


/* === Compact hero/content transition === */
.hero img{
    width:100% !important;
    height:auto !important;
    max-width:1180px !important;
}
.content-wrap{
    position:relative;
    z-index:2;
    margin-top:-34px !important;
    padding-top:0 !important;
}
.contacts{
    position:relative;
    z-index:3;
    padding:8px 18px 6px;
    margin-top:0 !important;
    margin-bottom:12px !important;
    background:rgba(255,255,255,.88);
    border-radius:12px;
}

/* === Upcoming events area === */
.upcoming-events{
    max-width:980px;
    margin:16px auto 0 !important;
}
.upcoming-events-title{
    margin:0 0 10px;
    text-align:left;
    font-size:20px;
    line-height:1.2;
    font-weight:700;
    color:#355f37;
}
.upcoming-events-grid{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) minmax(145px,.68fr) !important;
    gap:12px !important;
    align-items:stretch;
}
.upcoming-event-card,
.all-events-card{
    min-height:118px !important;
}
.all-events-card{
    box-sizing:border-box;
    padding:16px 12px;
    border:1px solid #dbe6d7;
    border-radius:12px;
    background:#f8fbf7;
    color:#4f704c !important;
    text-align:center;
    text-decoration:none !important;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
    line-height:1.2;
    font-weight:700;
    transition:background .15s ease, border-color .15s ease;
}
.all-events-card:hover{
    background:#eef6ec;
    border-color:#b7cfb2;
}

@media (max-width:900px){
    .content-wrap{
        margin-top:-18px !important;
    }
    .upcoming-events-grid{
        grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    }
}
@media (max-width:700px){
    .content-wrap{
        margin-top:-8px !important;
    }
    .contacts{
        padding:7px 10px 5px;
    }
    .upcoming-events-title{
        text-align:center;
        font-size:18px;
    }
    .upcoming-events-grid{
        grid-template-columns:1fr !important;
    }
    .all-events-card{
        min-height:72px !important;
    }
}
