:root{
    --bg:#e8e6d7;
    --fg:#000;
}

/* Fonts */
@font-face{
    font-family:"Shibui";
    font-weight:700;
    src:url("/fonts/Shibui%20Bold.ttf") format("truetype");
    font-display:swap;
}

@font-face{
    font-family:"Helvetica Neue";
    font-weight:500;
    src:url("/fonts/HelveticaNeue-Condensed.otf") format("opentype");
    font-display:swap;
}

@font-face{
    font-family:"Juana Alt";
    font-weight:300;
    src:url("/fonts/Juana Alt Thin.ttf") format("truetype");
    font-display:swap;
}

/* Base */
*{
    box-sizing:border-box;
    margin:0;
    padding:0;
}

html,body{
    background:var(--bg);
    color:var(--fg);
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight:500;
    line-height:1.7;
    letter-spacing: 0.01em;
}

/* Titres */
h1{
    font-family:"Shibui", serif;
    font-weight:700;
    letter-spacing:.02em;
    font-size:2.3rem;
}

h2{
    font-family:"Juana Alt", serif;
    font-weight:300;
    letter-spacing:.02em;
    font-size:1.95rem;
}

/* Menu centré simple */
.menu{
    width:100%;
    max-width:28rem;
    margin-top:3rem;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap: 1.1rem;
}

.menu a{
    font-family:"Juana Alt", serif;
    font-weight:300;
    font-size:1.75rem;
    text-align:center;
    color: #000;
    text-decoration: none;
    padding: 0.4rem 0;
    transition: opacity .3s ease;
    white-space: nowrap;
}

.menu a:hover {
    opacity: 0.6;
}

/* Langues corrigées */
.lang{
    display:flex;
    gap:.7rem;
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.15em;
    justify-content:flex-end;
}
.lang a{
    color: #000;
    text-decoration: none;
    opacity: 0.5;
    transition: opacity .3s;
}
.lang a:hover{ opacity: 0.75; }
.lang a.active{
    opacity: 1;
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Image About - CORRIGÉE */
.about-img{
    width:100%;
    max-width: 420px;
    margin: 2.5rem auto 2.5rem;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.about-img img{
    width: 100%;
    height: auto;
    display: block;
}

/* Autres éléments */
.page{
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:1.5rem;
}

.header{
    width:100%;
    max-width:28rem;
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
}
.header .spacer{width:5rem;}

/* Logo */
.logo {
    display: block;
    width: 160px;
    max-width: 100%;
    height: auto;
}
.logo img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

@media (max-width: 768px) {
    .logo { width: 130px; }
}
@media (max-width: 480px) {
    .logo { width: 110px; }
}

.hero {
  width: 100%;
  max-width: 28rem;
  margin-top: 2rem;
}

.hero img {
  width: 100%;
  height: auto;
  display: block;
}

.back,
.back:visited {
    color: #000;
    text-decoration: none;
}

.back:hover {
    opacity: 0.5;
}


.collections-list a:visited,
.collections-list a {
    color: #000;
    text-decoration: none;
}

.content{
    width:100%;
    max-width:42rem;
    margin:3rem 0 4rem;
}

.collections-list{display:flex;flex-direction:column;gap:1rem;margin-top:2rem;}
.collections-list a{display:block;padding:1.5rem;border:1px solid rgba(0,0,0,.2);text-align:center;font-family:"Juana Alt",serif;font-size:1.3rem;transition:background .2s;}
.collections-list a:hover{background:rgba(0,0,0,.05);}

.content h1{font-size:2.3rem;margin-bottom:2rem;}
.content h2{font-size:1.95rem;margin:2.5rem 0 .75rem;}
.content p{margin-bottom:1rem;}
.content ul{margin:.5rem 0 1rem 1.5rem;}

.back{display:inline-block;font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;padding:1rem 0;}
.back:hover{opacity:.5;}

.footer-copy{margin-top:3rem;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;opacity:.5;}


/* Trustpilot */
.trustpilot-container {
    margin: 40px 0 20px 0;
    padding: 15px 0;
    text-align: center;
}

.trustpilot-container .trustpilot-widget {
    display: inline-block;
    width: 100%;
    max-width: 400px;                    
}



/* Pour mobile */
@media (max-width: 768px) {
    .trustpilot-container {
        margin: 30px 0 15px 0;
        padding: 12px 0;
    }
}
