/* heritage-saintleger.org - stone and ochre palette, no framework */
:root
    {
    --stone:      #f4efe6;
    --stone-dark: #e3dccd;
    --ink:        #2b2520;
    --ink-soft:   #5e554c;
    --ochre:      #a8652a;
    --ochre-dark: #7f4a1b;
    --slate:      #4b5a68;
    --white:      #ffffff;
    --error:      #9b2c2c;
    }

*               { box-sizing: border-box; }
html            { font-size: 17px; }
body            { margin: 0; font-family: Georgia, "Times New Roman", serif; color: var(--ink); background: var(--stone); line-height: 1.55; }
a               { color: var(--ochre-dark); }
h1, h2, h3      { font-weight: normal; line-height: 1.2; }
h1              { font-size: 2rem; margin: 0 0 1rem; }
h2              { font-size: 1.4rem; margin: 1.8rem 0 0.6rem; color: var(--ochre-dark); }
.wrap           { max-width: 1040px; margin: 0 auto; padding: 0 1rem; }

/* header */
.site-header    { background: var(--white); border-bottom: 4px solid var(--ochre); }
.site-header .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.8rem; padding-top: 0.9rem; padding-bottom: 0.9rem; }
.brand          { text-decoration: none; color: var(--ink); display: flex; flex-direction: column; line-height: 1.1; }
.brand-name     { font-size: 1.7rem; letter-spacing: 0.05em; text-transform: uppercase; }
.brand-sub      { font-size: 0.9rem; color: var(--ink-soft); }
.nav            { display: flex; flex-wrap: wrap; gap: 0.3rem 1.1rem; align-items: center; }
.nav a          { text-decoration: none; color: var(--ink); padding: 0.35rem 0; border-bottom: 2px solid transparent; }
.nav a:hover    { border-bottom-color: var(--ochre); }
.nav-cta        { background: var(--ochre); color: var(--white) !important; padding: 0.35rem 0.9rem !important; border-radius: 3px; }
.nav-cta:hover  { background: var(--ochre-dark); border-bottom-color: transparent !important; }
.nav-cta-alt    { background: var(--slate); }
.nav-cta-alt:hover { background: #36424d; }

/* home */
.hero           { padding: 3rem 0 2rem; text-align: center; }
.hero h1        { font-size: 2.4rem; }
.lead           { font-size: 1.15rem; color: var(--ink-soft); max-width: 44rem; margin: 0 auto 1.5rem; }
.cards          { display: grid; grid-template-columns: repeat( auto-fit, minmax( 260px, 1fr ) ); gap: 1.2rem; margin: 1rem 0 3rem; }
.card           { background: var(--white); padding: 1.3rem 1.4rem; border-top: 3px solid var(--ochre); }
.card h2        { margin-top: 0; }

/* pages */
.page           { background: var(--white); padding: 2rem 2.2rem; margin: 2rem 0 3rem; max-width: 760px; }
.page-narrow    { max-width: 420px; }
.page-wide      { max-width: none; }
.notice         { background: var(--stone-dark); padding: 0.7rem 1rem; border-left: 4px solid var(--ochre); font-style: italic; }
.actions        { margin-top: 1.5rem; display: flex; flex-wrap: wrap; gap: 0.7rem; justify-content: center; }
.btn            { display: inline-block; background: var(--ochre); color: var(--white); text-decoration: none; padding: 0.7rem 1.4rem; border: 0; border-radius: 3px; font: inherit; cursor: pointer; }
.btn:hover      { background: var(--ochre-dark); }
.btn-alt        { background: var(--slate); }
.btn-alt:hover  { background: #36424d; }
.btn-small      { padding: 0.4rem 0.9rem; }

/* forms */
.form label     { display: block; margin: 0.8rem 0; font-size: 0.95rem; color: var(--ink-soft); }
.form input[type=text], .form input[type=email], .form input[type=tel], .form input[type=password], .form input[type=number], .form textarea
                { display: block; width: 100%; margin-top: 0.25rem; padding: 0.55rem 0.7rem; font: inherit; color: var(--ink); border: 1px solid #c9c1b2; border-radius: 3px; background: #fffdf9; }
.form .row      { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.form .check    { display: flex; gap: 0.6rem; align-items: flex-start; color: var(--ink); }
.form .check input { margin-top: 0.3rem; }
.amounts        { border: 1px solid #c9c1b2; border-radius: 3px; padding: 0.8rem 1rem; margin: 0.8rem 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1.2rem; }
.amounts legend { color: var(--ink-soft); font-size: 0.95rem; padding: 0 0.3rem; }
.amount         { display: inline-flex !important; align-items: center; gap: 0.4rem; margin: 0 !important; color: var(--ink) !important; }
.amount-free input[type=number] { display: inline-block !important; width: 7rem; margin: 0 !important; }
.errors         { background: #fbeaea; border-left: 4px solid var(--error); color: var(--error); padding: 0.7rem 1rem; margin: 1rem 0; }
.errors ul      { margin: 0; padding-left: 1.2rem; }

/* admin */
.admin-bar      { color: var(--ink-soft); }
.filters        { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-end; margin: 1rem 0; }
.filters label  { display: flex; flex-direction: column; font-size: 0.9rem; color: var(--ink-soft); }
.filters select { font: inherit; padding: 0.35rem; margin-top: 0.2rem; }
.table-wrap     { overflow-x: auto; }
.table          { border-collapse: collapse; width: 100%; font-size: 0.9rem; font-family: system-ui, sans-serif; }
.table th, .table td { text-align: left; padding: 0.45rem 0.6rem; border-bottom: 1px solid var(--stone-dark); white-space: nowrap; }
.table th       { background: var(--stone); }
.table .num     { text-align: right; }
.status-pending { color: var(--ink-soft); }
.status-refused, .status-error { color: var(--error); }

/* footer */
.site-footer    { background: var(--ink); color: #cfc6b8; padding: 1.5rem 0; font-size: 0.9rem; }
.site-footer a  { color: #e8dfcf; }
.site-footer p  { margin: 0.2rem 0; }

@media ( max-width: 640px )
    {
    .form .row  { grid-template-columns: 1fr; }
    .page       { padding: 1.3rem 1.1rem; }
    .hero h1    { font-size: 1.8rem; }
    }

/* v0.1.1 : real content - logo, photo hero, steps, timeline, gallery */
.brand          { flex-direction: row; align-items: center; gap: 0.7rem; }
.brand-logo     { width: 52px; height: 60px; object-fit: contain; }
.brand-text     { display: flex; flex-direction: column; line-height: 1.1; }
.hero-photo     { position: relative; padding: 0; margin: 1.5rem 0 1rem; text-align: left; overflow: hidden; border-radius: 4px; }
.hero-img       { display: block; width: 100%; height: 420px; object-fit: cover; }
.hero-text      { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.6rem 1.8rem; background: linear-gradient( to top, rgba( 43, 37, 32, 0.92 ), rgba( 43, 37, 32, 0.55 ) 70%, rgba( 43, 37, 32, 0 ) ); color: var(--white); }
.hero-text h1   { font-size: 1.9rem; margin-bottom: 0.5rem; }
.hero-text .lead { color: #efe8db; margin: 0 0 1rem; max-width: 46rem; font-size: 1.05rem; }
.hero-text .actions { justify-content: flex-start; margin-top: 0.5rem; }
.page-full      { max-width: none; }
.steps          { display: grid; grid-template-columns: repeat( auto-fit, minmax( 200px, 1fr ) ); gap: 1rem; margin: 1rem 0 1.5rem; }
.step           { background: var(--stone); padding: 1rem 1.1rem; border-top: 3px solid var(--ochre); }
.step h3        { margin: 0.3rem 0; font-size: 1.15rem; }
.step p         { margin: 0; font-size: 0.95rem; color: var(--ink-soft); }
.step-num       { display: inline-block; width: 1.8rem; height: 1.8rem; line-height: 1.8rem; text-align: center; border-radius: 50%; background: var(--ochre); color: var(--white); font-size: 0.95rem; }
.missions       { padding-left: 1.2rem; }
.missions li    { margin: 0.45rem 0; }
.quote          { margin: 1.5rem 0; padding: 1rem 1.4rem; border-left: 4px solid var(--ochre); font-style: italic; font-size: 1.15rem; color: var(--ochre-dark); background: var(--stone); }
.small          { font-size: 0.9rem; color: var(--ink-soft); }
.figure         { margin: 0 0 1rem; }
.figure img     { width: 100%; display: block; border-radius: 3px; }
.figure-right   { float: right; width: 40%; margin: 0 0 1rem 1.5rem; }
figcaption      { font-size: 0.85rem; color: var(--ink-soft); margin-top: 0.3rem; font-style: italic; }
.timeline       { margin: 1rem 0; display: grid; grid-template-columns: max-content 1fr; gap: 0.5rem 1.2rem; }
.timeline dt    { font-weight: bold; color: var(--ochre-dark); white-space: nowrap; }
.timeline dd    { margin: 0; }
.gallery        { display: grid; grid-template-columns: repeat( auto-fit, minmax( 200px, 1fr ) ); gap: 1rem; margin: 1rem 0 1.5rem; }
.gallery figure { margin: 0; }
.gallery img    { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; border-radius: 3px; }
.budget         { font-size: 1.2rem; background: var(--stone); padding: 0.8rem 1rem; border-left: 4px solid var(--ochre); }
@media ( max-width: 640px )
    {
    .hero-img     { height: 300px; }
    .hero-text    { position: static; background: var(--ink); }
    .hero-text h1 { font-size: 1.4rem; }
    .figure-right { float: none; width: 100%; margin: 0 0 1rem; }
    .brand-sub    { display: none; }
    }

/* v0.1.3 : admin manual entry */
.success        { background: #e8f3e6; border-left: 4px solid #3a7d44; color: #2c5e34; padding: 0.7rem 1rem; margin: 1rem 0; }
.form select    { display: block; width: 100%; margin-top: 0.25rem; padding: 0.55rem 0.7rem; font: inherit; color: var(--ink); border: 1px solid #c9c1b2; border-radius: 3px; background: #fffdf9; }
.form input[type=date] { display: block; width: 100%; margin-top: 0.25rem; padding: 0.5rem 0.7rem; font: inherit; border: 1px solid #c9c1b2; border-radius: 3px; background: #fffdf9; }

/* v0.1.4 : admin users */
.inline         { display: inline; }
.row-actions    { white-space: nowrap; }
.row-actions form { margin-right: 0.4rem; }
.btn-danger     { background: var(--error); }
.btn-danger:hover { background: #7a2020; }
.success code   { background: #fff; padding: 0.1rem 0.4rem; border: 1px solid #b9d3b4; border-radius: 3px; font-size: 1.05rem; }