/* ═══════════════════════════════════════════════════════════════
   The Workshop Reading Centre — Design System
   Primary: hsl(174,62%,35%) ≈ #229190 (teal)
   Foreground: hsl(210,20%,15%) ≈ #1e2837 (dark navy)
   Font: Playfair Display (headings) + Inter (body)
   ═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --primary:       hsl(174,62%,35%);
  --primary-light: hsl(174,62%,45%);
  --primary-10:    hsla(174,62%,35%,0.1);
  --primary-20:    hsla(174,62%,35%,0.2);
  --secondary:     hsl(174,30%,92%);
  --accent:        hsl(174,30%,92%);
  --fg:            hsl(210,20%,15%);
  --fg-70:         hsla(210,20%,15%,0.7);
  --fg-60:         hsla(210,20%,15%,0.6);
  --muted:         hsl(210,15%,45%);
  --muted-bg:      hsl(210,20%,96%);
  --card:          #fff;
  --border:        hsl(210,15%,88%);
  --bg:            #fff;
  --footer-teal:   #4ec9b8;
  --radius:        0.75rem;
  --shadow-sm:     0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md:     0 4px 16px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.05);
  --shadow-lg:     0 12px 40px rgba(0,0,0,0.12), 0 4px 12px rgba(0,0,0,0.06);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { font-family:'Inter',system-ui,sans-serif; background:var(--bg); color:var(--fg); line-height:1.6; }
img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
button { cursor:pointer; font-family:'Inter',system-ui,sans-serif; border:none; background:none; }
main { min-height:60vh; }

h1,h2,h3,h4,h5 { font-family:'Playfair Display',Georgia,serif; line-height:1.2; }

/* Scrollbar */
::-webkit-scrollbar { width:5px; }
::-webkit-scrollbar-track { background:#f1f5f9; }
::-webkit-scrollbar-thumb { background:var(--primary); border-radius:3px; }

/* ── Animations ─────────────────────────────────────────────── */
@keyframes fadeInUp  { from{opacity:0;transform:translateY(28px)} to{opacity:1;transform:none} }
@keyframes fadeInLeft{ from{opacity:0;transform:translateX(-30px)} to{opacity:1;transform:none} }
@keyframes spin      { to{transform:rotate(360deg)} }
@keyframes shimmer   { 0%{background-position:-200% 0} 100%{background-position:200% 0} }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .6s ease,transform .6s ease; }
.reveal.left  { transform:translateX(-30px); }
.reveal.right { transform:translateX(30px); }
.reveal.visible { opacity:1; transform:none; }
.reveal-delay-1 { transition-delay:.1s; }
.reveal-delay-2 { transition-delay:.2s; }
.reveal-delay-3 { transition-delay:.3s; }
.reveal-delay-4 { transition-delay:.4s; }

/* ── Buttons ─────────────────────────────────────────────────── */
.btn-primary {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.75rem; background:var(--primary); color:#fff;
  font-weight:600; font-size:.9375rem; border-radius:var(--radius);
  transition:background .25s,transform .2s; border:none;
}
.btn-primary:hover { background:var(--primary-light); transform:translateY(-1px); }
.btn-outline {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.75rem; background:transparent; color:var(--primary);
  font-weight:600; font-size:.9375rem; border-radius:var(--radius);
  border:2px solid var(--primary); transition:all .25s;
}
.btn-outline:hover { background:var(--primary); color:#fff; }
.btn-sm { padding:.5rem 1.25rem; font-size:.875rem; }
.btn-lg { padding:1rem 2.25rem; font-size:1.0625rem; }

/* ── Navbar ─────────────────────────────────────────────────── */
.navbar {
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.95); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  box-shadow:var(--shadow-sm);
  transition:box-shadow .3s;
}
.navbar.scrolled { box-shadow:var(--shadow-md); }
.nav-container { max-width:1280px; margin:0 auto; padding:0 1.5rem; display:flex; align-items:center; justify-content:space-between; height:80px; }
.nav-logo img { height:56px; width:auto; }
.nav-links { display:none; align-items:center; gap:.25rem; }
@media(min-width:1024px){ .nav-links { display:flex; } }
.nav-link { padding:.5rem .75rem; border-radius:.5rem; font-size:.875rem; font-weight:500; color:var(--fg-70); transition:color .2s,background .2s; }
.nav-link:hover,.nav-link.active { color:var(--primary); background:var(--accent); }
.nav-toggle { display:flex; flex-direction:column; gap:5px; padding:.5rem; border-radius:.5rem; }
@media(min-width:1024px){ .nav-toggle { display:none; } }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--fg); border-radius:2px; transition:all .3s; }
.nav-toggle.open span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
.nav-mobile { display:none; background:#fff; border-top:1px solid var(--border); padding:1rem 1.5rem; flex-direction:column; gap:.25rem; }
.nav-mobile.open { display:flex; }
.nav-mobile-link { padding:.75rem; border-radius:.5rem; font-size:.9375rem; font-weight:500; color:var(--fg-70); transition:color .2s,background .2s; }
.nav-mobile-link:hover { color:var(--primary); background:var(--accent); }

/* ── Layout helpers ──────────────────────────────────────────── */
.container    { max-width:1280px; margin:0 auto; padding:0 1.5rem; }
.container-md { max-width:900px;  margin:0 auto; padding:0 1.5rem; }
.container-sm { max-width:640px;  margin:0 auto; padding:0 1.5rem; }
.section      { padding:5rem 1.5rem; }
.section-sm   { padding:3rem 1.5rem; }
.eyebrow { font-size:.8125rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--primary); }

