/* =========================================================
   Shared responsive styling for standalone public menu pages
   ========================================================= */
:root { --page-primary:#075985; --page-primary-dark:#0c3d5a; --page-accent:#f59e0b; --page-surface:#f5f8fb; --page-text:#172033; }
* { box-sizing:border-box; }
a { text-decoration:none; }
.page-hero { color:#fff; background:linear-gradient(125deg,rgb(7 89 133 / .98),rgb(12 61 90 / .94)),radial-gradient(circle at 85% 30%,#38bdf8,transparent 35%); }
.breadcrumb { --bs-breadcrumb-divider-color:rgb(255 255 255 / .5); --bs-breadcrumb-item-active-color:rgb(255 255 255 / .72); }
.breadcrumb a { color:#fff; }
.hero-copy { display:flex; align-items:center; gap:1.25rem; max-width:850px; }
.hero-icon { display:grid; flex:0 0 auto; place-items:center; width:72px; height:72px; border-radius:20px; background:rgb(255 255 255 / .14); font-size:2rem; }
.hero-copy h1 { margin:0 0 .55rem; font-weight:750; }
.hero-copy p { margin:0; color:rgb(255 255 255 / .82); font-size:1.05rem; line-height:1.7; }
.topic-card { display:flex; align-items:center; gap:1rem; padding:1.2rem; border:1px solid #dfe7ef; border-radius:14px; background:#fff; box-shadow:0 8px 25px rgb(15 23 42 / .045); }
.topic-card span { display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; border-radius:50%; color:#fff; background:var(--page-primary); font-weight:700; }
.topic-card h2 { margin:0; font-size:1rem; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.4rem; }
.section-heading span:first-child { color:var(--page-primary); font-size:.76rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.section-heading h2 { margin:.25rem 0 0; font-size:1.55rem; }
.record-count { white-space:nowrap; color:#64748b; }
.content-card { display:flex; overflow:hidden; border:1px solid #dfe7ef; border-radius:15px; background:#fff; box-shadow:0 9px 28px rgb(15 23 42 / .05); transition:transform .2s ease,box-shadow .2s ease; }
.content-card:hover { transform:translateY(-3px); box-shadow:0 14px 35px rgb(15 23 42 / .1); }
.content-card-icon { display:grid; place-items:center; flex:0 0 62px; color:#fff; background:linear-gradient(180deg,var(--page-primary),var(--page-primary-dark)); font-size:1.4rem; }
.content-card-body { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:1.2rem; min-width:0; }
.content-category { color:var(--page-primary); font-size:.72rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.content-card h3 { margin:.35rem 0 .55rem; font-size:1.05rem; }
.content-card p { color:#64748b; font-size:.9rem; line-height:1.6; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.empty-state { padding:3.5rem 1rem; border:1px dashed #b8c5d1; border-radius:16px; text-align:center; background:#fff; color:#64748b; }
.empty-state i { display:block; color:var(--page-primary); font-size:2.3rem; }
.empty-state h3 { margin:.8rem 0 .35rem; color:var(--page-text); font-size:1.1rem; }
@media (max-width:767.98px) { .hero-copy { align-items:flex-start; } .hero-icon { width:54px; height:54px; border-radius:15px; font-size:1.45rem; } .section-heading { align-items:flex-start; flex-direction:column; } }
@media (max-width:420px) { .hero-copy { display:block; } .hero-icon { margin-bottom:1rem; } .content-card-icon { flex-basis:48px; } }