/* Base de style : fiche Refero « Assembly Coffee London » (toile quasi noire à fond teinté, photos éclairées à la bougie, libellés et
   titres en serif italique comme un index imprimé, filets d'1 px, angles vifs, médaille dorée vieillie, aucune ombre). Le noir devient
   un brun laqué, le blanc un papier de riz doux, l'or une touche de laque vermillon ; sections recomposées pour La Baie d'Along. */
@font-face{font-family:Newsreader;src:url(fonts/newsreader.woff2?v=1) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
@font-face{font-family:Newsreader;src:url(fonts/newsreader-italic.woff2?v=1) format("woff2");font-weight:300 600;font-style:italic;font-display:swap}
@font-face{font-family:Figtree;src:url(fonts/figtree.woff2?v=1) format("woff2");font-weight:400 700;font-display:swap}
:root{
  --laque:#1b1512;--laque2:#251c18;--laque3:#120e0c;--papier:#e6d8bf;--papier2:#cdbea4;--or:#cfa53b;--vermillon:#e0583a;--trait:rgba(230,216,191,.22);
  --titre:Newsreader,Georgia,serif;--corps:Figtree,system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--laque);color:var(--papier);font-family:var(--corps);font-size:17px;line-height:1.65;padding-bottom:64px}
img{display:block;max-width:100%;height:auto}a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.annonce{background:var(--laque3);color:var(--papier2);text-align:center;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:7px 12px;border-bottom:1px solid var(--trait)}
.site-header{position:sticky;top:0;z-index:30;background:var(--laque);border-bottom:1px solid var(--trait)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:66px;width:min(100% - 40px,1360px);margin-inline:auto}
.marque{font-family:var(--titre);font-style:italic;font-size:26px;text-decoration:none;color:var(--papier);padding:8px 0}
.nav{display:none;gap:32px;margin-left:auto;margin-right:26px}
.nav a{font-family:var(--titre);font-style:italic;font-size:19px;text-decoration:none;padding:14px 0;border-bottom:1px solid transparent}
.nav a:hover,.nav a.on{border-bottom-color:var(--or);color:var(--or)}
.pilule{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:9999px;background:var(--papier);color:var(--laque);font-family:var(--corps);font-size:15px;font-weight:600;letter-spacing:.03em;text-decoration:none;border:1.5px solid var(--papier);transition:background .3s,color .3s}
.pilule:hover{background:transparent;color:var(--papier)}
.pilule-petite{min-height:42px;padding:0 20px;font-size:14px}
.pilule-contour{background:transparent;color:var(--papier)}
.pilule-contour:hover{background:var(--papier);color:var(--laque)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 26px;margin:0}
.actions-centre{justify-content:center}
.lien{font-weight:600;text-decoration:none;color:var(--or);border-bottom:1.5px solid currentColor;padding:12px 0 3px;display:inline-block}
.mini{font-family:var(--titre);font-style:italic;font-size:19px;margin:0 0 14px;color:var(--or)}
h1,h2{font-family:var(--titre);font-weight:300;margin:0;line-height:1;letter-spacing:-.015em}
h1 em,h2 em,.pied-marque em{font-style:italic;color:var(--or)}
h2{font-size:clamp(36px,6vw,66px);margin-bottom:24px}
/* Héros */
.hero-in{width:min(100% - 40px,1360px);margin-inline:auto;display:grid;gap:34px;padding:48px 0 56px}
h1{font-size:clamp(54px,15.5vw,128px);margin:0 0 22px;color:var(--papier)}
.hero-sous{font-size:19px;max-width:27em;margin:0 0 28px;color:#d4c6ad}
.hero-photo{margin:0;border:1px solid var(--or);padding:8px}
.hero-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
figcaption.x,.hero-photo figcaption,.legende{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#a99b84;margin:10px 0 0}
.hero-photo figcaption{margin:8px 0 0;text-align:right}
/* Menu en index */
.menu{padding:88px 20px 68px;border-top:1px solid var(--trait)}
.menu-in{width:min(100%,1240px);margin-inline:auto;display:grid;gap:40px}
.index{list-style:none;margin:0;padding:0;border-top:1px solid var(--trait);counter-reset:n}
.index li{display:grid;grid-template-columns:44px 1fr;column-gap:12px;padding:20px 0;border-bottom:1px solid var(--trait);align-items:baseline}
.index span{font-family:var(--titre);font-style:italic;color:var(--or);font-size:18px;grid-row:1 / span 2}
.index b{font-family:var(--titre);font-weight:400;font-style:italic;font-size:clamp(28px,4vw,40px);line-height:1.1}
.index i{font-style:normal;color:#bfb199;grid-column:2}
.note{font-size:14.5px;color:#b4a68f;margin:22px 0 0;max-width:46em}
.note-centre{width:min(100%,1240px);margin:34px auto 0}
/* Trio */
.trio{display:grid;gap:12px;padding:0 12px 12px}
.trio figure{margin:0;position:relative}
.trio img{width:100%;aspect-ratio:4/3;object-fit:cover}
.trio figcaption{position:absolute;left:0;bottom:0;width:100%;padding:36px 16px 12px;background:linear-gradient(0deg,rgba(18,14,12,.9),rgba(18,14,12,0));font-family:var(--titre);font-style:italic;font-size:24px}
.legende{text-align:center;margin:4px 0 0}
/* Terrasse */
.terrasse{padding:84px 20px;border-top:1px solid var(--trait);background:var(--laque2)}
.terrasse-in{width:min(100%,1240px);margin-inline:auto;display:grid;gap:36px}
.terrasse-texte p{max-width:34em;margin:0 0 22px;color:#d4c6ad}
.liste{list-style:none;margin:0;padding:0;max-width:34em}
.liste li{padding:13px 0;border-top:1px solid var(--trait);font-size:16px}
.liste li:last-child{border-bottom:1px solid var(--trait)}
/* Avis */
.avis-in{width:min(100% - 40px,1240px);margin-inline:auto;padding:84px 0}
.avis-grille{display:grid;margin-top:10px;border-top:1px solid var(--trait)}
.avis blockquote{margin:0;padding:28px 0;border-bottom:1px solid var(--trait)}
.avis blockquote p{font-family:var(--titre);font-style:italic;font-weight:300;font-size:clamp(23px,2.7vw,30px);line-height:1.25;margin:0 0 12px}
.avis footer{font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#a99b84}
.avis .lien{margin-top:24px}
/* Réservation */
.resa{background:var(--vermillon);color:var(--laque3);text-align:center;padding:88px 20px}
.resa-in{width:min(100%,760px);margin-inline:auto}
.resa-in h2{font-size:clamp(42px,8.6vw,88px);margin-bottom:12px;color:var(--laque3)}
.resa h2 em{color:var(--laque3)}
.resa-in p{margin:0 0 26px;font-size:19px}
.resa .pilule{background:var(--laque3);color:var(--papier);border-color:var(--laque3)}
.resa .pilule:hover{background:transparent;color:var(--laque3)}
/* Infos */
.infos-in{width:min(100% - 40px,1240px);margin-inline:auto;display:grid;gap:64px;padding:84px 0}
.infos h2{font-size:clamp(32px,4.8vw,54px)}
.horaires{width:100%;max-width:560px;border-collapse:collapse}
.horaires th,.horaires td{text-align:left;padding:13px 0;border-bottom:1px solid var(--trait);font-weight:400;font-size:16px}
.horaires th{font-family:var(--titre);font-style:italic;font-size:19px;font-weight:400;width:32%}
.horaires tr.today{background:rgba(207,165,59,.14)}
.horaires tr.today th::after{content:" · aujourd'hui";font-family:var(--corps);font-style:normal;font-size:14px;color:var(--or)}
address{font-style:normal;margin:0 0 22px;font-size:19px;line-height:1.7}
.pied{background:var(--laque3);color:#b4a68f;text-align:center;padding:52px 20px 44px;font-size:14px;border-top:1px solid var(--trait)}
.pied-marque{font-family:var(--titre);font-weight:300;font-size:clamp(38px,8vw,74px);color:var(--papier);margin:0 0 12px;line-height:1.05}
.pied p{margin:0 0 10px}.pied a{color:var(--papier);display:inline-block;padding:13px 0}
.petit{font-size:12.5px;max-width:62em;margin-inline:auto!important}
.callbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:center;min-height:58px;background:var(--vermillon);color:var(--laque3);font-weight:700;font-size:16px;text-decoration:none}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.pilule{transition:none}}
@media (min-width:900px){
  body{padding-bottom:0}.callbar{display:none}.nav{display:flex}
  .hero-in{grid-template-columns:1fr 1.05fr;align-items:center;gap:72px;padding:84px 0 96px}
  h1{font-size:clamp(70px,8.6vw,128px)}
  .menu-in{grid-template-columns:1fr 1.1fr;gap:96px;align-items:start}
  .trio{grid-template-columns:1fr 1fr 1fr;padding:0 16px 16px;gap:16px}
  .trio img{aspect-ratio:3/4}
  .legende{grid-column:1 / -1}
  .terrasse-in{grid-template-columns:1fr 1fr;gap:96px;align-items:center}
  .avis-grille{grid-template-columns:repeat(3,1fr);border-top:0;gap:40px}
  .avis blockquote{border-top:1px solid var(--trait);border-bottom:0}
  .infos-in{grid-template-columns:1fr 1fr;gap:110px}
}
