/* pma-barcelone.fr — famille V8-atlas, habillage pierre du Barri Gòtic + azur méditerranéen (hue 205°) */
@font-face{
  font-family:"DM Serif Display"; font-style:normal; font-weight:400; font-display:swap;
  src:url("/fonts/dmserif-display-regular.woff2") format("woff2");
}
@font-face{
  font-family:"DM Serif Display"; font-style:italic; font-weight:400; font-display:swap;
  src:url("/fonts/dmserif-display-italic.woff2") format("woff2");
}
@font-face{
  font-family:"Fira Sans Condensed"; font-style:normal; font-weight:400; font-display:swap;
  src:url("/fonts/fira-condensed-400.woff2") format("woff2");
}
@font-face{
  font-family:"Fira Sans Condensed"; font-style:italic; font-weight:400; font-display:swap;
  src:url("/fonts/fira-condensed-400-italic.woff2") format("woff2");
}
@font-face{
  font-family:"Fira Sans Condensed"; font-style:normal; font-weight:500; font-display:swap;
  src:url("/fonts/fira-condensed-500.woff2") format("woff2");
}
@font-face{
  font-family:"Fira Sans Condensed"; font-style:normal; font-weight:600; font-display:swap;
  src:url("/fonts/fira-condensed-600.woff2") format("woff2");
}
@font-face{
  font-family:"Fira Sans Condensed"; font-style:normal; font-weight:700; font-display:swap;
  src:url("/fonts/fira-condensed-700.woff2") format("woff2");
}
:root{
  --pmb-paper:      oklch(0.970 0.010 85);
  --pmb-surface:    oklch(0.938 0.014 83);
  --pmb-ink:        oklch(0.240 0.020 230);
  --pmb-accent:     oklch(0.550 0.120 205);
  --pmb-accent-d:   oklch(0.420 0.115 205);
  --pmb-line:       oklch(0.880 0.010 85);
  --pmb-field-line: oklch(0.480 0.045 205);
  --pmb-white:      oklch(0.995 0.004 85);
  --font-display: "DM Serif Display", Georgia, serif;
  --font-text: "Fira Sans Condensed", system-ui, sans-serif;
  --pmb-radius: 4px;
  --pmb-radius-sm: 3px;
  --pmb-maxw: 1180px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--pmb-paper); color:var(--pmb-ink);
  font-family:var(--font-text); font-weight:400; line-height:1.6; font-size:17px;
}
h1,h2,h3{font-family:var(--font-display); font-weight:400; line-height:1.1; margin:0 0 .5em; letter-spacing:-.005em}
h1{font-size:clamp(1.9rem, 5vw, 3.4rem)}
@media (max-width:640px){.pmb-hero h1{font-size:1.5rem; margin-bottom:.3rem}}
h2{font-size:clamp(1.45rem, 2.8vw, 2rem); margin-top:0}
h3{font-size:1.2rem}
p{margin:0 0 1em}
a{color:var(--pmb-accent-d)}
ul{margin:0 0 1em; padding-left:1.2em}
img{max-width:100%; height:auto; display:block}
.pmb-skip{position:absolute; left:-999px; top:0; background:var(--pmb-white); padding:.6em 1em; z-index:100}
.pmb-skip:focus{left:8px; top:8px}
.pmb-wrap{max-width:var(--pmb-maxw); margin:0 auto; padding:0 1.25rem}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap}

/* topbar */
.pmb-topbar{background:var(--pmb-ink); color:var(--pmb-white); font-size:.78rem; font-family:var(--font-text)}
.pmb-topbar-in{display:flex; justify-content:space-between; gap:1rem; padding:.22rem 1.25rem; flex-wrap:wrap}
.pmb-topbar a{color:var(--pmb-white)}
.pmb-topbar-in span{display:none}
@media (min-width:560px){.pmb-topbar-in span{display:inline}}

