/*!
 * Quran Web Academy — Interior page utilities (Tailwind-compatible)
 * v7.3 — fixes broken single-city, single-teacher, single-post, page, archive layouts.
 * RTL-first. All utilities used by single*.php / page*.php / archive.php templates.
 */

/* ============ LAYOUT PRIMITIVES ============ */
.flex{display:flex}
.inline-flex{display:inline-flex}
.grid{display:grid}
.block{display:block}
.inline-block{display:inline-block}
.hidden{display:none}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.flex-1{flex:1 1 0%}
.flex-shrink-0{flex-shrink:0}
.items-start{align-items:flex-start}
.items-center{align-items:center}
.items-end{align-items:flex-end}
.justify-start{justify-content:flex-start}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.justify-end{justify-content:flex-end}
.place-items-center{place-items:center}
.self-center{align-self:center}

/* Gaps */
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}
.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}
.gap-x-3{column-gap:.75rem}.gap-x-4{column-gap:1rem}.gap-x-6{column-gap:1.5rem}
.gap-y-2{row-gap:.5rem}.gap-y-3{row-gap:.75rem}.gap-y-4{row-gap:1rem}

/* Grid columns */
.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.col-span-1{grid-column:span 1 / span 1}
.col-span-2{grid-column:span 2 / span 2}
.col-span-3{grid-column:span 3 / span 3}
.col-span-full{grid-column:1 / -1}

/* Space between (RTL-aware) */
.space-y-2 > * + *{margin-top:.5rem}
.space-y-3 > * + *{margin-top:.75rem}
.space-y-4 > * + *{margin-top:1rem}
.space-y-6 > * + *{margin-top:1.5rem}
[dir="rtl"] .space-x-2 > * + *{margin-right:.5rem;margin-left:0}
[dir="rtl"] .space-x-4 > * + *{margin-right:1rem;margin-left:0}

/* Divide */
.divide-y > * + *{border-top:1px solid rgba(15,60,42,.12)}
.divide-ink-300\/40 > * + *{border-top-color:rgba(201,209,207,.4)}

/* Max widths */
.max-w-none{max-width:none}
.max-w-xs{max-width:20rem}
.max-w-sm{max-width:24rem}
.max-w-md{max-width:28rem}
.max-w-lg{max-width:32rem}
.max-w-xl{max-width:36rem}
.max-w-2xl{max-width:42rem}
.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}
.max-w-full{max-width:100%}
.mx-auto{margin-left:auto;margin-right:auto}
.w-full{width:100%}
.h-full{height:100%}
.w-12{width:3rem}.h-12{height:3rem}
.w-14{width:3.5rem}.h-14{height:3.5rem}
.w-16{width:4rem}.h-16{height:4rem}
.w-20{width:5rem}.h-20{height:5rem}
.w-24{width:6rem}.h-24{height:6rem}
.w-32{width:8rem}.h-32{height:8rem}
.w-40{width:10rem}.h-40{height:10rem}
.w-48{width:12rem}.h-48{height:12rem}
.w-56{width:14rem}.h-56{height:14rem}

/* Margins & padding */
.m-0{margin:0}.mt-0{margin-top:0}.mb-0{margin-bottom:0}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}
.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}
.mt-8{margin-top:2rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}
.mt-16{margin-top:4rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}
.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}
.mb-16{margin-bottom:4rem}
.ms-2{margin-inline-start:.5rem}.me-2{margin-inline-end:.5rem}
.p-0{padding:0}
.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}
.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}
.py-1{padding-top:.25rem;padding-bottom:.25rem}
.py-2{padding-top:.5rem;padding-bottom:.5rem}
.py-3{padding-top:.75rem;padding-bottom:.75rem}
.py-4{padding-top:1rem;padding-bottom:1rem}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
.py-8{padding-top:2rem;padding-bottom:2rem}
.py-12{padding-top:3rem;padding-bottom:3rem}
.py-16{padding-top:4rem;padding-bottom:4rem}
.py-24{padding-top:6rem;padding-bottom:6rem}
.px-1{padding-left:.25rem;padding-right:.25rem}
.px-2{padding-left:.5rem;padding-right:.5rem}
.px-3{padding-left:.75rem;padding-right:.75rem}
.px-4{padding-left:1rem;padding-right:1rem}
.px-6{padding-left:1.5rem;padding-right:1.5rem}
.px-8{padding-left:2rem;padding-right:2rem}
.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-4{padding-top:1rem}.pt-6{padding-top:1.5rem}
.pb-2{padding-bottom:.5rem}.pb-4{padding-bottom:1rem}.pb-6{padding-bottom:1.5rem}
.pr-4{padding-right:1rem}.pl-4{padding-left:1rem}

