/* pp10-shared.css – wspólne style dla wszystkich podstron */

/* ═══ RESET & ROOT ═══ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
:root {
  /* ── Kolory przedszkola ────────────────────────────────── */
  /* Oryginalne barwy przedszkola (tylko jako tła/akcenty) */
 --brand-orange:      #ad5214;
  --brand-yellow:      #ecc931;
  --brand-purple:      #7d57ad;

  /* Ciemne warianty – tekst i tła (AAA ≥7:1 na białym) */
  --c-orange:           #8b1917;   /* 7.03:1 na białym – nagłówki, nav  */
  --c-yellow:           #685609;   /* 7.18:1 na białym – akcenty        */
  --c-purple:           #74447a;   /* 7.06:1 na białym – tytuły sekcji  */

  /* Tła pastelowe (brand-tint) */
  --c-orange-tint:      #fdf4ec;   /* tło kart pomarańczowych           */
  --c-yellow-tint:      #fdfaec;   /* tło kart żółtych                  */
  --c-purple-tint:      #f3eef9;   /* tło kart fioletowych              */

  /* Neutralne */
  --c-white:            #FFFFFF;
  --c-bg:               #FAF7F4;   /* tło strony – ciepła biel          */
  --c-surface:          #FFFFFF;
  --c-text:             #1a0e00;   /* bardzo ciemny brąz – 18:1 na biel */
  --c-muted:            #4a2e10;   /* przyciemniony pomarańcz – 9:1     */
  --c-border:           #d9bfa8;   /* ramki – ciepły beż                */
  --c-focus:            #74447a;   /* fioletowy fokus – wyróżnia się    */

  /* Aliasy semantyczne → brand */
  --c-primary:          var(--c-orange);       /* główny kolor akcji    */
  --c-primary-bg:       var(--brand-orange);   /* tło przycisków        */
  --c-primary-tint:     var(--c-orange-tint);  /* jasne tło             */
  --c-secondary:        var(--c-purple);       /* drugi kolor           */
  --c-secondary-bg:     var(--brand-purple);   /* tło nav, headery      */
  --c-secondary-tint:   var(--c-purple-tint);  /* jasne tło fiolet      */
  --c-accent:           var(--brand-yellow);   /* żółty – paski, focus  */
  --c-accent-text:      var(--c-yellow);       /* ciemny żółty – tekst  */

  --font-head: 'Poppins', sans-serif;
  --font-body: 'Source Sans 3', 'Segoe UI', system-ui, sans-serif;
  --max-w: 1180px;
  --radius: 8px;
  --radius-lg: 14px;
  --shadow: 0 2px 10px rgba(100,72,0,.10);
  --shadow-lg: 0 6px 28px rgba(100,72,0,.14);
  --trans: .18s ease;
}
body { font-family: var(--font-body); font-size: 1rem; line-height: 1.75; color: var(--c-text); background: var(--c-bg); }
img { display: block; max-width: 100%; height: auto; }
a { color: var(--c-purple); text-decoration: none;   font-weight: 600;}
a:hover { color: var(--c-orange);  text-decoration: underline;text-underline-offset: 4px; }

a:focus-visible { outline: 3px solid var(--c-focus); outline-offset: 3px; border-radius: 3px; text-decoration: none; }
p { margin-bottom: .9rem; } p:last-child { margin-bottom: 0; }