/* header */
.pmb-header{background:var(--pmb-white); border-bottom:1px solid var(--pmb-line); position:sticky; top:0; z-index:40}
.pmb-header-in{display:flex; align-items:center; gap:1rem; padding:.45rem 1.25rem; flex-wrap:nowrap; position:relative}
.pmb-logo{font-family:var(--font-display); font-weight:400; font-size:1.25rem; color:var(--pmb-ink); text-decoration:none;
  margin-right:auto; flex-shrink:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.pmb-burger{display:none; flex-direction:column; justify-content:center; align-items:center; gap:4px; width:44px; height:44px;
  border:1.5px solid var(--pmb-line); border-radius:var(--pmb-radius-sm); background:var(--pmb-white); cursor:pointer; flex-shrink:0; padding:0}
.pmb-burger-bar{display:block; width:16px; height:2px; background:var(--pmb-ink); margin:0 auto}
.pmb-nav{display:flex; align-items:center; min-width:0; overflow-x:auto; -webkit-overflow-scrolling:touch}
.pmb-nav-list{list-style:none; display:flex; gap:1.2rem; margin:0; padding:0; align-items:center; flex-wrap:nowrap; white-space:nowrap; font-family:var(--font-text)}
.pmb-nav-list > li > a{color:var(--pmb-ink); text-decoration:none; font-weight:600; font-size:.94rem}
.pmb-cta-header-short{display:none}

@media (max-width:640px){
  .pmb-burger{display:flex}
  .pmb-cta-header-full{display:none}
  .pmb-cta-header-short{display:inline}
  .pmb-nav{display:none; position:absolute; top:100%; left:0; right:0; background:var(--pmb-white);
    border-bottom:1px solid var(--pmb-line); box-shadow:0 10px 24px rgba(20,30,45,.10); overflow-x:visible}
  .pmb-nav.is-open{display:block}
  .pmb-nav-list{flex-direction:column; align-items:stretch; gap:0; white-space:normal; padding:.5rem 1.25rem 1rem}
  .pmb-nav-list > li > a, .pmb-nav-drop-btn{display:block; padding:.6rem 0; font-size:1rem}
  .pmb-nav-sub{position:static; box-shadow:none; border:0; padding:0 0 0 1rem}
}
@media (max-width:400px){
  .pmb-header-in{gap:.5rem; padding:.5rem .75rem}
  .pmb-logo{max-width:48vw; font-size:1rem}
  .pmb-cta-header{padding:.5rem .6rem; font-size:.8rem}
}
.pmb-nav-drop{position:relative; display:flex; align-items:center}
.pmb-nav-drop-btn{background:none; border:0; margin:0; line-height:inherit; font-family:var(--font-text); font-weight:600; font-size:.94rem; color:var(--pmb-ink); cursor:pointer; padding:0}
.pmb-nav-sub{list-style:none; margin:0; padding:.5rem; position:absolute; top:100%; left:0; background:var(--pmb-white); border:1px solid var(--pmb-line); border-radius:var(--pmb-radius-sm); min-width:230px; box-shadow:0 10px 28px rgba(20,30,45,.12); display:none}
.pmb-nav-drop:hover .pmb-nav-sub, .pmb-nav-drop:focus-within .pmb-nav-sub{display:block}
.pmb-nav-sub li a{display:block; padding:.4rem .5rem; color:var(--pmb-ink); text-decoration:none; border-radius:2px; font-size:.92rem}
.pmb-nav-sub li a:hover{background:var(--pmb-surface)}
.pmb-cta-header{margin-left:.5rem; white-space:nowrap; flex-shrink:0; flex-grow:0}

/* buttons */
.pmb-btn{display:inline-block; font-family:var(--font-text); font-weight:700; text-decoration:none; padding:.72rem 1.35rem; border-radius:var(--pmb-radius); border:0; cursor:pointer; font-size:1rem; letter-spacing:.01em}
.pmb-btn-accent{background:var(--pmb-accent-d); color:var(--pmb-white)}
.pmb-btn-accent:hover{background:oklch(0.36 0.115 205)}

/* bands */
.pmb-band{padding:2.8rem 0}
.pmb-band-alt{background:var(--pmb-surface)}
.pmb-band-ink{background:var(--pmb-ink); color:var(--pmb-white)}
.pmb-band-ink h2, .pmb-band-ink h3{color:var(--pmb-white)}
.pmb-band-ink a:not(.pmb-btn){color:oklch(0.85 0.05 205)}
.pmb-two-up{display:grid; grid-template-columns:1fr 1fr; gap:2.5rem}
@media (max-width:760px){.pmb-two-up{grid-template-columns:1fr}}
.pmb-content-narrow{max-width:760px}

/* hero mode A — photo pleine page + formulaire court intégré */
.pmb-hero{position:relative; min-height:min(78vh, 640px); display:flex; align-items:flex-end; color:var(--pmb-white); overflow:hidden}
@media (max-width:640px){.pmb-hero{min-height:auto}}
.pmb-hero-img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0}
.pmb-hero::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,16,24,.42) 0%, rgba(10,16,24,.62) 30%, rgba(10,16,24,.90) 62%, rgba(10,16,24,.94) 100%); z-index:1}
.pmb-hero-in{position:relative; z-index:2; width:100%; padding:1.4rem 0 1.2rem;
  background:linear-gradient(180deg, rgba(9,15,22,0) 0%, rgba(9,15,22,.72) 22%, rgba(9,15,22,.94) 100%)}