/* Text sizes */
.text-xs{font-size:.75rem;line-height:1rem}
.text-sm{font-size:.875rem;line-height:1.4}
.text-base{font-size:1rem;line-height:1.6}
.text-lg{font-size:1.125rem;line-height:1.65}
.text-xl{font-size:1.25rem;line-height:1.65}
.text-2xl{font-size:1.5rem;line-height:1.35}
.text-3xl{font-size:1.875rem;line-height:1.3}
.text-4xl{font-size:2.25rem;line-height:1.25}
.text-5xl{font-size:3rem;line-height:1.2}
.text-6xl{font-size:3.75rem;line-height:1.1}
.text-7xl{font-size:4.5rem;line-height:1.1}

/* Text alignment */
.text-left{text-align:left}
.text-center{text-align:center}
.text-right{text-align:right}
.text-start{text-align:start}
.text-end{text-align:end}

/* Font weight & family */
.font-normal{font-weight:400}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.font-black{font-weight:900}
.font-display{font-family:'Cairo','Tajawal',system-ui,sans-serif}
.italic{font-style:italic}
.leading-tight{line-height:1.25}
.leading-snug{line-height:1.35}
.leading-normal{line-height:1.5}
.leading-relaxed{line-height:1.7}
.leading-loose{line-height:2}
.tracking-tight{letter-spacing:-.025em}
.tracking-normal{letter-spacing:0}
.tracking-wide{letter-spacing:.025em}
.tracking-wider{letter-spacing:.05em}
.tracking-widest{letter-spacing:.1em}

