/* SchoolEP V229.73 — zero-blank first-paint portrait + compact mirrored mobile authority for Index + Search.
   No outbound source button. Stable portrait geometry, larger quote typography,
   transparent hero-native surface, responsive desktop/tablet/mobile. */
.author-quote-wrap{
  --quote-text:inherit;
  --quote-muted:rgba(255,255,255,.82);
  position:relative;
  display:flex;
  flex-direction:row-reverse;
  align-items:center;
  direction:ltr;
  gap:12px;
  width:100%;
  min-width:0;
  height:146px;
  padding:4px 0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:inherit;
  isolation:isolate;
}
html[dir="rtl"] .author-quote-wrap{flex-direction:row}
html[dir="rtl"] .author-quote-content{direction:rtl;text-align:right}
html[dir="ltr"] .author-quote-content{direction:ltr;text-align:left}
.author-quote-photo{
  position:relative;display:grid;place-items:center;flex:0 0 142px;
  width:142px;height:142px;min-width:142px;min-height:142px;
  align-self:center;overflow:visible;background:transparent;
}
.author-quote-photo img{
  display:block;width:134px;height:134px;min-width:134px;min-height:134px;
  border:3px solid rgba(255,255,255,.34);border-radius:50%;background:transparent;
  object-fit:cover;object-position:center 22%;background-size:cover;background-position:center 22%;background-repeat:no-repeat;box-shadow:0 12px 28px rgba(8,18,48,.22);
  opacity:1;transition:opacity .14s ease;
}

/* Portrait visibility is owned here: no empty circle on first paint.
   A src-bearing image remains visible while decoding so its embedded micro-preview
   can paint immediately; the full local portrait replaces it without geometry shift. */
