/* Approved CAMPER OS design, 19 October 2026.
   Load last: public pages keep their content, hero and language routing. */
body{background:var(--paper);color:var(--ink);font-size:16px;font-weight:400;line-height:1.6}

/* One content container, including its side padding. Nested sections use it. */
main#main{width:100%;max-width:var(--content);margin:0 auto;padding:48px 24px 64px}
#main .wrap{width:100%;max-width:none;margin-left:auto;margin-right:auto}
#main .hero{padding-top:0}
#main .sand,#main .dark{background:var(--paper);color:var(--ink)}
#main .privacy-objection{background:var(--paper);border-left:2px solid var(--olive)}
#main.privacy-page>p,#main.privacy-page>section{max-width:850px}

/* Site section headings use the booking portal's scale.
   Benefit labels remain smaller to fit their three-column mobile pictograms. */
#main h1{font-size:clamp(32px,4.5vw,54px);line-height:1.2;letter-spacing:normal}
#main h2{font-size:24px;line-height:1.2;letter-spacing:normal}
#main h3{line-height:1.2;letter-spacing:normal}
#main .visual-benefits h2{font-size:20px}

.coming-banner{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line)}
.coming-banner>span:first-child{border-left:2px solid var(--olive);padding-left:12px}
.header{min-height:100px}
.header .brand-original{width:200px;height:auto;padding:0;overflow:visible}
.header .brand-logo{width:100%;height:auto;max-height:none;object-fit:contain}

/* Actual controls and status labels share the approved button dimensions. */
.header .button,.hero-actions .button,.closing .button,.button{min-height:46px;border-radius:2px;border:1px solid var(--ink);font-weight:600;background:var(--ink);color:#fff}
.button.secondary{background:transparent;color:var(--ink)}
a.button:hover,button.button:hover{background:var(--sand);color:var(--ink)}
.button.coming-status{cursor:default}
.button.coming-status:hover{background:var(--ink);color:#fff}
.language-switch{gap:3px;border:1px solid var(--line);border-radius:3px;padding:3px;background:var(--paper)}
.language-switch a{min-width:40px;min-height:40px;padding:8px 10px;font-size:13px;font-weight:500}
.language-switch a:hover{background:var(--sand);color:var(--ink)}
.language-switch a[aria-current="page"],.language-switch a[aria-current="page"]:hover{background:var(--ink);color:#fff}
.footer.wrap{width:100%;max-width:var(--content);padding-left:24px;padding-right:24px}

@media(max-width:760px){
 main#main{padding:32px 20px 48px}
 #main h2{font-size:22px}
 #main .visual-benefits h2{font-size:14px}
 .header .brand-original{width:160px}
 .footer.wrap{padding-left:20px;padding-right:20px}
}
@media(max-width:360px){
 .header .brand-original{width:142px}
}

/* Opening status sits with the hero; compact screens keep the image clear. */
.hero-opening-banner{
 position:absolute;z-index:1;top:24px;left:24px;
 width:300px;max-width:calc(100% - 48px);
 padding:18px 20px;border-left:3px solid var(--olive);border-radius:2px;
 background:var(--ink);color:#fff;text-align:left;
}
.hero-opening-banner .hero-opening-title{
 display:block;color:#fff;font-size:24px;font-weight:600;line-height:1.2;
 letter-spacing:.06em;
}
.hero-opening-banner .hero-opening-lead{
 margin:8px 0 0;color:#fff;font-size:14px;font-weight:400;line-height:1.5;
}
.hero-opening-banner .hero-opening-status{
 margin:10px 0 0;color:#fff;font-size:13px;font-weight:600;line-height:1.5;
}
@media(max-width:1100px){
 .hero-opening-banner{
  position:static;width:100%;max-width:none;padding:18px 20px;
  border-radius:2px 2px 0 0;
 }
 .hero-opening-banner .hero-opening-title{font-size:22px}
}

/* Optical balance: retain every original silhouette and its aspect ratio.
   Adult 46px; child/dog 37px, on one ground line (about one head shorter).
   Widths follow the cropped artwork, avoiding square-box scaling artifacts. */
.included-pictos,.visual-pitch .included-pictos{align-items:flex-end;gap:12px;flex-wrap:wrap}
.included-pictos>span{display:flex;align-items:flex-end;flex:0 0 auto}
.included-pictos .included-adults{gap:5px}
.included-pictos .included-adults .icon{width:22px;height:46px;display:block;flex-shrink:0}
.included-pictos .included-child .icon{width:24px;height:37px;display:block;flex-shrink:0}
.included-pictos .included-dog .icon{width:40px;height:37px;display:block;flex-shrink:0}
.included-pictos small{line-height:1.4;padding-bottom:1px}
.pitch-symbol{display:flex;align-items:flex-end;min-height:142px}
.pitch-symbol .camper-picto{display:block;width:136px;height:auto;max-width:100%}
.pitch-symbol.compact .camper-picto{width:100px}
.pitch-symbol.xl .camper-picto{width:172px}
.visual-benefits .camper-picto{width:86px;height:auto;aspect-ratio:125 / 66;flex-shrink:0}
.visual-journey .camper-picto{width:80px;height:52px;max-width:100%}
.original-board-link{background:var(--paper)}
.original-board-link img{mix-blend-mode:multiply}
@media(max-width:760px){
 .included-pictos,.visual-pitch .included-pictos{gap:11px}
 .included-pictos .included-adults .icon{width:20px;height:42px}
 .included-pictos .included-child .icon{width:22px;height:34px}
 .included-pictos .included-dog .icon{width:37px;height:34px}
 .pitch-symbol{min-height:60px}
 .pitch-symbol .camper-picto{width:82px;height:auto}
 .pitch-symbol.compact .camper-picto{width:64px}
 .pitch-symbol.xl .camper-picto{width:100px}
 .visual-benefits .camper-picto{width:66px;height:auto;aspect-ratio:125 / 66}
 .visual-journey .camper-picto{width:58px;height:38px}
}

/* Original vector artwork retains its proportions in the established icon boxes. */
img.camper-picto{object-fit:contain}

/* Equal icon tracks keep every journey label on the same baseline. */
.visual-journey li{display:grid;grid-template-rows:auto 52px auto;align-content:start}
.visual-journey li>.icon{display:block;align-self:center}
@media(max-width:760px){
 .visual-journey li{grid-template-rows:auto 38px auto}
}