/* Text colors */
.text-white{color:#fff}
.text-black{color:#000}
.text-brand-100{color:var(--brand-100)}
.text-brand-600{color:var(--brand-600)}
.text-brand-700{color:var(--brand-700)}
.text-brand-800{color:var(--brand-800)}
.text-brand-900{color:var(--brand-900)}
.text-gold-300{color:var(--gold-300)}
.text-gold-400{color:var(--gold-400)}
.text-gold-500{color:var(--gold-500)}
.text-gold-600{color:var(--gold-600)}
.text-ink-300{color:var(--ink-300)}
.text-ink-500{color:var(--ink-500)}
.text-ink-700{color:#334744}
.text-ink-800{color:var(--ink-800)}
.text-ink-900{color:var(--ink-900)}

/* Backgrounds */
.bg-white{background-color:#fff}
.bg-cream{background-color:var(--cream)}
.bg-transparent{background-color:transparent}
.bg-brand-50{background-color:var(--brand-50)}
.bg-brand-100{background-color:var(--brand-100)}
.bg-brand-600{background-color:var(--brand-600)}
.bg-brand-700{background-color:var(--brand-700)}
.bg-brand-800{background-color:var(--brand-800)}
.bg-brand-900{background-color:var(--brand-900)}
.bg-gold-400{background-color:var(--gold-400)}
.bg-gold-500{background-color:var(--gold-500)}
.bg-white\/10{background-color:rgba(255,255,255,.1)}
.bg-white\/20{background-color:rgba(255,255,255,.2)}
.bg-gradient-brand{background-image:var(--grad-brand);color:#fff}
.bg-gradient-hero{background-image:var(--grad-hero);color:#fff}
.bg-gradient-gold{background-image:var(--grad-gold)}

/* Borders */
.border{border-width:1px;border-style:solid;border-color:rgba(15,60,42,.1)}
.border-0{border-width:0}
.border-2{border-width:2px}
.border-t{border-top-width:1px;border-top-style:solid;border-top-color:rgba(15,60,42,.1)}
.border-b{border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:rgba(15,60,42,.1)}
.border-y{border-top-width:1px;border-bottom-width:1px;border-top-style:solid;border-bottom-style:solid;border-top-color:rgba(15,60,42,.1);border-bottom-color:rgba(15,60,42,.1)}
.border-r-4{border-right-width:4px;border-right-style:solid;border-right-color:currentColor}
.border-l-4{border-left-width:4px;border-left-style:solid;border-left-color:currentColor}
.border-ink-300\/40{border-color:rgba(201,209,207,.4)}
.border-white\/20{border-color:rgba(255,255,255,.2)}
.border-white\/30{border-color:rgba(255,255,255,.3)}
.border-gold-400{border-color:var(--gold-400)}
.border-gold-500{border-color:var(--gold-500)}
.border-brand-600{border-color:var(--brand-600)}
.ring-2{box-shadow:0 0 0 2px currentColor}
.ring-8{box-shadow:0 0 0 8px currentColor}
.ring-brand-600{color:var(--brand-600)}
.ring-white\/20{color:rgba(255,255,255,.2)}

/* Rounded */
.rounded{border-radius:.375rem}
.rounded-md{border-radius:.5rem}
.rounded-lg{border-radius:.75rem}
.rounded-xl{border-radius:1rem}
.rounded-2xl{border-radius:1.25rem}
.rounded-3xl{border-radius:1.75rem}
.rounded-full{border-radius:9999rem}

/* Shadows */
.shadow-none{box-shadow:none}
.shadow-sm{box-shadow:var(--shadow-sm)}
.shadow-soft{box-shadow:var(--shadow-sm)}
.shadow-md{box-shadow:var(--shadow-md)}
.shadow-lg{box-shadow:var(--shadow-lg)}
.shadow-card{box-shadow:var(--shadow-md)}

/* Overflow */
.overflow-hidden{overflow:hidden}
.overflow-auto{overflow:auto}
.overflow-x-auto{overflow-x:auto}

/* Position */
.relative{position:relative}
.absolute{position:absolute}
.fixed{position:fixed}
.sticky{position:sticky}
.top-0{top:0}.right-0{right:0}.bottom-0{bottom:0}.left-0{left:0}
.top-3{top:.75rem}.right-6{right:1.5rem}.right-5{right:1.25rem}.bottom-5{bottom:1.25rem}
.-translate-y-1{transform:translateY(-.25rem)}
.-top-3{top:-.75rem}
.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}
.inset-0{top:0;right:0;bottom:0;left:0}

/* Object fit */
.object-cover{object-fit:cover}
.object-contain{object-fit:contain}

/* Aspect ratios */
.aspect-square{aspect-ratio:1/1}
.aspect-video{aspect-ratio:16/9}
.img-16x9{aspect-ratio:16/9}
.img-4x3{aspect-ratio:4/3}

/* Line clamp */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* Cursor */
.cursor-pointer{cursor:pointer}

/* Transitions */
.transition{transition:all .25s var(--ease-out)}
.transition-shadow{transition:box-shadow .3s}
.transition-transform{transition:transform .3s}
.transition-all{transition:all .3s var(--ease-out)}

/* Hover states */
.hover\:bg-white\/20:hover{background-color:rgba(255,255,255,.2)}
.hover\:bg-brand-100:hover{background-color:var(--brand-100)}
.hover\:text-brand-600:hover{color:var(--brand-600)}
.hover\:text-brand-700:hover{color:var(--brand-700)}
.hover\:underline:hover{text-decoration:underline}
.hover\:shadow-card:hover{box-shadow:var(--shadow-md)}
.group:hover .group-hover\:opacity-100{opacity:1}

/* Responsive breakpoints */
@media (min-width:640px){
  .sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sm\:text-lg{font-size:1.125rem;line-height:1.65}
  .sm\:py-8{padding-top:2rem;padding-bottom:2rem}
  .sm\:flex-row{flex-direction:row}
}
@media (min-width:768px){
  .md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .md\:col-span-1{grid-column:span 1 / span 1}
  .md\:col-span-2{grid-column:span 2 / span 2}
  .md\:col-span-3{grid-column:span 3 / span 3}
  .md\:flex-row{flex-direction:row}
  .md\:text-right{text-align:right}
  .md\:text-left{text-align:left}
  .md\:text-xl{font-size:1.25rem;line-height:1.65}
  .md\:text-4xl{font-size:2.25rem;line-height:1.25}
  .md\:py-24{padding-top:6rem;padding-bottom:6rem}
  .md\:items-end{align-items:flex-end}
  .md\:items-center{align-items:center}
  .md\:justify-between{justify-content:space-between}
  .md\:justify-start{justify-content:flex-start}
}
@media (min-width:1024px){
  .lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .lg\:text-5xl{font-size:3rem;line-height:1.2}
}

/* ============ PROSE (long-form article body) — RTL first ============ */
.prose{color:var(--ink-800);font-size:1.0625rem;line-height:1.85;max-width:75ch}
.prose > * + *{margin-top:1.2em}
.prose h1,.prose h2,.prose h3,.prose h4{font-family:'Cairo','Tajawal',system-ui,sans-serif;
  color:var(--brand-800);font-weight:800;line-height:1.3;letter-spacing:-.01em;margin-top:1.75em;margin-bottom:.5em}
.prose h1{font-size:2rem}
.prose h2{font-size:1.6rem;padding-bottom:.3em;border-bottom:2px solid var(--gold-400);display:inline-block;padding-inline-end:1rem}
.prose h3{font-size:1.25rem;color:var(--brand-700)}
.prose h4{font-size:1.1rem}
.prose p{margin:1em 0;line-height:1.9}
.prose a{color:var(--brand-700);text-decoration:underline;text-decoration-color:var(--gold-400);text-underline-offset:3px;transition:color .2s}
.prose a:hover{color:var(--brand-600);text-decoration-color:var(--brand-600)}
.prose strong,.prose b{color:var(--brand-900);font-weight:700}
.prose em{color:var(--ink-800)}
.prose ul,.prose ol{margin:1em 0;padding-inline-start:1.5em}
.prose ul{list-style:none}
.prose ul > li{position:relative;padding-inline-start:1.6em;margin:.5em 0;line-height:1.85}
.prose ul > li::before{content:"✓";position:absolute;inset-inline-start:0;top:0;color:var(--gold-500);font-weight:900}
.prose ol{list-style:decimal;list-style-position:outside}
.prose ol > li{margin:.5em 0;padding-inline-start:.5em;line-height:1.85}
.prose ol > li::marker{color:var(--gold-500);font-weight:700}
.prose blockquote{border-inline-start:4px solid var(--gold-500);background:var(--cream);
  padding:1.25em 1.5em;margin:1.5em 0;border-radius:0 12px 12px 0;color:var(--ink-800);font-style:normal}
.prose blockquote p{margin:0}
.prose code{background:var(--brand-50);color:var(--brand-800);padding:.15em .4em;border-radius:6px;
  font-family:ui-monospace,Menlo,monospace;font-size:.9em}
.prose pre{background:var(--brand-950);color:#e8f0ec;padding:1.25em;border-radius:14px;overflow-x:auto;
  font-family:ui-monospace,Menlo,monospace;font-size:.92em;line-height:1.65}
.prose pre code{background:transparent;color:inherit;padding:0}
.prose img{border-radius:16px;box-shadow:var(--shadow-md);margin:1.5em 0;width:100%;height:auto}
.prose figure{margin:2em 0}
.prose figcaption{color:var(--ink-500);text-align:center;font-size:.9em;margin-top:.75em;font-style:italic}
.prose hr{border:0;height:1px;background:linear-gradient(90deg,transparent,var(--gold-400),transparent);margin:2.5em 0}
.prose table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:.95em;border-radius:12px;overflow:hidden;box-shadow:var(--shadow-sm)}
.prose thead{background:var(--grad-brand);color:#fff}
.prose th,.prose td{padding:.85em 1em;text-align:start;border-bottom:1px solid rgba(15,60,42,.08)}
.prose tbody tr:nth-child(even){background:var(--cream)}
.prose tbody tr:hover{background:var(--brand-50)}
.prose-lg{font-size:1.125rem;line-height:1.9}
.prose-lg h2{font-size:1.8rem}
.prose-lg h3{font-size:1.4rem}

/* Prose config utilities (from Tailwind prose plugin usage in templates) */
.prose-headings\:font-display :is(h1,h2,h3,h4){font-family:'Cairo','Tajawal',system-ui,sans-serif}
.prose-headings\:text-brand-800 :is(h1,h2,h3,h4){color:var(--brand-800)}
.prose-a\:text-brand-700 a{color:var(--brand-700)}
.prose-strong\:text-brand-800 :is(strong,b){color:var(--brand-800)}

/* ============ EYEBROW / KICKER ============ */
.eyebrow{display:inline-block;font-family:'Cairo',sans-serif;font-weight:800;color:var(--gold-600);
  letter-spacing:.14em;font-size:.85rem;text-transform:uppercase;margin-bottom:.5rem}
.eyebrow.\!text-gold-400,.\!text-gold-400{color:var(--gold-400) !important}

/* Section-title h1 backup */
h1{font-family:'Cairo','Tajawal',system-ui,sans-serif;color:var(--brand-900)}

/* ============ BREADCRUMB NAV (used by single*.php) ============ */
nav[aria-label="مسار التصفح"]{background:var(--cream);border-bottom:1px solid rgba(201,209,207,.4)}
nav[aria-label="مسار التصفح"] .container{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding-top:.75rem;padding-bottom:.75rem;font-size:.9rem;color:var(--ink-500)}
nav[aria-label="مسار التصفح"] a{color:var(--brand-700);font-weight:600;transition:color .2s}
nav[aria-label="مسار التصفح"] a:hover{color:var(--gold-600)}
nav[aria-label="مسار التصفح"] span.text-brand-800{color:var(--brand-800);font-weight:700}
nav[aria-label="مسار التصفح"] span.text-ink-300{color:var(--gold-500);margin:0 .25rem}

/* ============ COMMENTS ============ */
.comments-area{max-width:48rem;margin:0 auto}
.comments-area .comment-list{list-style:none;padding:0;margin:0}
.comments-area .comment{background:#fff;padding:1.25rem;border-radius:14px;margin-bottom:1rem;box-shadow:var(--shadow-sm)}
.comments-area .comment-author{font-weight:700;color:var(--brand-800)}
.comments-area .comment-metadata{color:var(--ink-500);font-size:.85rem;margin:.25rem 0}
.comments-area textarea,.comments-area input[type="text"],.comments-area input[type="email"],.comments-area input[type="url"]{
  width:100%;padding:.75rem 1rem;border:1px solid rgba(15,60,42,.15);border-radius:10px;
  font-family:inherit;font-size:1rem;background:#fff;color:var(--ink-800)}
.comments-area textarea:focus,.comments-area input:focus{outline:none;border-color:var(--brand-500);box-shadow:0 0 0 3px rgba(38,160,95,.15)}
.comments-area .submit{background:var(--grad-brand);color:#fff;padding:.75rem 1.75rem;border:0;border-radius:12px;font-weight:700;cursor:pointer}

/* ============ POSTS PAGINATION ============ */
.pagination,.nav-links,.page-numbers{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-top:2rem}
.page-numbers{padding:0}
.page-numbers li{list-style:none}
.page-numbers a,.page-numbers span,.nav-links a,.nav-links span{padding:.55rem .85rem;min-width:44px;text-align:center;
  border-radius:10px;background:#fff;color:var(--brand-800);font-weight:700;
  border:1px solid rgba(15,60,42,.1);transition:all .2s;text-decoration:none;display:inline-block}
.page-numbers a:hover,.nav-links a:hover{background:var(--brand-50);border-color:var(--brand-500)}
.page-numbers .current,.nav-links .current{background:var(--grad-brand);color:#fff;border-color:transparent}

/* ============ CITY / TEACHER hero fixes (RTL centering) ============ */
.city-hero,.teacher-hero{background-image:var(--grad-hero);color:#fff;padding:3rem 0;text-align:center;position:relative;overflow:hidden}
@media(min-width:768px){.city-hero,.teacher-hero{padding:5rem 0}}
.city-hero::before,.teacher-hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 40%,rgba(226,182,88,.25),transparent 60%);pointer-events:none}
.city-hero .container,.teacher-hero .container{position:relative;z-index:2}

/* ============ RTL SAFETY ============ */
[dir="rtl"] .text-right{text-align:right}
[dir="rtl"] .text-left{text-align:left}
[dir="rtl"] .md\:text-right{text-align:right}
[dir="rtl"] .border-r-4{border-right-width:4px;border-left-width:0}
[dir="rtl"] .border-l-4{border-left-width:4px;border-right-width:0}

/* ============================================================
 * IMPORTED CONTENT STYLES — for HTML that came from city/, author/,
 * category/ static files and got imported via content-installer.
 * These class names are hard-coded in the imported post_content.
 * ============================================================ */

/* Stats strip (city/teacher pages) */
.stats-strip{background:#fff;padding:1.5rem;border-radius:20px;margin:2rem 0 3rem;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1.5rem;
  text-align:center;box-shadow:0 8px 32px rgba(15,60,42,.08)}
@media(min-width:768px){.stats-strip{padding:2rem}}
.stats-strip .stat-num{font-family:'Cairo',sans-serif;font-weight:900;font-size:2.25rem;line-height:1;
  background:linear-gradient(135deg,var(--brand-800),var(--gold-500));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
@media(min-width:768px){.stats-strip .stat-num{font-size:2.5rem}}
.stats-strip .stat-lbl{color:var(--ink-500);font-size:.9rem;margin-top:.5rem}
@media(min-width:768px){.stats-strip .stat-lbl{font-size:.95rem}}

/* Info grid + cards */
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.25rem;margin-top:1.5rem}
@media(min-width:768px){.info-grid{gap:1.5rem}}
.info-card{background:#fff;padding:1.5rem;border-radius:16px;box-shadow:0 4px 16px rgba(15,60,42,.08);
  border-top:4px solid var(--gold-500);transition:transform .3s,box-shadow .3s}
@media(min-width:768px){.info-card{padding:2rem}}
.info-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(15,60,42,.15)}
.info-card .icon{font-size:2.25rem;margin-bottom:.75rem;line-height:1}
.info-card h3{margin:0 0 .5rem;font-size:1.1rem;color:var(--brand-900)}
.info-card p{color:var(--ink-500);margin:0;line-height:1.7}

/* Landmarks / cities lists inside imported city posts */
.landmarks,.other-cities{background:#fff;padding:1.5rem;border-radius:16px;box-shadow:0 4px 16px rgba(15,60,42,.08);margin-top:1.5rem}
@media(min-width:768px){.landmarks,.other-cities{padding:2rem}}
.landmarks-list,.cities-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
@media(min-width:768px){.landmarks-list,.cities-list{gap:.75rem}}
.landmark,.city-tag{background:var(--cream);color:var(--brand-800);padding:.45rem 1rem;
  border-radius:50px;font-weight:700;font-size:.9rem;border:1px solid #f0ede4;
  text-decoration:none;transition:all .3s;display:inline-block}
@media(min-width:768px){.landmark,.city-tag{padding:.5rem 1.25rem;font-size:.95rem}}
.city-tag:hover{background:var(--brand-800);color:#fff;border-color:var(--brand-800)}
.other-cities{text-align:center;margin-top:2.5rem}
.other-cities h3{margin:0 0 .5rem;color:var(--brand-900);font-size:1.1rem}
.other-cities .cities-list{justify-content:center}

/* FAQ (used by imported city/author content) */
.faq{background:#fff;padding:1.5rem;border-radius:16px;box-shadow:0 4px 16px rgba(15,60,42,.08);margin-top:1.5rem}
@media(min-width:768px){.faq{padding:2rem}}
.faq details{border-bottom:1px solid #f0ede4;padding:.75rem 0}
.faq details:last-child{border-bottom:0}
.faq summary{cursor:pointer;font-weight:700;color:var(--brand-800);font-size:1rem;padding:.5rem 0;list-style:none;display:flex;align-items:center;gap:.6rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:'▶';color:var(--gold-500);transition:transform .3s;font-size:.8rem;display:inline-block}
.faq details[open] summary::before{transform:rotate(90deg)}
.faq details p{color:var(--ink-500);margin:.5rem 0 0;line-height:1.85;padding-inline-start:1.2rem}

/* Final CTA (imported) */
.cta-final{background:linear-gradient(135deg,var(--brand-950),var(--brand-800));color:#fff;
  padding:2.5rem 1.5rem;border-radius:20px;text-align:center;margin:2.5rem 0;position:relative;overflow:hidden}
@media(min-width:768px){.cta-final{padding:4rem 2rem;border-radius:24px}}
.cta-final::before{content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 50% 100%,rgba(228,182,88,.2),transparent 50%);pointer-events:none}
.cta-final h2{color:var(--gold-300);margin:0 0 1rem;position:relative;font-size:1.5rem}
@media(min-width:768px){.cta-final h2{font-size:2rem}}
.cta-final p{color:rgba(255,255,255,.9);margin:0 auto 1.5rem;position:relative;max-width:600px;line-height:1.75}
.btn-wa{display:inline-block;background:linear-gradient(135deg,#25D366,#128C7E);color:#fff;
  padding:1rem 2rem;border-radius:50px;text-decoration:none;font-family:'Cairo',sans-serif;
  font-weight:800;font-size:1.05rem;box-shadow:0 8px 24px rgba(37,211,102,.4);position:relative;
  transition:transform .3s}
@media(min-width:768px){.btn-wa{padding:1.25rem 2.5rem;font-size:1.15rem}}
.btn-wa:hover{transform:translateY(-3px);color:#fff}

/* Section title inside imported content — inline instead of centered */
.prose .section-title,.prose-lg .section-title{position:relative;display:block;text-align:start;
  color:var(--brand-800);padding-bottom:.6rem;margin:0 0 1rem;border-bottom:none}
.prose .section-title::after,.prose-lg .section-title::after{content:'';position:absolute;bottom:0;
  inset-inline-start:0;width:60px;height:4px;background:linear-gradient(90deg,var(--gold-500),var(--gold-300));
  border-radius:2px;transform:none;right:auto}

/* Inner content section spacing */
.prose .section,.prose-lg .section{padding:0;margin:2rem 0}

/* Hero-style intro block inside imported HTML */
.prose .hero,.prose-lg .hero{background:linear-gradient(135deg,var(--brand-950),var(--brand-800) 50%,var(--gold-500));
  color:#fff;padding:2.5rem 1.5rem;border-radius:20px;text-align:center;margin:0 0 2rem}
.prose .hero h1,.prose-lg .hero h1{color:#fff}
.prose .hero p,.prose-lg .hero p{color:rgba(255,255,255,.95)}
.prose .hero .badges,.prose-lg .hero .badges{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.prose .hero .badge,.prose-lg .hero .badge{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.25);
  color:#fff;padding:.4rem 1rem;border-radius:50px;font-size:.85rem}

/* Nested breadcrumbs inside imported content — hide (already have theme-level breadcrumbs) */
.prose .breadcrumbs,.prose-lg .breadcrumbs{display:none}

/* Teacher-specific imported classes */
.teacher-bio,.teacher-profile,.teacher-stats,.credentials-list,.specialties-grid,.timeline{
  margin:1.5rem 0}
.credentials-list li{list-style:none;padding:.5rem 0 .5rem 1.5rem;position:relative}
.credentials-list li::before{content:'📜';position:absolute;inset-inline-start:0}