@media (max-width:640px){.pmb-hero-in{padding:1rem 0 .9rem}}
.pmb-hero .pmb-kicker{color:oklch(0.93 0.04 205); font-weight:800; margin-bottom:.3rem}
@media (max-width:640px){.pmb-hero .pmb-kicker{font-size:.7rem; margin-bottom:.2rem}}
.pmb-hero h1{color:var(--pmb-white); max-width:20ch}
.pmb-hero-lede{max-width:52ch; font-size:1.05rem; color:oklch(0.97 0.006 85)}
@media (max-width:640px){.pmb-hero-lede{font-size:.92rem; margin-bottom:.7rem}}
.pmb-hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:2rem; align-items:end}
@media (max-width:640px){.pmb-hero-grid{gap:.9rem}}
@media (max-width:640px){.pmb-hero-grid{grid-template-columns:1fr} .pmb-hero{min-height:auto}}

/* formulaire */
.pmb-form{background:var(--pmb-white); color:var(--pmb-ink); border-radius:var(--pmb-radius); padding:1rem; box-shadow:0 14px 34px rgba(10,16,26,.22)}
@media (max-width:640px){.pmb-form{padding:.8rem}}
.pmb-form-compact{max-width:420px}
.pmb-form-full{max-width:560px}
.pmb-field{margin-bottom:.5rem}
@media (max-width:640px){.pmb-field{margin-bottom:.4rem} .pmb-field label{font-size:.78rem; margin-bottom:.15rem} .pmb-field input, .pmb-field textarea{padding:.48rem .6rem}}
.pmb-field label{display:block; font-size:.85rem; font-weight:600; margin-bottom:.25rem}
.pmb-field input, .pmb-field textarea{width:100%; padding:.6rem .7rem; border:1.5px solid var(--pmb-field-line); border-radius:var(--pmb-radius-sm); font-family:var(--font-text); font-size:1rem; background:var(--pmb-white); color:var(--pmb-ink)}
.pmb-field input:focus, .pmb-field textarea:focus{outline:2px solid var(--pmb-accent); outline-offset:1px}
.pmb-honeypot{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.pmb-consent{display:flex; gap:.5rem; align-items:flex-start; font-size:.82rem; margin:.5rem 0 .6rem; line-height:1.35}
@media (max-width:640px){.pmb-consent{font-size:.74rem}}
.pmb-consent input{margin-top:.2rem}
.pmb-reassure{font-size:.78rem; color:oklch(0.42 0.02 230); margin:.4rem 0 0}
@media (max-width:640px){.pmb-reassure{font-size:.7rem}}
.pmb-form-compact .pmb-btn{width:100%; text-align:center}

/* preuve chiffrée 4x1 */
.pmb-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; text-align:center; list-style:none; margin:0; padding:0}
@media (max-width:760px){.pmb-stats{grid-template-columns:1fr 1fr}}
.pmb-stat-num{font-family:var(--font-display); font-size:clamp(1.7rem,4vw,2.6rem); display:block; color:oklch(0.82 0.06 205)}
.pmb-stat-label{font-size:.88rem; opacity:.85}