/* ═══ ACCESSIBILITY ═══ */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:absolute; top:-70px; left:1rem; z-index:9999; background:var(--c-green); color:#fff; padding:12px 28px; border-radius:var(--radius); font-weight:600; font-size:.95rem; text-decoration:none; transition:top var(--trans); }
.skip-link:focus { top:12px; color:#fff; outline:3px solid var(--c-amber); }

/* ═══ COOKIE BANNER ═══ */
#cookie-banner { position:fixed; bottom:0; left:0; right:0; z-index:8888; background:var(--c-green); color:#fff; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; box-shadow:0 -4px 20px rgba(0,0,0,.25); }
#cookie-banner p { color:rgba(255,255,255,.9); font-size:.88rem; margin:0; max-width:720px; }
.cookie-btns { display:flex; gap:10px; flex-shrink:0; }
.btn-cookie { padding:9px 22px; border-radius:var(--radius); font-family:var(--font-body); font-weight:600; font-size:.9rem; cursor:pointer; border:2px solid transparent; transition:all var(--trans); }
.btn-cookie-accept { background:var(--brand-orange); color:#fff; border-color:var(--c-amber); }
.btn-cookie-accept:hover { background:var(--c-amber-dark); border-color:var(--c-orange); }
.btn-cookie-reject { background:transparent; color:#fff; border-color:rgba(255,255,255,.5); }
.btn-cookie-reject:hover { background:rgba(255,255,255,.1); }
.btn-cookie:focus-visible { outline:3px solid var(--c-amber); outline-offset:3px; }

/* ═══ HEADER ═══ */
.site-header { background:var(--c-white); border-bottom:3px solid var(--c-yellow-tint); box-shadow:var(--shadow); }
.header-inner { max-width:var(--max-w); margin:0 auto; padding:14px 20px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; }
.site-logo { display:flex; align-items:center; gap:14px; text-decoration:none; }
.site-logo:focus-visible { outline:3px solid var(--c-focus); outline-offset:4px; border-radius:4px; }
.logo-emblem { width:58px; height:58px; border-radius:50%; background:var(--brand-orange); display:flex; align-items:center; justify-content:center; flex-shrink:0; box-shadow:0 0 0 4px rgba(209,106,36,.25); }
.logo-emblem svg { width:34px; height:34px; }
.logo-text-wrap { display:flex; flex-direction:column; }

.logo-sub { font-size:.78rem; color:var(--c-muted); font-weight:500; letter-spacing:.04em; text-transform:uppercase; }
.header-icons { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.icon-link { 
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 10px;
    border-radius: var(--radius);
    text-decoration: none;
    color: var(--c-orange);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .03em;
    text-transform: uppercase;
    min-width: 54px;
    text-align: center;
    border: 1.5px solid transparent;
    background: #e7e1f7;
    border-color: #afa9d1;
    text-decoration: none;
}
}
.icon-link:hover { background:var(--c-orange-tint); color:var(--c-orange); border-color:var(--c-border); text-decoration:none; }
.icon-link:focus-visible { outline:3px solid var(--c-focus); outline-offset:2px; color:var(--c-green); text-decoration:none; }
.icon-link svg, .icon-link img { width:28px; height:28px; object-fit:contain; }

/* ═══ NAV ═══ */
.site-nav-wrap { background:var(--c-purple); position:sticky; top:0; z-index:500; box-shadow:0 3px 12px rgba(0,0,0,.18); }
.site-nav { max-width:var(--max-w); margin:0 auto; display:flex; align-items:stretch; }
.nav-toggle { display:none; align-items:center; gap:8px; background:none; border:2px solid rgba(255,255,255,.4); color:#fff; padding:10px 18px; margin:8px 16px; border-radius:var(--radius); font-family:var(--font-body); font-size:.88rem; font-weight:600; cursor:pointer; transition:background var(--trans); }
.nav-toggle:hover { background:rgba(255,255,255,.12); }
.nav-toggle:focus-visible { outline:3px solid var(--c-amber); outline-offset:2px; }
.nav-list { display:flex; list-style:none; flex-wrap:wrap; flex:1; }
.nav-list > li { position:relative; }
.nav-list > li > a, .nav-list > li > button { display:flex; align-items:center; gap:5px; height:54px; padding:0 18px; color:rgba(255,255,255,.95); font-family:var(--font-body); font-size:.88rem; font-weight:600; text-decoration:none; background:none; border:none; border-bottom:3px solid transparent; cursor:pointer; white-space:nowrap; transition:background var(--trans),border-color var(--trans),color var(--trans); }
.nav-list > li > a:hover, .nav-list > li > button:hover { background:rgba(255,255,255,.1); color:#fff; border-bottom-color:var(--brand-yellow); }
.nav-list > li > a:focus-visible, .nav-list > li > button:focus-visible { outline:3px solid var(--c-amber); outline-offset:-3px; }
.nav-list > li > a[aria-current="page"] { border-bottom-color:var(--brand-yellow); color:#fff; background:rgba(255,255,255,.08); }
.nav-chevron { width:12px; height:12px; transition:transform .2s; fill:currentColor; flex-shrink:0; }
button[aria-expanded="true"] .nav-chevron { transform:rotate(180deg); }
.nav-dropdown { position:absolute; top:100%; left:0; min-width:240px; background:var(--c-white); border:1px solid var(--c-border); border-radius:0 0 var(--radius-lg) var(--radius-lg); box-shadow:var(--shadow-lg); list-style:none; display:none; z-index:200; padding:6px 0; }
.nav-dropdown.open { display:block; }
.nav-dropdown li a { display:block; padding:10px 20px; color:var(--c-purple); font-size:.9rem; text-decoration:none; transition:background var(--trans),color var(--trans); border-left:3px solid transparent; font-weight:500; }
.nav-dropdown li a:hover { background:var(--c-orange-tint); border-left-color:var(--brand-orange); }
.nav-dropdown li a:focus-visible { outline:3px solid var(--c-focus); outline-offset:-3px; background:var(--c-orange-tint); }

/* ═══ PAGE HEADER BAND ═══ */
.page-band { background:linear-gradient(135deg,var(--c-orange) 0%,var(--c-purple) 100%); color:#fff; padding:32px 20px; }
.page-band-inner { max-width:var(--max-w); margin:0 auto;padding: 0 25px; }
.breadcrumb { display:flex; align-items:center; gap:8px; font-size:.875rem; color:rgba(255,255,255,.82); margin-bottom:10px; flex-wrap:wrap; list-style:none; }
.breadcrumb a { color:rgba(255,255,255,.78); text-decoration:none; }
.breadcrumb a:hover { color:#fff; text-decoration:underline; }
.breadcrumb a:focus-visible { outline:2px solid var(--c-amber); outline-offset:2px; border-radius:2px; }
.breadcrumb li + li::before { content:'|'; margin-right:8px; opacity:.5; }
.page-band h1 { font-family:var(--font-head); font-size:2rem; font-weight:400; line-height:1.2; }
.page-band .page-lead { font-size:.95rem; opacity:.85; margin-top:8px; }

/* ═══ LAYOUT ═══ */
.page-wrap { max-width:var(--max-w); margin:0 auto; padding:32px 20px 56px; display:grid; grid-template-columns:1fr 280px; gap:32px; align-items:start; }
@media(max-width:860px) { .page-wrap { grid-template-columns:1fr; } }
.content-area {}

/* ═══ SECTION TITLES ═══ */
.section-label { font-family:var(--font-body); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--c-orange); display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.section-label::before { content:''; display:block; width:22px; height:3px; background:var(--brand-orange); border-radius:2px; flex-shrink:0; }
.section-title { font-family:var(--font-head); font-size:1.4rem; color:var(--c-purple); font-weight:400; line-height:1.25; margin-bottom:18px; }
.content-box { background:var(--c-white); border-radius:var(--radius-lg); border:1px solid var(--c-border); padding:30px 32px; box-shadow:var(--shadow); }
.content-box ul	{padding-left: 25px;}
.content-box ol	{padding-left: 25px;}
@media(max-width:600px) { .content-box { padding:20px 18px; } }

/* ═══ SIDEBAR ═══ */
.sidebar { display:flex; flex-direction:column; gap:22px; }
.sidebar-card { background:var(--c-white); border-radius:var(--radius-lg); border:1px solid var(--c-border); overflow:hidden; box-shadow:var(--shadow); }
.sidebar-card-head { background:var(--c-purple); color:#fff; padding:12px 18px; font-family:var(--font-body); font-size:.875rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; display:flex; align-items:center; gap:8px; }
.sidebar-card-head svg { width:16px; height:16px; fill:rgba(255,255,255,.8); flex-shrink:0; }
.sidebar-card-body { padding:18px; }
.sidebar-links { list-style:none; }
.sidebar-links li { border-bottom:1px solid var(--c-green-light); }
.sidebar-links li:last-child { border-bottom:none; }
.sidebar-links li a { display:flex; align-items:center; gap:10px; padding:10px 6px; font-size:.9rem; font-weight:500; color:var(--c-purple); text-decoration:none; border-left:3px solid transparent; transition:background var(--trans),border-color var(--trans); border-radius:0 var(--radius) var(--radius) 0; }
.sidebar-links li a:hover { background:var(--c-orange-tint); border-left-color:var(--brand-orange); }
.sidebar-links li a:focus-visible { outline:3px solid var(--c-focus); outline-offset:1px; }
.sidebar-links li a::before { content:''; display:block; width:6px; height:6px; border-top:2px solid var(--brand-orange); border-right:2px solid var(--brand-orange); transform:rotate(45deg); flex-shrink:0; }
.contact-detail { display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px solid var(--c-green-light); font-size:.9rem; color:var(--c-text); }
.contact-detail:last-child { border-bottom:none; }
.contact-icon { width:34px; height:34px; border-radius:var(--radius); background:var(--c-orange-tint); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-icon svg { width:16px; height:16px; fill:var(--c-orange); }
.contact-detail strong { display:block; font-size:.8rem; text-transform:uppercase; letter-spacing:.05em; color:var(--c-muted); margin-bottom:1px; }
.contact-detail a { color:var(--c-purple); font-weight:500; }

/* ═══ BUTTONS ═══ */
.btn-main { display:inline-flex; align-items:center; gap:8px; background:var(--c-orange); color:#fff; padding:11px 24px; border-radius:var(--radius); font-family:var(--font-body); font-weight:600; font-size:.88rem; text-decoration:none; transition:background var(--trans),transform var(--trans); }
.btn-main:hover { background:var(--c-purple); transform:translateY(-1px); color:#fff; }
.btn-main:focus-visible { outline:3px solid var(--c-focus); outline-offset:3px; color:#fff; text-decoration:none; }
.btn-amber { background:var(--brand-orange); }
.btn-amber:hover { background:var(--c-amber-dark); }

/* ═══ INFO / ALERT BOXES ═══ */
.info-box { background:var(--c-orange-tint); border-left:4px solid var(--brand-orange); border-radius:0 var(--radius) var(--radius) 0; padding:16px 20px; margin-bottom:20px; font-size:.9rem; color:var(--c-orange); line-height:1.6; }
.info-box strong { display:block; font-size:.95rem; margin-bottom:4px; }
.warn-box { background:var(--c-yellow-tint); border-left:4px solid var(--brand-yellow); border-radius:0 var(--radius) var(--radius) 0; padding:16px 20px; margin-bottom:20px; font-size:.9rem; color:var(--c-orange); }

/* ═══ TABLE ═══ */
.data-table { width:100%; border-collapse:collapse; font-size:.88rem; }
.data-table th { background:var(--c-purple); color:#fff; padding:10px 14px; text-align:left; font-weight:600; font-size:.875rem; letter-spacing:.04em; }
.data-table td { padding:10px 14px; border-bottom:1px solid var(--c-green-light); color:var(--c-text); vertical-align:top; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:nth-child(even) td { background:rgba(106,72,149,.06); }
.data-table-wrap { overflow-x:auto; border-radius:var(--radius-lg); border:1px solid var(--c-border); box-shadow:var(--shadow); margin-bottom:24px; }

/* ═══ FOOTER ═══ */
footer { background:var(--c-orange); color:rgba(255,255,255); padding:44px 20px 20px; margin-top:16px; }
.footer-inner { max-width:var(--max-w); margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:32px; margin-bottom:32px; }
.footer-brand-name { font-family:var(--font-head); font-size:1.05rem; color:#fff; margin-bottom:8px; line-height:1.3; font-weight:400; }
.footer-tagline { font-size:.875rem; color:rgba(255,255,255); line-height:1.6; }
.footer-col h2 { font-family:var(--font-body); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255); margin-bottom:12px; padding-bottom:6px; border-bottom:1px solid rgba(255,255,255); }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:6px; }
.footer-col ul li a { color:rgba(255,255,255,.92); font-size:.9rem; text-decoration:none; transition:color var(--trans); }
.footer-col ul li a:hover { color:#fff; text-decoration:underline; }
.footer-col ul li a:focus-visible { outline:2px solid var(--c-amber); outline-offset:2px; color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255); padding-top:18px; display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; align-items:center; font-size:.8rem; color:rgba(255,255,255); }
.footer-bottom a { color:rgba(255,255,255); }
.footer-bottom a:hover { color:#fff; text-decoration:underline;}
.footer-bottom a:focus-visible { outline:2px solid var(--c-amber); outline-offset:2px; }
.wcag-tag { display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(255,255,255,.15); border-radius:30px; padding:4px 12px; font-size:.7rem; font-weight:700; color:rgba(255,255,255); letter-spacing:.05em; }

/* ═══ RESPONSIVE ═══ */
@media(max-width:700px) {
  .nav-toggle { display:flex; }
  .nav-list { display:none; flex-direction:column; width:100%; padding-bottom:8px; background:var(--c-green-mid); }
  .nav-list.open { display:flex; }
  .nav-list > li > a, .nav-list > li > button { height:auto; padding:13px 20px; border-bottom:none; border-left:3px solid transparent; width:100%; justify-content:space-between; }
  .nav-list > li > a:hover, .nav-list > li > button:hover { border-bottom:none; border-left-color:var(--c-amber); }
  .nav-dropdown { position:static; border-radius:0; box-shadow:none; border:none; background:rgba(0,0,0,.12); padding:0; }
  .nav-dropdown li a { color:rgba(255,255,255,.85); padding-left:36px; }
  .nav-dropdown li a:hover { background:rgba(255,255,255,.08); color:#fff; }
  .page-band h1 { font-size:1.5rem; }
  .header-icons { gap:4px; }
  .icon-link { min-width:46px; padding:6px 7px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; } html { scroll-behavior:auto; } }
@media print { nav,.sidebar,footer,#cookie-banner { display:none!important; } .page-wrap { display:block; } }