/* ── Page header banner ──────────────────────────────────────── */
.page-banner { position:relative; height:240px; overflow:hidden; }
@media(min-width:768px){ .page-banner { height:288px; } }
.page-banner img { width:100%; height:100%; object-fit:cover; }
.page-banner-overlay { position:absolute; inset:0; background:rgba(30,40,55,0.6); display:flex; align-items:center; justify-content:center; }
.page-banner-content { text-align:center; color:#fff; }
.page-banner-content h1 { font-size:clamp(2rem,6vw,3.5rem); font-weight:700; margin-top:.5rem; }

/* ── Hero ─────────────────────────────────────────────────────── */
.hero { position:relative; min-height:85vh; display:flex; align-items:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; background-size:cover; background-position:center; }
.hero-grad { position:absolute; inset:0; background:linear-gradient(to right, rgba(30,40,55,0.85) 0%, rgba(30,40,55,0.6) 55%, rgba(30,40,55,0.2) 100%); }
.hero-content { position:relative; z-index:2; max-width:1280px; margin:0 auto; padding:6rem 1.5rem; width:100%; }
.hero-text { max-width:640px; }
.hero h1 { font-size:clamp(2.25rem,7vw,4rem); font-weight:700; color:#fff; line-height:1.1; margin-bottom:1.5rem; }
.hero-sub { font-size:1.125rem; color:rgba(255,255,255,0.85); line-height:1.75; margin-bottom:2.5rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:1rem; }

/* ── Stat badge ───────────────────────────────────────────────── */
.stat-badge { position:absolute; bottom:1.5rem; left:1.5rem; background:rgba(255,255,255,0.95); border-radius:var(--radius); padding:1rem 1.5rem; box-shadow:var(--shadow-lg); }
.stat-badge-num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--primary); line-height:1; }
.stat-badge-label { font-size:.8125rem; color:var(--muted); margin-top:.25rem; }

/* ── Cards ───────────────────────────────────────────────────── */
.card { background:var(--card); border-radius:var(--radius); border:1px solid var(--border); box-shadow:var(--shadow-sm); transition:box-shadow .3s,border-color .3s; }
.card:hover { box-shadow:var(--shadow-md); border-color:var(--primary-20); }

/* Service cards */
.service-card { padding:2rem; }
.service-icon { width:3rem; height:3rem; background:var(--primary-10); border-radius:.75rem; display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; transition:background .3s; }
.card:hover .service-icon { background:var(--primary-20); }
.service-icon svg { width:1.5rem; height:1.5rem; color:var(--primary); }
.service-card h3 { font-size:1.125rem; margin-bottom:.75rem; }
.service-card p { font-size:.9375rem; color:var(--muted); line-height:1.7; }

