/* Paris: a continuous editorial story, visible before enhancement. */
:root { --story-ink:#152538; --story-blue:#183d63; --story-gold:#a4782e; --story-paper:#f7f3ea; --story-line:#d8cbb4; }
img[src="/images/paris/logo-officiel-france.jpeg"] { object-fit:contain!important; background:#fff; }
[data-story-lang][hidden], .story-language-note[hidden], #integration-panel[hidden], #integration-status[hidden], #integration-theme[hidden] { display:none!important; }
.story-chapter, #storia, #attualita, #vie, #solidarite, #communautes, #story-albums, .story-france, #mensaje, #folleto { scroll-margin-top:100px; }
h1[tabindex="-1"]:focus, h2[tabindex="-1"]:focus, h3[tabindex="-1"]:focus { outline:0; box-shadow:0 2px 0 var(--story-gold); }
.story-language-note { padding:.8rem 1rem; border-left:2px solid var(--story-gold); color:var(--story-ink); font-size:.9rem; }
/* RF-04 (T3): la regla global de aplanado se retira; el estado sin JS ahora
   es estático por defecto en 05-login-reveal-responsive.css (base opacity:1
   y animación solo bajo html.js-reveal + no-preference). */
#integration-vitrine { padding:clamp(3rem,6vw,6rem) 0; background:#f7f3ea; }
#integration-vitrine .integration-vitrine-head { margin:0 0 2rem; }
#integration-vitrine .section-label { display:none; }
#integration-title { max-width:25ch; font-family:'Playfair Display',Georgia,serif; font-weight:400; font-variant:normal; text-transform:none; font-size:clamp(2rem,4vw,3.6rem); line-height:1.1; }
#integration-intro { max-width:65ch; margin:.8rem 0 0; text-align:left; }
/* Índice del relato: tarjetas separadas (decisión 5 del usuario); el contenedor
   ya no dibuja la rejilla de línea continua (sin fondo/borde de guía). */
.story-index { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-4); border:0; background:transparent; }
/* Tarjeta estándar: --radius-md + borde sutil + sombra neutral base (RF-01). */
.story-index-card { display:grid; grid-template-columns:76px minmax(0,1fr); align-items:center; gap:1rem; min-height:132px; padding:1.1rem; text-decoration:none; color:var(--story-ink); background:var(--surface-card); border-radius:var(--radius-md); border:var(--border-card); box-shadow:var(--shadow-md); transition:background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
/* RF-03: contorno 3px #183d63 sobre #fffdf8, contraste muy superior a 3:1. */
.story-index-card:focus-visible { outline:3px solid var(--story-blue); outline-offset:-4px; box-shadow:var(--shadow-hover); }
/* RF-02b: :active sin guardia (equivale al pase del hover, elevación ≤3px). */
.story-index-card:active { background:#eee7d8; box-shadow:var(--shadow-hover); transform:translateY(-1px); }
/* RF-02b: el hover solo bajo @media(hover:hover) para no dejar estados pegados en táctil. */
@media (hover:hover) {
  .story-index-card:hover { background:#eee7d8; box-shadow:var(--shadow-hover); transform:translateY(-2px); }
}
.story-index-card>img { display:block; width:76px; height:90px; object-fit:cover; background:#e7e0d2; }
.story-index-card[href="#folleto"]>img, .story-index-card[href="#celebriamo"]>img { object-fit:contain; }
.story-index-card-copy { display:block; min-width:0; }
.story-index-card-copy strong { display:block; font-family:'Playfair Display',Georgia,serif; font-size:1.2rem; font-weight:600; line-height:1.15; margin-bottom:.4rem; }
.story-index-card-copy>span { font-size:.8rem; line-height:1.5; color:#4c5e6e; }
.story-index-card[href="#storia"] { order:-2; grid-column:span 2; grid-template-columns:42% minmax(0,1fr); min-height:230px; padding:0; gap:1.6rem; overflow:hidden; }
.story-index-card[href="#storia"]>img { width:100%; height:230px; object-fit:cover; }
.story-index-card[href="#storia"] .story-index-card-copy { padding:1.5rem 1.5rem 1.5rem 0; }
.story-index-card[href="#storia"] strong { font-size:clamp(1.9rem,3vw,2.5rem); }
/* Ficha de París: acento de borde sobre la superficie común. */
.story-index-card[href="#communautes"] { order:-1; grid-template-columns:1fr; background:var(--surface-card); color:var(--story-ink); border-top:3px solid var(--story-blue); box-shadow:var(--shadow-md); }
.story-index-card[href="#communautes"]>img { display:none; }
.story-index-card[href="#communautes"] strong { font-size:1.8rem; }
.story-index-card[href="#communautes"] .story-index-card-copy>span { color:#4c5e6e; }
/* El foco azul conserva contraste sobre la superficie clara de la ficha. */
.story-index-card[href="#communautes"]:focus-visible { outline-color:var(--story-blue); }
.story-index-card[href="#communautes"]:active { transform:translateY(-1px); }
@media (hover:hover) {
  .story-index-card[href="#communautes"]:hover { transform:translateY(-2px); }
}
#storia { background:#fffdf8; }
#storia .section-label { display:none; }
#storia .section-title { font-family:'Playfair Display',Georgia,serif; text-transform:none; font-weight:400; font-size:clamp(2.1rem,4vw,3.6rem); }
#storia .timeline { max-width:1080px; gap:2.5rem; }
#storia .timeline::before { left:9px; top:22px; bottom:22px; width:2px; background:linear-gradient(to bottom,var(--story-gold) calc(var(--story-progress,0) * 100%),var(--story-line) 0); }
#storia .timeline-item { margin:0; padding-left:35px; }
/* sombra neutral del vocabulario en el punto; ya no se aplasta a none (RF-01) */
#storia .timeline-dot { top:28px; left:1px; width:18px; height:18px; background:var(--story-gold); box-shadow:var(--shadow-sm); }
/* Las tarjetas de historia comparten la superficie y escala de las demás familias. */
#storia .timeline-card { border-radius:var(--radius-md); border:var(--border-card); box-shadow:var(--shadow-md); background:var(--surface-card); transition:transform var(--transition-fast), box-shadow var(--transition-fast); }
/* RF-02b: :active equivalente al hover, elevación ≤3px; sin estado pegado en táctil. */
#storia .timeline-card:active { transform:translateY(-1px); box-shadow:var(--shadow-hover); }
@media (hover:hover) {
  #storia .timeline-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-hover); }
}
#storia .timeline-title { font-family:'Playfair Display',Georgia,serif; font-variant:normal; text-transform:none; font-size:clamp(1.5rem,2.1vw,2rem); line-height:1.15; }
#storia .timeline-date { font-family:Inter,sans-serif; color:#70531e; letter-spacing:.02em; }
#storia .timeline-body { font-size:.96rem; }
#storia .timeline-details { max-height:none!important; opacity:1; overflow:visible; }
#storia .details-content { padding:0; margin:.8rem 0 0; border:0; background:none; }
#storia .details-content p { font-size:.96rem; }
#storia .timeline-toggle, #storia .timeline-footer { display:none; }
#storia .story-france .timeline-card { background:var(--surface-card); border-color:var(--story-blue); grid-template-columns:minmax(0,44%) minmax(0,1fr); }
#storia .story-france .timeline-content { padding:clamp(1.2rem,2.5vw,2.1rem); }
#storia .story-france .timeline-title { color:var(--story-blue); }
#storia .story-france .timeline-visual { aspect-ratio:auto; background:transparent; align-self:start; }
#storia .story-france .timeline-visual::after { display:none; }
.story-visual { margin:0; width:100%; }
.story-visual img { display:block; width:100%; height:auto; object-fit:contain; }
.story-visual figcaption { padding:.8rem 1.1rem; font-size:.76rem; line-height:1.5; color:#526575; }
[data-story-image-error] { display:grid; place-items:center; margin:0; text-align:center; background:#e7e0d2; color:var(--story-ink); }
.story-source-note { margin-top:1rem; font-size:.72rem; color:#627483; }
.story-source-body p { margin:0 0 .8rem; line-height:1.75; }
#france-1 .timeline-card { border-top:4px solid var(--story-blue); }
.story-arrival { position:relative; display:grid; grid-template-columns:1fr 1fr; background:var(--surface-card); color:var(--story-ink); border:var(--border-card); border-radius:var(--radius-md); box-shadow:var(--shadow-md); margin:1rem 0 0 35px; overflow:hidden; }
.story-arrival>img { width:100%; height:100%; min-height:280px; object-fit:cover; }
.story-arrival>div { padding:clamp(1.5rem,4vw,3rem); align-self:center; }
.story-arrival h3 { margin:.8rem 0; font:400 clamp(1.8rem,3vw,3rem)/1.1 var(--font-serif); color:var(--story-ink); }
.story-arrival p { color:var(--gray-700); }
.story-europe, #folleto a { display:inline-flex; min-height:44px; align-items:center; }
.story-body, .story-topic-body { max-width:72ch; line-height:1.8; }
.story-open-copy { max-width:72ch; margin:2rem auto; line-height:1.8; }
.story-open-copy h3, .story-open-copy h2 { margin:1.6rem 0 .7rem; font-family:'Playfair Display',Georgia,serif; font-size:1.6rem; }
#communautes .story-open-copy { max-width:none; }
.story-community h3>div { display:contents; }
.story-collection-note { padding:1rem 0; border-bottom:1px solid var(--story-line); }
.story-body h3, .story-topic-body h3 { margin:1.8rem 0 .7rem; font-family:'Playfair Display',Georgia,serif; font-size:1.6rem; }
#vie { background:var(--bg-secondary); color:var(--story-ink); }
#vie .section-title, #vie h3, #vie p, #vie a { color:inherit; }
#vie .story-language-note { color:var(--story-ink); }
#vie .story-body, #vie .story-topic-body { margin:auto; }
#solidarite { background:#f7f3ea; }
#solidarite .story-body, #solidarite .story-topic-body { margin:auto; }
.story-community-grid, .story-communities { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
/* Comunidades servidas al vocabulario: mismo radio/sombra que .faith-principle
   (--radius-md / --shadow-md) para coherencia intra-grilla (RF-01). */
.story-community { padding:1.5rem; border:var(--border-card); border-top:2px solid var(--story-gold); border-radius:var(--radius-md); box-shadow:var(--shadow-md); background:var(--surface-card); }
/* Ficha de París: acento de borde sobre la superficie común. */
.story-community:first-child { background:var(--surface-card); color:var(--story-ink); border-top-color:var(--story-blue); box-shadow:var(--shadow-md); }
.story-community:first-child h3, .story-community:first-child a, .story-community:first-child address { color:var(--story-ink); }
.story-community h3 { margin:0 0 .7rem; font-family:var(--font-serif); font-size:1.6rem; }
.story-community address { margin:.7rem 0; line-height:1.65; font-style:normal; }
.story-community a { display:inline-flex; align-items:center; min-height:44px; overflow-wrap:anywhere; }
.story-album-links { display:flex; flex-wrap:wrap; gap:.6rem 1.5rem; margin-top:1.5rem; }
.story-album-links a { display:inline-flex; align-items:center; min-height:44px; border-bottom:1px solid var(--story-gold); color:var(--story-blue); }
#vie .story-album-links a { color:var(--story-blue); }
#story-albums { background:#f7f3ea; }
#integration-panel { scroll-margin-top:100px; }
#story-albums:not(.is-active) #integration-panel, #story-albums:not(.is-active) #integration-status, #story-albums:not(.is-active) #integration-theme { display:none; }
#story-albums>.integration-panel, #story-albums>.integration-status, #story-albums>.integration-theme { max-width:1080px; margin:1.5rem auto; padding:0 1.5rem; }
.integration-album-grid img { object-fit:contain!important; background:#e8e3d9; }
.story-brochure img, #folleto img { width:auto; max-width:100%; max-height:320px; object-fit:contain; }
@media(max-width:900px) {
 .story-index { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .story-index-card[href="#storia"] { grid-column:span 2; }
 .story-community-grid, .story-communities { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
 .story-index { grid-template-columns:1fr; }
 .story-index-card, .story-index-card[href="#communautes"] { grid-template-columns:66px minmax(0,1fr); min-height:110px; padding:1rem; }
 .story-index-card>img { width:66px; height:80px; }
 .story-index-card[href="#storia"] { grid-column:auto; min-height:190px; grid-template-columns:40% minmax(0,1fr); gap:1rem; }
 .story-index-card[href="#storia"]>img { height:190px; }
 .story-index-card[href="#storia"] .story-index-card-copy { padding:1rem .8rem 1rem 0; }
 .story-index-card[href="#communautes"] { grid-template-columns:1fr; }
 .story-index-card-copy strong { font-size:1.15rem; }
 .story-index-card-copy>span { font-size:.78rem; }
 #storia .timeline { gap:1.6rem; }
 #storia .timeline-item { padding-left:20px; }
 #storia .timeline::before { left:3px; }
 #storia .timeline-dot { left:-4px; width:16px; height:16px; }
 #storia .story-france .timeline-card { grid-template-columns:1fr; }
 #storia .timeline-content { padding:1.1rem; }
 .story-arrival { grid-template-columns:1fr; margin-left:20px; }
 .story-arrival>img { min-height:0; max-height:200px; }
 .story-community-grid, .story-communities { grid-template-columns:1fr; }
 .story-language-note { font-size:.8rem; }
}
@media(prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto!important; }
 .story-index *, #storia *, .story-chapter * { animation:none!important; transition:none!important; }
 #storia .timeline::before { background:var(--story-line); }
}