/* itinéraire — module signature */
.pmb-itineraire{list-style:none; margin:0; padding:0; display:grid; gap:1.4rem}
.pmb-itin-item{display:grid; grid-template-columns:auto 1fr; gap:1rem; padding:1.1rem 0; border-bottom:1px solid var(--pmb-line)}
.pmb-itin-item:last-child{border-bottom:0}
.pmb-itin-jour{font-family:var(--font-display); font-size:1.05rem; color:var(--pmb-accent-d); background:var(--pmb-surface); border-radius:999px; width:52px; height:52px; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.pmb-itin-body h3{margin-bottom:.25rem}

/* grille prestations */
.pmb-cards-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem}
@media (max-width:820px){.pmb-cards-3{grid-template-columns:1fr}}
.pmb-cards-4{display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem}
@media (max-width:900px){.pmb-cards-4{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.pmb-cards-4{grid-template-columns:1fr}}
.pmb-card{background:var(--pmb-white); border:1px solid var(--pmb-line); border-radius:var(--pmb-radius); padding:1.4rem}
.pmb-card h3{margin-bottom:.5rem; font-size:1.1rem}
.pmb-card-link{font-weight:700; font-size:.92rem; text-decoration:none}

/* galerie */
.pmb-gallery{display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem}
@media (max-width:760px){.pmb-gallery{grid-template-columns:1fr 1fr}}
.pmb-gallery figure{margin:0}
.pmb-gallery img{border-radius:var(--pmb-radius); aspect-ratio:4/5; object-fit:cover; width:100%}
.pmb-gallery figcaption{font-size:.78rem; margin-top:.35rem; opacity:.75; font-style:italic}

/* carte de la ville / légende */
.pmb-carte-legende{display:grid; grid-template-columns:1fr 1fr; gap:.6rem 1.4rem; list-style:none; margin:1rem 0 0; padding:0; font-size:.92rem}
@media (max-width:600px){.pmb-carte-legende{grid-template-columns:1fr}}
.pmb-carte-legende li{display:flex; gap:.5rem; align-items:flex-start}
.pmb-carte-legende b{color:var(--pmb-accent-d); font-family:var(--font-display); font-weight:400}

/* méthode / sourcing — remplace un "portrait équipe" fabriqué */
.pmb-methode{display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem}
@media (max-width:820px){.pmb-methode{grid-template-columns:1fr}}
.pmb-methode-item{padding:0}
.pmb-methode-num{font-family:var(--font-display); font-size:1.6rem; color:var(--pmb-accent-d); display:block; margin-bottom:.3rem}

/* check */
.pmb-check{list-style:none; padding:0; margin:0}
.pmb-check li{padding-left:1.6em; position:relative; margin-bottom:.6em}
.pmb-check li::before{content:"—"; position:absolute; left:0; color:var(--pmb-accent-d); font-weight:700}

/* FAQ */
.pmb-faq{border-top:1px solid var(--pmb-line)}
.pmb-faq-item{border-bottom:1px solid var(--pmb-line); padding:.9rem 0}
.pmb-faq-item summary{cursor:pointer; font-weight:600; font-size:1.02rem; list-style:none}
.pmb-faq-item summary::-webkit-details-marker{display:none}
.pmb-faq-item summary::after{content:"+"; float:right; font-family:var(--font-display); font-size:1.3rem}
.pmb-faq-item[open] summary::after{content:"−"}
.pmb-faq-a{padding-top:.6rem}

/* fil d'ariane */
.pmb-breadcrumb{font-size:.82rem; margin-bottom:1rem; opacity:.75}
.pmb-breadcrumb a{color:inherit; text-decoration:underline}
.pmb-breadcrumb .sep{margin:0 .4em}

/* confiance / sourcing (remplace avis fabriqués) */
.pmb-confiance-list{list-style:none; padding:0; margin:0 0 1rem; display:grid; gap:1rem}
.pmb-confiance-list li{padding-left:0}
.pmb-confiance-note{font-size:.85rem; opacity:.75}

/* blog */
.pmb-blog-list{display:grid; gap:.9rem}
.pmb-blog-item{padding-bottom:.8rem; border-bottom:1px solid var(--pmb-line)}
.pmb-blog-item h2{font-size:1.15rem; margin-bottom:.2rem}
.pmb-blog-item p{margin-bottom:0; font-size:.94rem}
.pmb-blog-date{font-size:.78rem; opacity:.65; margin-bottom:.1rem}
.pmb-article-body h2{margin-top:1.8rem}
.pmb-article-body p{margin-bottom:1.1em}

/* frise-lite (comment ça se passe) */
.pmb-frise-lite{padding-left:1.2em}
.pmb-frise-lite li{margin-bottom:.6em}

/* footer */
.pmb-footer{background:var(--pmb-ink); color:oklch(0.85 0.02 230); padding:2.6rem 0 1.4rem; margin-top:2rem; font-size:.92rem}
.pmb-footer a{color:var(--pmb-white)}
.pmb-footer-cols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:1.8rem; margin-bottom:1.6rem}
@media (max-width:760px){.pmb-footer-cols{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.pmb-footer-cols{grid-template-columns:1fr}}
.pmb-footer-brand{font-family:var(--font-display); font-size:1.15rem; color:var(--pmb-white); margin-bottom:.4rem}
.pmb-footer-h{font-weight:700; color:var(--pmb-white); margin-bottom:.5rem; text-transform:uppercase; font-size:.78rem; letter-spacing:.04em}
.pmb-footer ul{list-style:none; padding:0; margin:0}
.pmb-footer li{margin-bottom:.35rem}
.foot-sources{font-size:.78rem; opacity:.7; border-top:1px solid oklch(0.32 0.02 230); padding-top:1rem; margin-top:1rem}
.foot-sources a{color:inherit; text-decoration:underline}
.pmb-copy{font-size:.78rem; opacity:.6; margin-top:.6rem}

/* kicker / lede communs */
.pmb-kicker{text-transform:uppercase; letter-spacing:.08em; font-size:.78rem; font-weight:700; color:var(--pmb-accent-d); margin-bottom:.5rem}
.pmb-lede{font-size:1.08rem; opacity:.9}
.pmb-content-block{margin-bottom:1.8rem}

/* bulletin (footer) */
.pmb-bulletin{display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.6rem}
.pmb-bulletin input{flex:1; min-width:180px; padding:.55rem .7rem; border-radius:var(--pmb-radius-sm); border:1.5px solid oklch(0.72 0.02 230); background:transparent; color:var(--pmb-white)}
.pmb-bulletin .pmb-btn{padding:.55rem 1rem; font-size:.9rem}

.pmb-cta-final{text-align:left}
.pmb-cta-final h2{margin-bottom:1rem}