/* Services page cards */
.service-full { display:flex; gap:1.5rem; align-items:flex-start; padding:2.5rem; }
@media(max-width:639px){ .service-full { flex-direction:column; } }
.service-full-icon { width:3.5rem; height:3.5rem; background:var(--primary-10); border-radius:.875rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.service-full-icon svg { width:1.75rem; height:1.75rem; color:var(--primary); }
.service-full-body h2 { font-size:1.5rem; margin-bottom:.75rem; }
.service-full-body .prose { color:var(--muted); line-height:1.8; }
.service-full-body .prose h2,.service-full-body .prose h3 { font-family:'Playfair Display',serif; color:var(--fg); }
.service-full-body .prose p { margin-bottom:.875rem; }
.service-full-body .prose strong { color:var(--fg); }

/* Team cards */
.team-card { overflow:hidden; }
.team-card-img { position:relative; height:16rem; overflow:hidden; }
.team-card-img img { width:100%; height:100%; object-fit:cover; object-position:top; transition:transform .5s ease; }
.card:hover .team-card-img img { transform:scale(1.05); }
.team-card-img-overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(30,40,55,0.6), transparent); }
.team-card-img-content { position:absolute; bottom:1rem; left:1.25rem; }
.team-card-img-content h3 { font-size:1.25rem; font-weight:700; color:#fff; }
.team-card-img-content p  { font-size:.875rem; color:var(--primary-light); font-weight:500; }
.team-card-bio { padding:1.5rem; font-size:.9375rem; color:var(--muted); line-height:1.7; }
.team-card-initial { width:100%; height:16rem; background:var(--accent); display:flex; align-items:center; justify-content:center; }
.team-card-initial span { font-family:'Playfair Display',serif; font-size:5rem; font-weight:700; color:var(--primary); }

/* Review cards */
.review-card { padding:2rem; }
.review-card .quote-icon { width:2rem; height:2rem; color:var(--primary); opacity:.3; margin-bottom:1rem; }
.review-card p { font-style:italic; color:var(--fg-70); line-height:1.75; }
.review-card .author { font-size:.9375rem; color:var(--primary); font-weight:600; margin-top:1rem; }

/* Blog cards */
.blog-card { overflow:hidden; display:block; }
.blog-card-img { aspect-ratio:16/9; overflow:hidden; }
.blog-card-img img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.card:hover .blog-card-img img { transform:scale(1.04); }
.blog-card-body { padding:1.5rem; }
.blog-card-meta { display:flex; align-items:center; gap:.5rem; font-size:.8125rem; color:var(--muted); margin-bottom:.75rem; }
.blog-card-meta svg { width:.875rem; height:.875rem; }
.blog-card h2 { font-size:1.125rem; margin-bottom:.625rem; transition:color .2s; }
.card:hover .blog-card h2 { color:var(--primary); }
.blog-card-excerpt { font-size:.9375rem; color:var(--muted); line-height:1.65; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.blog-card-more { display:inline-flex; align-items:center; gap:.375rem; font-size:.9375rem; font-weight:500; color:var(--primary); margin-top:.875rem; transition:gap .2s; }
.card:hover .blog-card-more { gap:.625rem; }

/* ── Grid layouts ─────────────────────────────────────────────── */
.grid-2 { display:grid; grid-template-columns:1fr; gap:2rem; }
.grid-3 { display:grid; grid-template-columns:1fr; gap:2rem; }
.grid-4 { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; }
.grid-lg-2 { display:grid; grid-template-columns:1fr; gap:4rem; align-items:center; }
@media(min-width:768px) {
  .grid-2 { grid-template-columns:repeat(2,1fr); }
  .grid-3 { grid-template-columns:repeat(3,1fr); }
  .grid-4 { grid-template-columns:repeat(4,1fr); }
}
@media(min-width:1024px) { .grid-lg-2 { grid-template-columns:1fr 1fr; } }
@media(min-width:640px)  { .grid-4   { grid-template-columns:repeat(4,1fr); } }

/* ── About page ─────────────────────────────────────────────── */
.mission-box { background:var(--secondary); border-radius:var(--radius); padding:2rem; border:1px solid var(--primary-20); }
.mission-box h2 { font-size:1.5rem; margin-bottom:1rem; }
.mission-box blockquote { font-style:italic; font-size:1.125rem; color:var(--fg-70); line-height:1.8; }

/* ── Cellfield page ─────────────────────────────────────────── */
.cellfield-stat { background:var(--accent); border-radius:var(--radius); padding:2.5rem; text-align:center; }
.cellfield-stat .num { font-family:'Playfair Display',serif; font-size:4rem; font-weight:700; color:var(--primary); line-height:1; }
.checklist { list-style:none; space-y:0.75rem; }
.checklist li { display:flex; align-items:flex-start; gap:.75rem; margin-bottom:.75rem; }
.checklist li svg { width:1.25rem; height:1.25rem; color:var(--primary); flex-shrink:0; margin-top:.1rem; }
.checklist li span { color:var(--muted); }

/* ── Contact page ────────────────────────────────────────────── */
.contact-icon-box { width:2.5rem; height:2.5rem; background:var(--accent); border-radius:.625rem; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.contact-icon-box svg { width:1.25rem; height:1.25rem; color:var(--primary); }
.contact-item { display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.25rem; }
.contact-item-label { font-size:.8125rem; color:var(--muted); }
.contact-item-value { font-weight:500; transition:color .2s; }
a:hover .contact-item-value { color:var(--primary); }

/* ── Forms ───────────────────────────────────────────────────── */
.form-group { margin-bottom:1.25rem; }
.form-label { display:block; font-size:.9375rem; font-weight:500; margin-bottom:.375rem; }
.form-input,.form-textarea {
  width:100%; border:1px solid var(--border); border-radius:.5rem;
  padding:.75rem 1rem; font-family:'Inter',sans-serif; font-size:.9375rem;
  color:var(--fg); background:#fff; transition:border-color .2s,box-shadow .2s;
}
.form-input:focus,.form-textarea:focus {
  outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-10);
}
.form-textarea { resize:vertical; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:639px){ .form-grid { grid-template-columns:1fr; } }
.form-success { text-align:center; padding:3rem 1rem; }
.form-success svg { width:3rem; height:3rem; color:var(--primary); margin:0 auto 1rem; }
.form-success h3 { font-size:1.5rem; margin-bottom:.5rem; }
.form-success p { color:var(--muted); }
.form-submit { display:flex; align-items:center; justify-content:center; gap:.5rem; width:100%; padding:.875rem; background:var(--primary); color:#fff; font-weight:600; font-size:.9375rem; border-radius:.5rem; border:none; cursor:pointer; transition:background .2s; margin-top:.5rem; }
.form-submit:hover { background:var(--primary-light); }
.form-submit:disabled { opacity:.6; cursor:not-allowed; }
.form-submit .spin { animation:spin .8s linear infinite; }

/* Image grid */
.about-img-grid { display:grid; grid-template-rows:1fr 1fr; gap:1rem; }
.about-img-grid img { width:100%; border-radius:var(--radius); object-fit:cover; }
.about-img-grid img:first-child { height:16rem; }
.about-img-grid img:last-child  { height:16rem; }

/* ── Section backgrounds ─────────────────────────────────────── */
.section-alt { background:var(--secondary); }
.bg-alt { background:rgba(174,210,205,0.2); }

/* Image banner strip */
.image-strip { display:grid; grid-template-columns:repeat(3,1fr); height:12rem; overflow:hidden; }
@media(min-width:640px){ .image-strip { height:16rem; } }
.image-strip div { overflow:hidden; }
.image-strip img { width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.image-strip div:hover img { transform:scale(1.05); }

/* ── Blog post page ──────────────────────────────────────────── */
.post-content { max-width:800px; margin:0 auto; }
.post-content .back-link { display:inline-flex; align-items:center; gap:.5rem; font-size:.9375rem; color:var(--muted); margin-bottom:2rem; transition:color .2s; }
.post-content .back-link:hover { color:var(--primary); }
.post-meta { display:flex; align-items:center; gap:1rem; font-size:.9375rem; color:var(--muted); margin-bottom:1rem; }
.post-meta svg { width:1rem; height:1rem; }
.post-title { font-size:clamp(2rem,5vw,3rem); font-weight:700; margin-bottom:2rem; }
.post-hero { width:100%; border-radius:var(--radius); box-shadow:var(--shadow-lg); margin-bottom:2.5rem; }
.prose { color:var(--fg-70); line-height:1.875; font-size:1.0625rem; }
.prose h2,.prose h3 { font-family:'Playfair Display',serif; color:var(--fg); margin:1.75rem 0 .875rem; }
.prose p { margin-bottom:1.25rem; }
.prose ul,.prose ol { padding-left:1.5rem; margin-bottom:1.25rem; }
.prose li { margin-bottom:.5rem; }
.prose strong { color:var(--fg); }
.prose a { color:var(--primary); text-decoration:underline; }
.prose blockquote { border-left:4px solid var(--primary); padding-left:1.25rem; font-style:italic; color:var(--muted); margin:1.5rem 0; }

/* ── Policy page ─────────────────────────────────────────────── */
.policy-content { max-width:800px; margin:0 auto; }
.policy-content h2 { font-size:1.75rem; margin:2rem 0 .875rem; }
.policy-content h3 { font-size:1.25rem; margin:1.5rem 0 .625rem; }
.policy-content p  { color:var(--muted); line-height:1.8; margin-bottom:1rem; }
.policy-content ul { padding-left:1.5rem; color:var(--muted); }
.policy-content li { margin-bottom:.5rem; }
.policy-content strong { color:var(--fg); }
.policy-content a { color:var(--primary); }

/* ── Footer ──────────────────────────────────────────────────── */
.site-footer { background:var(--fg); color:#fff; }
.footer-container { max-width:1280px; margin:0 auto; padding:4rem 1.5rem; }
.footer-grid { display:grid; grid-template-columns:1fr; gap:3rem; margin-bottom:3rem; }
@media(min-width:768px){ .footer-grid { grid-template-columns:1.5fr 1fr 1fr; gap:2rem; } }
.footer-logo { height:3.5rem; width:auto; filter:brightness(0) invert(1); margin-bottom:1rem; }
.footer-tagline { font-size:.9375rem; color:rgba(255,255,255,.65); line-height:1.75; }
.footer-heading { font-family:'Playfair Display',serif; font-size:1.125rem; font-weight:600; margin-bottom:1rem; }
.footer-links { list-style:none; }
.footer-links li { margin-bottom:.625rem; }
.footer-links a { font-size:.9375rem; color:rgba(255,255,255,.6); transition:color .2s; }
.footer-links a:hover { color:var(--footer-teal); }
.footer-contact-list { list-style:none; }
.footer-contact-list li { display:flex; align-items:flex-start; gap:.75rem; font-size:.9375rem; color:rgba(255,255,255,.6); margin-bottom:.875rem; }
.footer-contact-list svg { width:1rem; height:1rem; flex-shrink:0; margin-top:.2rem; }
.footer-contact-list a { color:rgba(255,255,255,.6); transition:color .2s; }
.footer-contact-list a:hover { color:var(--footer-teal); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:2rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; }
.footer-bottom p { font-size:.8125rem; color:rgba(255,255,255,.4); }
.footer-bottom-right { display:flex; align-items:center; gap:1.25rem; }
.footer-bottom-right p,.footer-bottom-right a { font-size:.8125rem; color:rgba(255,255,255,.4); }
.footer-bottom-right a:hover { color:var(--footer-teal); }
.footer-admin-link { color:rgba(255,255,255,.2); transition:color .2s; }
.footer-admin-link:hover { color:rgba(255,255,255,.5); }

/* ── Cookie banner ───────────────────────────────────────────── */
.cookie-banner { position:fixed; bottom:1.5rem; left:50%; transform:translateX(-50%); z-index:200; background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1rem 1.5rem; box-shadow:var(--shadow-lg); max-width:520px; width:calc(100% - 3rem); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.cookie-banner p { font-size:.9375rem; color:var(--muted); }
.cookie-banner a { color:var(--primary); }

/* ── Toast ───────────────────────────────────────────────────── */
.toast { position:fixed; bottom:2rem; right:2rem; z-index:9999; background:var(--fg); color:#fff; padding:1rem 1.5rem; border-radius:var(--radius); border-left:4px solid var(--primary); font-size:.9375rem; box-shadow:var(--shadow-lg); transform:translateY(80px); opacity:0; transition:all .35s ease; max-width:360px; }
.toast.show { transform:translateY(0); opacity:1; }
.toast.error { border-left-color:#ef4444; }

/* ── Scroll to top ───────────────────────────────────────────── */
.scroll-top { position:fixed; bottom:2rem; right:2rem; z-index:80; width:44px; height:44px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .3s,transform .3s; box-shadow:var(--shadow-md); }
.scroll-top.visible { opacity:1; pointer-events:all; }
.scroll-top:hover { transform:translateY(-2px); }
.scroll-top svg { width:18px; height:18px; }

/* ── Admin ───────────────────────────────────────────────────── */
.admin-body { background:#f8fafc; min-height:100vh; display:flex; }
.admin-sidebar { width:260px; background:var(--fg); flex-shrink:0; position:fixed; top:0; left:0; bottom:0; z-index:200; display:flex; flex-direction:column; transition:transform .3s; }
.admin-sidebar-header { padding:1.5rem; border-bottom:1px solid rgba(255,255,255,.1); display:flex; align-items:center; justify-content:space-between; }
.admin-sidebar-header h2 { font-family:'Playfair Display',serif; color:#fff; font-size:1.25rem; }
.admin-nav { flex:1; overflow-y:auto; padding:1rem 0; }
.admin-nav-link { display:flex; align-items:center; gap:.875rem; padding:.75rem 1.5rem; font-size:.9375rem; font-weight:500; color:rgba(255,255,255,.6); border-left:3px solid transparent; transition:all .2s; }
.admin-nav-link:hover,.admin-nav-link.active { color:#fff; background:rgba(255,255,255,.06); border-left-color:var(--primary); }
.admin-nav-link svg { width:1.125rem; height:1.125rem; flex-shrink:0; }
.admin-nav-badge { margin-left:auto; background:var(--primary-20); color:var(--primary); font-size:.6875rem; font-weight:700; padding:.15rem .5rem; border-radius:50px; }
.admin-sidebar-footer { padding:1rem 1.5rem; border-top:1px solid rgba(255,255,255,.1); }
.admin-main { flex:1; margin-left:260px; display:flex; flex-direction:column; }
.admin-topbar { background:#fff; border-bottom:1px solid var(--border); height:64px; display:flex; align-items:center; padding:0 2rem; gap:1rem; position:sticky; top:0; z-index:100; }
.admin-topbar-title { font-weight:600; flex:1; color:var(--fg); }
.admin-topbar-user { font-size:.875rem; color:var(--muted); }
.admin-topbar-signout { font-size:.875rem; color:var(--muted); transition:color .2s; }
.admin-topbar-signout:hover { color:var(--primary); }
.admin-menu-btn { display:none; }
.admin-sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:190; }
@media(max-width:1023px){
  .admin-sidebar { transform:translateX(-100%); }
  .admin-sidebar.open { transform:translateX(0); }
  .admin-main { margin-left:0; }
  .admin-menu-btn { display:flex; padding:.5rem; color:var(--fg); }
  .admin-sidebar-overlay.active { display:block; }
}
.admin-content { flex:1; padding:2rem; }
.admin-page-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:2rem; }
.admin-page-title { font-family:'Playfair Display',serif; font-size:1.75rem; font-weight:700; color:var(--fg); }
.admin-page-sub { font-size:.9375rem; color:var(--muted); margin-top:.25rem; }

/* Admin cards/tables */
.admin-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1.5rem; margin-bottom:1.5rem; box-shadow:var(--shadow-sm); }
.admin-card-title { font-family:'Playfair Display',serif; font-size:1.125rem; font-weight:600; margin-bottom:1.25rem; }
.admin-stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1rem; margin-bottom:2rem; }
.admin-stat-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow-sm); transition:border-color .2s; text-decoration:none; display:block; }
.admin-stat-card:hover { border-color:var(--primary); }
.admin-stat-num { font-family:'Playfair Display',serif; font-size:2rem; font-weight:700; color:var(--primary); }
.admin-stat-label { font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); margin-top:.25rem; }
.admin-stat-badge { background:var(--primary-10); color:var(--primary); font-size:.6875rem; font-weight:700; padding:.15rem .5rem; border-radius:50px; margin-top:.5rem; display:inline-block; }

/* Admin table */
.admin-table-wrap { overflow-x:auto; }
.admin-table { width:100%; border-collapse:collapse; }
.admin-table th { font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); padding:.75rem 1rem; text-align:left; border-bottom:1px solid var(--border); }
.admin-table td { padding:.875rem 1rem; border-bottom:1px solid rgba(0,0,0,.04); font-size:.9375rem; color:var(--fg); vertical-align:middle; }
.admin-table tr:last-child td { border-bottom:none; }
.admin-table tr:hover td { background:#f8fafc; }

/* Admin form */
.admin-label { display:block; font-size:.875rem; font-weight:500; color:var(--fg); margin-bottom:.375rem; }
.admin-input,.admin-textarea,.admin-select { width:100%; border:1px solid var(--border); border-radius:.5rem; padding:.625rem .875rem; font-family:'Inter',sans-serif; font-size:.9375rem; color:var(--fg); background:#fff; transition:border-color .2s,box-shadow .2s; }
.admin-input:focus,.admin-textarea:focus,.admin-select:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-10); }
.admin-textarea { resize:vertical; }
.admin-hint { font-size:.8125rem; color:var(--muted); margin-top:.25rem; }
.admin-form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
@media(max-width:639px){ .admin-form-row { grid-template-columns:1fr; } }
.admin-form-field { margin-bottom:1.25rem; }

/* Admin buttons */
.btn-admin { display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1.125rem; border-radius:.5rem; font-size:.875rem; font-weight:500; cursor:pointer; transition:all .2s; border:none; }
.btn-admin-primary { background:var(--primary); color:#fff; }
.btn-admin-primary:hover { background:var(--primary-light); }
.btn-admin-ghost { background:#f1f5f9; color:var(--fg); }
.btn-admin-ghost:hover { background:#e2e8f0; }
.btn-admin-danger { background:#fef2f2; color:#ef4444; }
.btn-admin-danger:hover { background:#fee2e2; }
.btn-admin-sm { padding:.375rem .75rem; font-size:.8125rem; }

/* Status badges */
.badge { display:inline-block; padding:.2rem .625rem; border-radius:50px; font-size:.75rem; font-weight:600; }
.badge-published { background:#f0fdf4; color:#15803d; }
.badge-draft { background:#f3f4f6; color:#6b7280; }

/* Quill editor */
.ql-toolbar.ql-snow { border-color:var(--border) !important; border-radius:.5rem .5rem 0 0; background:#f8fafc; }
.ql-container.ql-snow { border-color:var(--border) !important; border-top:none; border-radius:0 0 .5rem .5rem; font-family:'Inter',sans-serif; min-height:200px; }
.ql-editor { min-height:200px; font-size:.9375rem; color:var(--fg); }

/* Upload zone */
.upload-zone { border:2px dashed var(--border); border-radius:var(--radius); padding:2rem; text-align:center; cursor:pointer; transition:border-color .2s,background .2s; }
.upload-zone:hover { border-color:var(--primary); background:var(--primary-10); }
.upload-zone svg { width:2.5rem; height:2.5rem; color:var(--muted); margin:0 auto 1rem; }

/* Admin image grid */
.admin-image-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:.5rem; }
.admin-image-item { position:relative; aspect-ratio:1; border-radius:.5rem; overflow:hidden; }
.admin-image-item img { width:100%; height:100%; object-fit:cover; }

/* Admin login */
.admin-login-page { min-height:100vh; display:flex; align-items:center; justify-content:center; background:#f8fafc; padding:2rem; }
.admin-login-card { background:#fff; border:1px solid var(--border); border-radius:1rem; padding:3rem; width:100%; max-width:420px; box-shadow:var(--shadow-lg); }
.admin-login-logo { margin-bottom:2rem; }
.admin-login-logo img { height:3.5rem; }
.admin-login-title { font-family:'Playfair Display',serif; font-size:1.75rem; font-weight:700; margin-bottom:.25rem; }
.admin-login-sub { font-size:.9375rem; color:var(--muted); margin-bottom:2rem; }
.admin-login-btn { width:100%; padding:.875rem; background:var(--primary); color:#fff; font-weight:600; font-size:.9375rem; border-radius:.5rem; border:none; cursor:pointer; transition:background .2s; }
.admin-login-btn:hover { background:var(--primary-light); }

/* Alert */
.alert { padding:1rem 1.25rem; border-radius:.5rem; font-size:.9375rem; margin-bottom:1rem; }
.alert-success { background:#f0fdf4; color:#15803d; border:1px solid #bbf7d0; }
.alert-error   { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }

/* Skeleton */
.skeleton { background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%); background-size:200% 100%; animation:shimmer 1.5s infinite; border-radius:.5rem; }

/* ── Responsive ──────────────────────────────────────────────── */
@media(max-width:767px){
  .grid-lg-2 { gap:2.5rem; }
  .about-img-grid { display:none; } /* Hide on mobile for simplicity */
  .service-full { flex-direction:column; }
  .form-grid { grid-template-columns:1fr; }
}
@media(max-width:639px) {
  .hero h1 { font-size:2.25rem; }
  .hero-sub { font-size:1rem; }
  .grid-4 { grid-template-columns:repeat(2,1fr); }
}