.author-quote-photo-fallback{display:none}
.author-quote-photo.is-loading{visibility:visible}
.author-quote-photo.is-loading img:not([src]){opacity:0;border-color:transparent;box-shadow:none}
.author-quote-photo.is-loading img[src]{opacity:1}
.author-quote-photo.is-error{display:grid}
.author-quote-photo.is-error img{display:none;opacity:0;border-color:transparent;box-shadow:none}
.author-quote-photo.is-error .author-quote-photo-fallback{display:grid;place-items:center;width:134px;height:134px;border:3px solid rgba(255,255,255,.24);border-radius:50%;background:rgba(23,37,84,.16);color:rgba(255,255,255,.72);font:900 2.35rem/1 Georgia,serif;box-shadow:0 12px 28px rgba(8,18,48,.12)}
.author-quote-photo.is-error .author-quote-photo-mark{inset-block-start:0;inset-inline-start:0;transform:none;width:29px;height:29px;font-size:.72rem}
.author-quote-photo-mark{
  position:absolute;z-index:2;inset-block-start:0;inset-inline-start:0;display:grid;place-items:center;
  width:29px;height:29px;border:1px solid rgba(255,255,255,.34);border-radius:50%;
  background:rgba(23,37,84,.58);color:#fff;font-size:.72rem;box-shadow:0 5px 12px rgba(8,18,48,.18)
}
.author-quote-nav{
  position:absolute;z-index:3;inset-inline:4px;inset-block-end:1px;display:flex;justify-content:space-between;pointer-events:none
}
.author-quote-nav button{
  pointer-events:auto;display:grid;place-items:center;width:29px;height:29px;padding:0;
  border:1px solid rgba(255,255,255,.36);border-radius:50%;background:rgba(23,37,84,.62);
  color:#fff;cursor:pointer;box-shadow:0 5px 12px rgba(8,18,48,.16);transition:transform .16s ease,background-color .16s ease
}
.author-quote-nav button:hover,.author-quote-nav button:focus-visible{background:rgba(67,97,238,.92);outline:0;transform:translateY(-1px)}
.author-quote-nav button:active{transform:scale(.92)}
.author-quote-content{
  position:relative;display:grid;align-content:center;flex:1 1 0;gap:8px;min-width:0;padding:6px 2px;background:transparent
}
.author-quote-content::before{
  content:"❝";position:absolute;inset-block-start:-6px;inset-inline-start:0;color:rgba(255,255,255,.28);
  font:900 2.25rem/1 Georgia,serif;pointer-events:none
}
.author-quote-text{
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;
  margin:0;padding-inline-start:25px;color:var(--quote-text);font-size:clamp(.94rem,1.18vw,1.08rem);
  font-weight:880;line-height:1.62;text-wrap:pretty
}
.author-quote-author-row{display:flex;align-items:center;min-width:0;padding-inline-start:25px}
.author-quote-author{
  min-width:0;color:var(--quote-muted);font-size:.76rem;font-weight:850;line-height:1.35;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.author-quote-wrap.is-entering .author-quote-content{animation:author-quote-copy-in .20s ease-out}
@keyframes author-quote-copy-in{from{opacity:.35}to{opacity:1}}
@media(max-width:1050px){
  .author-quote-wrap{height:136px;gap:9px}
  .author-quote-photo{flex-basis:116px;width:116px;height:116px;min-width:116px;min-height:116px}
  .author-quote-photo img{width:110px;height:110px;min-width:110px;min-height:110px}
  .author-quote-text{font-size:.88rem;-webkit-line-clamp:4}
}
@media(max-width:700px){
  .author-quote-wrap{
    display:grid;grid-template-columns:80px minmax(0,1fr);grid-template-areas:"photo content";
    align-items:center;direction:ltr;height:108px;gap:6px;padding:1px 0
  }
  /* Mobile keeps the same physical portrait/copy relationship as desktop:
     Arabic = portrait left / quote right; French/LTR = quote left / portrait right. */
  html[dir="ltr"] .author-quote-wrap{grid-template-columns:minmax(0,1fr) 80px;grid-template-areas:"content photo"}
  .author-quote-photo{grid-area:photo;flex-basis:80px;width:80px;height:80px;min-width:80px;min-height:80px}
  .author-quote-photo img{width:76px;height:76px;min-width:76px;min-height:76px;border-width:2px}
  .author-quote-content{grid-area:content;gap:4px;padding:1px 2px}
  .author-quote-content::before{font-size:1.48rem;inset-block-start:0}
  .author-quote-text{padding-inline-start:18px;font-size:.72rem;line-height:1.46;-webkit-line-clamp:4}
  .author-quote-author-row{padding-inline-start:18px}
  .author-quote-author{font-size:.60rem}
  .author-quote-photo-mark{width:22px;height:22px;font-size:.56rem}
  .author-quote-nav{inset-inline:0;inset-block-end:-1px}
  .author-quote-nav button{width:23px;height:23px;font-size:.58rem}
  html[dir="rtl"] .author-quote-content{direction:rtl;text-align:right}
  html[dir="ltr"] .author-quote-content{direction:ltr;text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .author-quote-wrap.is-entering .author-quote-content{animation:none}
  .author-quote-nav button{transition:none}
}


/* SchoolEP V229.58 — first-paint language isolation + stable portrait loading. */
[data-quote-fallback-lang]{display:none}
html[lang^="ar"] [data-quote-fallback-lang="ar"]{display:inline}
html[lang^="fr"] [data-quote-fallback-lang="fr"]{display:inline}
html[lang^="en"] [data-quote-fallback-lang="en"]{display:inline}
html[lang^="es"] [data-quote-fallback-lang="es"]{display:inline}

/* V229.70 fallback keeps portrait geometry stable if a local file is ever missing. */
@media(max-width:1050px){.author-quote-photo.is-error .author-quote-photo-fallback{width:110px;height:110px;font-size:2rem}}
@media(max-width:700px){.author-quote-photo.is-error .author-quote-photo-fallback{width:76px;height:76px;border-width:2px;font-size:1.45rem}.author-quote-photo.is-error .author-quote-photo-mark{width:22px;height:22px;font-size:.56rem}}
