/*
Theme Name: ОШ Котража — Модерна школа
Theme URI: https://kotraza-dragacevo.edu.rs/
Author: ОШ Котража
Author URI: https://kotraza-dragacevo.edu.rs/
Description: Модерна, приступачна и разнобојна WordPress тема за Основну школу „Котража“. Подржава вести, документа, догађаје, галерије, школске странице и једноставан унос садржаја.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: os-kotraza
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: education, school, news, custom-logo, custom-menu, featured-images, accessibility-ready, responsive-layout
*/

:root {
  --navy: #17254c;
  --navy-2: #24386d;
  --blue: #4267f5;
  --cyan: #22b7cf;
  --green: #39bd78;
  --yellow: #ffc94d;
  --orange: #ff8a48;
  --pink: #f05e91;
  --purple: #8a62e8;
  --red: #e84b5f;
  --ink: #18213d;
  --muted: #66708f;
  --paper: #f6f8ff;
  --white: #ffffff;
  --line: #dfe5f4;
  --shadow: 0 18px 55px rgba(27, 49, 101, .13);
  --shadow-sm: 0 10px 30px rgba(27, 49, 101, .09);
  --radius: 24px;
  --radius-sm: 16px;
  --container: 1180px;
  --font-size-base: 17px;
}

html[data-theme="dark"] {
  --ink: #f4f7ff;
  --muted: #bdc7e5;
  --paper: #111831;
  --white: #192242;
  --line: #2b3965;
  --navy: #0b1024;
  --navy-2: #111a38;
  --shadow: 0 18px 55px rgba(0,0,0,.28);
  --shadow-sm: 0 10px 30px rgba(0,0,0,.22);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: var(--font-size-base); }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
}
body.admin-bar .site-header { top: 32px; }
a { color: var(--blue); text-decoration: none; }
a:hover { text-decoration: none; }
img { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: var(--yellow); color: #111; }

.container { width: min(calc(100% - 32px), var(--container)); margin-inline: auto; }
.narrow { width: min(calc(100% - 32px), 860px); margin-inline: auto; }
.section { padding: 82px 0; }
.section-sm { padding: 54px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 32px; }
.section-heading h2 { margin: 0; font-size: clamp(1.7rem, 4vw, 2.6rem); line-height: 1.15; letter-spacing: -.03em; }
.section-heading p { max-width: 650px; color: var(--muted); margin: 8px 0 0; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 10px; color: var(--blue); font-size: .78rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 30px; height: 4px; border-radius: 20px; background: linear-gradient(90deg, var(--pink), var(--yellow)); }

.skip-link { position: fixed; left: 16px; top: -100px; z-index: 99999; padding: 12px 18px; border-radius: 10px; background: #fff; color: #111; font-weight: 800; box-shadow: var(--shadow); }
.skip-link:focus { top: 16px; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.topbar { background: var(--navy); color: #eef2ff; font-size: .83rem; }
.topbar-inner { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.topbar-contact, .topbar-tools { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.topbar a { color: #fff; opacity: .96; }
.topbar a:hover { opacity: 1; text-decoration: underline; }
.tool-btn { border: 0; color: #fff; background: rgba(255,255,255,.12); border-radius: 9px; min-width: 34px; min-height: 30px; padding: 4px 9px; cursor: pointer; font-weight: 850; }
.tool-btn:hover, .tool-btn:focus-visible { background: rgba(255,255,255,.24); }

.site-header { position: sticky; top: 0; z-index: 1000; background: color-mix(in srgb, var(--white) 92%, transparent); backdrop-filter: blur(18px); border-bottom: 1px solid color-mix(in srgb, var(--line) 74%, transparent); }
.header-inner { min-height: 84px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; }
.site-brand { display: inline-flex; align-items: center; gap: 13px; color: var(--ink); min-width: 250px; }
.site-brand:hover { color: var(--ink); }
.site-brand img.custom-logo { width: auto; max-height: 58px; }
.brand-mark { width: 56px; height: 56px; flex: 0 0 56px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(135deg, var(--blue), var(--purple)); color: #fff; box-shadow: 0 10px 24px rgba(66,103,245,.28); position: relative; overflow: hidden; }
.brand-mark::before, .brand-mark::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.25); }
.brand-mark::before { width:30px; height:30px; right:-12px; top:-8px; }
.brand-mark::after { width:22px; height:22px; left:-8px; bottom:-8px; }
.brand-mark svg { width: 34px; height: 34px; position: relative; z-index: 1; }
.brand-text strong { display:block; font-size:1.02rem; line-height:1.1; letter-spacing:-.02em; }
.brand-text span { display:block; margin-top:4px; color:var(--muted); font-size:.76rem; font-weight:700; }

.primary-nav { justify-self: center; }
.primary-nav ul { list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:4px; }
.primary-nav li { position:relative; }
.primary-nav a { display:flex; align-items:center; min-height:44px; padding:9px 11px; border-radius:12px; color:var(--ink); font-size:.88rem; font-weight:800; white-space:nowrap; }
.primary-nav > div > ul > li > a:hover, .primary-nav > div > ul > li.current-menu-item > a, .primary-nav > div > ul > li.current-menu-ancestor > a { background: color-mix(in srgb, var(--blue) 10%, var(--white)); color: var(--blue); }
.primary-nav .sub-menu { position:absolute; top:calc(100% + 10px); left:0; min-width:245px; padding:10px; border:1px solid var(--line); border-radius:16px; background:var(--white); box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(8px); transition:.2s ease; display:block; }
.primary-nav .sub-menu .sub-menu { left:100%; top:0; }
.primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu { opacity:1; visibility:visible; transform:none; }
.primary-nav .sub-menu a { min-height:38px; padding:8px 10px; white-space:normal; }
.primary-nav .sub-menu a:hover { background:var(--paper); color:var(--blue); }
.header-actions { display:flex; align-items:center; gap:8px; }
.icon-btn { width:44px; height:44px; display:grid; place-items:center; border-radius:14px; border:1px solid var(--line); background:var(--white); color:var(--ink); cursor:pointer; }
.icon-btn:hover, .icon-btn:focus-visible { border-color:var(--blue); color:var(--blue); }
.menu-toggle { display:none; }

.notice-bar { background: linear-gradient(90deg, #3659d9, #6b4fd8); color:#fff; }
.notice-inner { min-height:44px; display:flex; align-items:center; gap:13px; }
.notice-label { display:inline-flex; align-items:center; gap:7px; padding:5px 10px; border-radius:9px; background:var(--yellow); color:#241c00; font-size:.72rem; font-weight:950; text-transform:uppercase; letter-spacing:.07em; }
.notice-text { color:#fff; font-size:.87rem; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.notice-text:hover { text-decoration:underline; }

.hero { position:relative; overflow:hidden; padding:86px 0 72px; background:
  radial-gradient(circle at 4% 12%, rgba(240,94,145,.18), transparent 22%),
  radial-gradient(circle at 85% 12%, rgba(34,183,207,.2), transparent 27%),
  linear-gradient(135deg, color-mix(in srgb, var(--white) 96%, var(--blue)), color-mix(in srgb, var(--paper) 88%, var(--cyan)));
}
.hero::before { content:""; position:absolute; inset:0; opacity:.38; background-image:radial-gradient(var(--blue) .8px, transparent .8px); background-size:24px 24px; mask-image:linear-gradient(to bottom, #000, transparent 78%); }
.hero-grid { position:relative; display:grid; grid-template-columns:1.06fr .94fr; align-items:center; gap:54px; }
.hero-copy h1 { max-width:760px; margin:0; font-size:clamp(2.55rem, 6vw, 5.05rem); line-height:.99; letter-spacing:-.055em; }
.hero-copy h1 .accent { color:var(--blue); position:relative; display:inline-block; }
.hero-copy h1 .accent::after { content:""; position:absolute; left:0; right:0; bottom:-5px; height:11px; border-radius:50%; background:var(--yellow); opacity:.72; transform:rotate(-1deg); z-index:-1; }
.hero-copy p { max-width:690px; margin:26px 0 0; color:var(--muted); font-size:clamp(1.03rem, 2vw, 1.22rem); }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:32px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:50px; padding:12px 21px; border-radius:14px; border:1px solid transparent; font-weight:900; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease; }
.btn:hover { transform:translateY(-2px); }
.btn-primary { color:#fff; background:linear-gradient(135deg, var(--blue), #6d4edf); box-shadow:0 12px 28px rgba(66,103,245,.28); }
.btn-primary:hover { color:#fff; box-shadow:0 16px 34px rgba(66,103,245,.36); }
.btn-secondary { color:var(--ink); background:var(--white); border-color:var(--line); box-shadow:var(--shadow-sm); }
.btn-secondary:hover { color:var(--blue); border-color:var(--blue); }
.hero-meta { display:flex; gap:20px; flex-wrap:wrap; margin-top:30px; color:var(--muted); font-size:.83rem; font-weight:760; }
.hero-meta span { display:flex; align-items:center; gap:7px; }
.hero-meta i { width:9px; height:9px; border-radius:50%; background:var(--green); box-shadow:0 0 0 5px rgba(57,189,120,.15); }
.hero-visual { position:relative; }
.hero-card { position:relative; padding:20px; border-radius:36px; background:rgba(255,255,255,.68); border:1px solid rgba(255,255,255,.86); box-shadow:0 34px 80px rgba(30,58,125,.18); backdrop-filter:blur(14px); transform:rotate(1.2deg); }
html[data-theme="dark"] .hero-card { background:rgba(25,34,66,.72); border-color:rgba(255,255,255,.08); }
.hero-card img { display:block; width:100%; border-radius:26px; }
.float-badge { position:absolute; display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:16px; background:var(--white); color:var(--ink); box-shadow:var(--shadow); font-size:.78rem; font-weight:900; }
.float-badge b { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; color:#fff; }
.float-badge.one { left:-30px; top:54px; transform:rotate(-4deg); }
.float-badge.one b { background:var(--pink); }
.float-badge.two { right:-20px; bottom:48px; transform:rotate(3deg); }
.float-badge.two b { background:var(--green); }

.quick-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin-top:-30px; position:relative; z-index:4; }
.quick-card { position:relative; overflow:hidden; min-height:160px; padding:24px; border-radius:22px; background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-sm); color:var(--ink); transition:.22s ease; }
.quick-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); color:var(--ink); }
.quick-card::after { content:""; position:absolute; width:95px; height:95px; border-radius:50%; right:-40px; bottom:-45px; background:var(--card-accent); opacity:.15; }
.quick-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:color-mix(in srgb, var(--card-accent) 14%, var(--white)); color:var(--card-accent); font-size:1.45rem; }
.quick-card h3 { margin:16px 0 4px; font-size:1rem; }
.quick-card p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.45; }
.quick-card:nth-child(1) { --card-accent:var(--blue); }
.quick-card:nth-child(2) { --card-accent:var(--pink); }
.quick-card:nth-child(3) { --card-accent:var(--green); }
.quick-card:nth-child(4) { --card-accent:var(--orange); }
.quick-card:nth-child(5) { --card-accent:var(--purple); }
.quick-card:nth-child(6) { --card-accent:var(--cyan); }
.quick-card:nth-child(7) { --card-accent:var(--red); }
.quick-card:nth-child(8) { --card-accent:#9a7928; }

.news-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:24px; }
.post-card { min-width:0; overflow:hidden; display:flex; flex-direction:column; border-radius:var(--radius); background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-sm); transition:.22s ease; }
.post-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.post-card-media { display:block; aspect-ratio:16/10; overflow:hidden; background:linear-gradient(135deg, color-mix(in srgb, var(--blue) 18%, var(--white)), color-mix(in srgb, var(--pink) 16%, var(--white))); }
.post-card-media img { width:100%; height:100%; object-fit:cover; transition:transform .45s ease; }
.post-card:hover .post-card-media img { transform:scale(1.045); }
.post-card-placeholder { height:100%; display:grid; place-items:center; color:var(--blue); font-size:3rem; font-weight:950; }
.post-card-body { padding:22px; display:flex; flex-direction:column; flex:1; }
.post-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; color:var(--muted); font-size:.75rem; font-weight:750; }
.category-pill { display:inline-flex; padding:5px 9px; border-radius:999px; background:color-mix(in srgb, var(--blue) 10%, var(--white)); color:var(--blue); font-size:.7rem; font-weight:900; }
.post-card h3 { margin:12px 0 9px; font-size:1.19rem; line-height:1.32; letter-spacing:-.02em; }
.post-card h3 a { color:var(--ink); }
.post-card h3 a:hover { color:var(--blue); }
.post-card p { margin:0 0 16px; color:var(--muted); font-size:.88rem; }
.read-more { margin-top:auto; display:inline-flex; align-items:center; gap:7px; color:var(--blue); font-size:.82rem; font-weight:900; }
.read-more:hover { gap:11px; }

.color-panel { background:linear-gradient(135deg, var(--navy), #293f82); color:#fff; position:relative; overflow:hidden; }
.color-panel::before { content:""; position:absolute; width:500px; height:500px; border-radius:50%; right:-180px; top:-260px; background:radial-gradient(circle, rgba(255,201,77,.3), transparent 65%); }
.color-panel .section-heading h2, .color-panel .section-heading p { color:#fff; }
.values-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; position:relative; }
.value-card { padding:26px; border-radius:22px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(12px); }
.value-card .value-icon { font-size:2rem; }
.value-card h3 { margin:14px 0 6px; font-size:1.05rem; }
.value-card p { margin:0; color:rgba(255,255,255,.76); font-size:.85rem; }

.events-layout { display:grid; grid-template-columns:.78fr 1.22fr; gap:26px; align-items:stretch; }
.event-intro { padding:34px; border-radius:var(--radius); color:#fff; background:linear-gradient(145deg, var(--pink), #c54379); box-shadow:var(--shadow); }
.event-intro h2 { margin:0 0 12px; font-size:2rem; line-height:1.12; }
.event-intro p { color:rgba(255,255,255,.85); }
.event-list { display:grid; gap:13px; }
.event-item { display:grid; grid-template-columns:74px 1fr auto; align-items:center; gap:17px; padding:18px; border-radius:18px; background:var(--white); border:1px solid var(--line); }
.event-date { display:grid; place-items:center; min-height:68px; padding:8px; border-radius:15px; background:color-mix(in srgb, var(--orange) 13%, var(--white)); color:var(--orange); text-align:center; font-weight:950; line-height:1.05; }
.event-date strong { display:block; font-size:1.6rem; }
.event-date span { font-size:.7rem; text-transform:uppercase; }
.event-info h3 { margin:0 0 5px; font-size:1rem; }
.event-info p { margin:0; color:var(--muted); font-size:.8rem; }
.event-arrow { color:var(--blue); font-size:1.3rem; }

.cta { padding:38px; border-radius:32px; background:linear-gradient(130deg, color-mix(in srgb, var(--yellow) 90%, #fff), #ffd972); color:#302500; display:flex; align-items:center; justify-content:space-between; gap:24px; overflow:hidden; position:relative; }
.cta::after { content:"✦"; position:absolute; right:26%; top:-55px; font-size:10rem; color:rgba(255,255,255,.35); transform:rotate(15deg); }
.cta h2 { margin:0; font-size:clamp(1.5rem, 4vw, 2.45rem); line-height:1.1; }
.cta p { margin:8px 0 0; max-width:720px; }
.cta .btn { position:relative; z-index:1; background:#302500; color:#fff; flex:none; }

.page-hero { padding:64px 0 52px; background:linear-gradient(140deg, color-mix(in srgb, var(--blue) 9%, var(--white)), color-mix(in srgb, var(--cyan) 11%, var(--paper))); border-bottom:1px solid var(--line); }
.page-hero h1 { margin:0; font-size:clamp(2.1rem, 5vw, 3.7rem); line-height:1.05; letter-spacing:-.045em; }
.page-hero p { margin:14px 0 0; color:var(--muted); max-width:760px; }
.breadcrumbs { margin-bottom:13px; color:var(--muted); font-size:.78rem; font-weight:700; }
.breadcrumbs a { color:var(--muted); }
.breadcrumbs a:hover { color:var(--blue); }
.content-wrap { padding:60px 0 86px; }
.content-grid { display:grid; grid-template-columns:minmax(0, 1fr) 310px; gap:38px; align-items:start; }
.entry-content, .content-card { padding:clamp(24px, 5vw, 48px); border-radius:var(--radius); background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-sm); }
.entry-content > *:first-child { margin-top:0; }
.entry-content h2, .entry-content h3, .entry-content h4 { line-height:1.22; letter-spacing:-.02em; margin-top:1.6em; }
.entry-content h2 { font-size:1.7rem; }
.entry-content h3 { font-size:1.3rem; }
.entry-content blockquote { margin:26px 0; padding:18px 22px; border-left:5px solid var(--yellow); border-radius:0 14px 14px 0; background:var(--paper); }
.entry-content table { width:100%; border-collapse:collapse; display:block; overflow-x:auto; }
.entry-content th, .entry-content td { padding:11px 13px; border:1px solid var(--line); text-align:left; }
.entry-content th { background:var(--paper); }
.entry-content ul, .entry-content ol { padding-left:1.25rem; }
.entry-content img { border-radius:15px; }
.entry-content .wp-block-file { padding:14px; border:1px solid var(--line); border-radius:13px; background:var(--paper); }
.sidebar { display:grid; gap:18px; }
.widget-card { padding:23px; border-radius:20px; background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow-sm); }
.widget-card h3 { margin:0 0 14px; font-size:1rem; }
.widget-card ul { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.widget-card li a { color:var(--ink); font-size:.84rem; font-weight:750; }
.widget-card li a:hover { color:var(--blue); }

.single-featured { margin:0 0 28px; border-radius:22px; overflow:hidden; }
.single-meta { display:flex; align-items:center; flex-wrap:wrap; gap:11px; margin:18px 0 0; color:var(--muted); font-size:.8rem; }
.share-row { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:32px; padding-top:24px; border-top:1px solid var(--line); }
.share-row a { display:inline-flex; align-items:center; padding:8px 11px; border:1px solid var(--line); border-radius:10px; color:var(--ink); font-size:.78rem; font-weight:800; }
.share-row a:hover { color:var(--blue); border-color:var(--blue); }

.document-list { display:grid; gap:13px; }
.document-item { display:grid; grid-template-columns:52px 1fr auto; align-items:center; gap:15px; padding:17px; border-radius:16px; background:var(--white); border:1px solid var(--line); }
.document-icon { width:52px; height:52px; display:grid; place-items:center; border-radius:14px; background:color-mix(in srgb, var(--red) 12%, var(--white)); color:var(--red); font-size:1.35rem; }
.document-info h3 { margin:0 0 3px; font-size:.98rem; }
.document-info p { margin:0; color:var(--muted); font-size:.76rem; }
.document-download { display:inline-flex; align-items:center; padding:9px 12px; border-radius:10px; background:var(--blue); color:#fff; font-size:.76rem; font-weight:900; }
.document-download:hover { color:#fff; filter:brightness(1.06); }

.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:26px; }
.contact-info { display:grid; gap:14px; }
.contact-tile { display:flex; gap:14px; align-items:flex-start; padding:19px; border-radius:17px; background:var(--paper); border:1px solid var(--line); }
.contact-tile b { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border-radius:13px; background:var(--blue); color:#fff; }
.contact-tile strong { display:block; }
.contact-tile span, .contact-tile a { color:var(--muted); font-size:.86rem; }
.school-form { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
.school-form .full { grid-column:1/-1; }
.school-form label { display:block; margin-bottom:5px; font-size:.78rem; font-weight:850; }
.school-form input, .school-form textarea { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:12px; background:var(--paper); color:var(--ink); outline:none; }
.school-form input:focus, .school-form textarea:focus { border-color:var(--blue); box-shadow:0 0 0 4px rgba(66,103,245,.12); }
.school-form textarea { min-height:160px; resize:vertical; }
.form-message { grid-column:1/-1; padding:12px 14px; border-radius:12px; font-weight:750; }
.form-message.success { background:rgba(57,189,120,.13); color:#13824a; }
.form-message.error { background:rgba(232,75,95,.12); color:#ba2f43; }

.pagination { display:flex; justify-content:center; gap:7px; margin-top:36px; }
.pagination .page-numbers { display:grid; place-items:center; min-width:42px; height:42px; padding:0 10px; border-radius:12px; background:var(--white); border:1px solid var(--line); color:var(--ink); font-weight:850; }
.pagination .current, .pagination a:hover { background:var(--blue); border-color:var(--blue); color:#fff; }
.empty-state { padding:45px; text-align:center; border:2px dashed var(--line); border-radius:var(--radius); color:var(--muted); }

.search-drawer { position:fixed; inset:0; z-index:3000; display:none; align-items:flex-start; justify-content:center; padding:120px 16px 20px; background:rgba(8,14,34,.78); backdrop-filter:blur(10px); }
.search-drawer.is-open { display:flex; }
.search-panel { width:min(720px, 100%); padding:28px; border-radius:24px; background:var(--white); box-shadow:var(--shadow); }
.search-panel-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; }
.search-panel-top h2 { margin:0; }
.search-form { display:flex; gap:9px; }
.search-form label { flex:1; }
.search-field { width:100%; min-height:50px; padding:11px 14px; border:1px solid var(--line); border-radius:13px; color:var(--ink); background:var(--paper); }
.search-submit { min-height:50px; padding:0 18px; border:0; border-radius:13px; background:var(--blue); color:#fff; font-weight:900; cursor:pointer; }

.site-footer { margin-top:0; color:#e8edff; background:var(--navy); }
.footer-top { padding:60px 0 42px; }
.footer-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1.1fr; gap:34px; }
.footer-brand { display:flex; gap:13px; align-items:center; }
.footer-brand .brand-mark { box-shadow:none; }
.footer-brand strong { color:#fff; }
.footer-about { margin:18px 0 0; color:#b8c2e2; font-size:.86rem; max-width:380px; }
.site-footer h3 { margin:0 0 15px; color:#fff; font-size:.94rem; }
.footer-links { list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.footer-links a { color:#c3ccea; font-size:.82rem; }
.footer-links a:hover { color:#fff; text-decoration:underline; }
.footer-contact { display:grid; gap:10px; color:#c3ccea; font-size:.82rem; }
.footer-contact a { color:#c3ccea; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); }
.footer-bottom-inner { min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:#9ca9d0; font-size:.75rem; }
.footer-bottom-links { display:flex; gap:14px; }
.footer-bottom-links a { color:#b8c2e2; }

@media (max-width: 1100px) {
  .primary-nav { position:fixed; inset:126px 16px auto; max-height:calc(100vh - 150px); overflow:auto; padding:16px; border:1px solid var(--line); border-radius:20px; background:var(--white); box-shadow:var(--shadow); opacity:0; visibility:hidden; transform:translateY(-10px); transition:.2s ease; }
  .primary-nav.is-open { opacity:1; visibility:visible; transform:none; }
  .primary-nav ul { display:block; }
  .primary-nav a { justify-content:space-between; }
  .primary-nav .sub-menu { position:static; display:none; min-width:0; margin:4px 0 6px 14px; padding:5px; box-shadow:none; opacity:1; visibility:visible; transform:none; border:0; border-left:2px solid var(--line); border-radius:0; }
  .primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu { display:block; }
  .menu-toggle { display:grid; }
  .hero-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .quick-grid { grid-template-columns:repeat(2, 1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width: 820px) {
  body.admin-bar .site-header { top:46px; }
  .topbar-contact .address { display:none; }
  .header-inner { min-height:74px; }
  .brand-text span { display:none; }
  .site-brand { min-width:0; }
  .primary-nav { inset:116px 16px auto; }
  .hero { padding:62px 0 50px; }
  .hero-grid { grid-template-columns:1fr; }
  .hero-visual { width:min(620px, 92%); margin:0 auto; }
  .hero-card { transform:none; }
  .quick-grid { margin-top:-18px; }
  .news-grid { grid-template-columns:repeat(2, 1fr); }
  .values-grid { grid-template-columns:repeat(2, 1fr); }
  .events-layout, .contact-grid, .content-grid { grid-template-columns:1fr; }
  .sidebar { grid-template-columns:repeat(2, 1fr); }
}

@media (max-width: 580px) {
  :root { --font-size-base:16px; }
  .container, .narrow { width:min(calc(100% - 22px), var(--container)); }
  .section { padding:60px 0; }
  .topbar-inner { min-height:38px; }
  .topbar-contact { gap:10px; }
  .topbar-contact .email { display:none; }
  .topbar-tools span { display:none; }
  .brand-mark { width:48px; height:48px; flex-basis:48px; border-radius:15px; }
  .brand-text strong { font-size:.9rem; }
  .header-actions .theme-toggle { display:none; }
  .primary-nav { inset:105px 11px auto; }
  .notice-label { display:none; }
  .hero-copy h1 { font-size:clamp(2.45rem, 14vw, 4rem); }
  .hero-actions .btn { width:100%; }
  .hero-meta { display:grid; gap:9px; }
  .float-badge.one { left:-8px; top:32px; }
  .float-badge.two { right:-8px; bottom:25px; }
  .quick-grid, .news-grid, .values-grid, .sidebar { grid-template-columns:1fr; }
  .quick-card { min-height:145px; }
  .section-heading { align-items:flex-start; flex-direction:column; }
  .event-item { grid-template-columns:64px 1fr; }
  .event-arrow { display:none; }
  .cta { padding:28px; flex-direction:column; align-items:flex-start; }
  .cta .btn { width:100%; }
  .school-form { grid-template-columns:1fr; }
  .school-form .full { grid-column:auto; }
  .document-item { grid-template-columns:48px 1fr; }
  .document-download { grid-column:1/-1; justify-content:center; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom-inner { padding:14px 0; flex-direction:column; align-items:flex-start; }
}

@media print {
  .topbar, .site-header, .notice-bar, .site-footer, .sidebar, .share-row, .btn { display:none !important; }
  body { background:#fff; color:#000; }
  .page-hero { padding:20px 0; background:#fff; }
  .content-wrap { padding:10px 0; }
  .content-grid { display:block; }
  .entry-content { border:0; box-shadow:none; padding:0; }
}