/* V3 : nouvelles galeries et visite du studio, dans le design existant. */
.collection-cards{grid-template-columns:repeat(4,minmax(0,1fr))}
.collection-card{aspect-ratio:4/5}
.collection-card span{font-size:clamp(22px,2.2vw,32px)}
#lettering .g{grid-template-columns:repeat(3,minmax(0,1fr))}
.gallery-more-photos{margin-top:28px}
.gallery-more-photos>summary{width:fit-content;cursor:pointer;color:var(--gold);padding:14px 20px;border:1px solid var(--line);font-size:14px;min-height:48px}
.gallery-more-photos[open]>summary{margin-bottom:25px}
.studio-moments,.studio-tour{max-width:1220px;margin:70px auto;padding:0 52px}
.studio-tour{scroll-margin-top:110px}
.panorama{position:relative;isolation:isolate;background:#12100c;border:1px solid var(--line);aspect-ratio:16/9;overflow:hidden}
.panorama-poster{width:100%;height:100%;object-fit:cover;filter:brightness(.65)}
.panorama-start{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);white-space:normal;width:max-content;max-width:90%;background:#0b0a08e8}
.is-page .panorama .panorama-start:hover,.is-page .panorama .panorama-start:focus-visible{transform:translate(-50%,-50%)}
.panorama canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.panorama canvas:active{cursor:grabbing}
.panorama-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px}
.panorama-controls select,.panorama-controls button{font:inherit;color:var(--beige);background:#15110c;border:1px solid var(--line);min-height:44px;min-width:44px;padding:8px 14px;border-radius:2px}
.panorama-controls label{font-size:14px}
.panorama-help,.panorama-status{font-size:13px!important;color:var(--muted);margin-top:14px}
.lb__status{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);font-size:13px;color:var(--beige)}
.gift-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}
.gift-hero figure{margin:0}
.gift-hero img{width:100%;height:auto;border:1px solid var(--line)}
.gift-phone{font-size:14px!important;margin-top:24px}
.gift-steps{margin-top:70px}
.gift-steps ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px;padding-left:24px}
.gift-steps li::marker{color:var(--gold)}
.gift-steps strong{color:var(--beige)}
.gift-steps p{font-size:15px!important;margin-top:14px}
@media(max-width:700px){
 .collection-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
 .collection-card span{font-size:23px}
 #lettering .g{grid-template-columns:repeat(2,minmax(0,1fr))}
 .studio-moments,.studio-tour{padding:0 22px;margin:45px auto}
 .panorama{aspect-ratio:1/1}
 .panorama-controls{gap:8px}
 .panorama-controls label{width:100%}
 .gallery-more-photos>summary{font-size:13px}
 .gift-hero,.gift-steps ol{grid-template-columns:1fr;gap:24px}
 .gift-hero figure{max-width:430px;margin:auto}
}
@media(max-width:380px){.collection-card span{font-size:20px;left:10px;right:8px}}

.appointment-send{margin-top:32px!important}
/* Même dégradé doré pour les titres du contenu sur toutes les pages. */
body main :is(h1,h2,h3,h4,h5,h6){background:linear-gradient(115deg,#fff5e2 8%,#e8c17d 48%,#c98b2e 88%);background-clip:text;-webkit-background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
@media(forced-colors:active){body main :is(h1,h2,h3,h4,h5,h6){background:none;color:CanvasText;-webkit-text-fill-color:CanvasText}}
.home-story .welcome-letter{text-align:left;max-width:740px;margin:0 auto}
.welcome-letter h2{font:400 clamp(30px,3vw,40px)/1.25 var(--display);color:var(--beige);margin-bottom:32px}
.welcome-letter p{font-size:17px;line-height:1.95;margin:0 0 24px}
.home-story .welcome-styles{max-width:740px;margin:48px auto 35px;padding-top:30px;border-top:1px solid var(--line);text-align:left}
.welcome-styles h3{font:400 27px/1.3 var(--display);margin-bottom:18px}
.welcome-styles ul{list-style:none;padding:0;margin:0}
.home-story .welcome-styles a{display:inline-flex;align-items:center;min-height:44px;color:var(--gold);font-size:16px;font-weight:500;text-decoration:none}
.home-story .welcome-styles a:hover,.home-story .welcome-styles a:focus-visible{color:var(--beige);text-decoration:underline}
@media(max-width:700px){.welcome-letter p{font-size:15px;line-height:1.9}.welcome-letter h2{margin-bottom:24px}}
/* Rapprocher le portrait du texte lorsque l'écran s'élargit. */
@media(min-width:1001px){
 .immersive-visual{right:clamp(0px,calc(27vw - 324px),180px)}
 .immersive-visual img{mask-image:linear-gradient(90deg,transparent 0%,#000 26%,#000 88%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 26%,#000 88%,transparent 100%)}
 .immersive-hero::before{background:linear-gradient(90deg,#0b0a08 0%,#0b0a08e6 22%,#0b0a0860 39%,transparent 59%),linear-gradient(0deg,#0b0a08 0%,transparent 12%)}
}
@media(min-width:1001px) and (max-width:1300px){.mast,.is-page .mast{padding-inline:22px;gap:18px}.nav__ul{gap:14px}.mast .nav__a{font-size:13px}.wordmark{font-size:28px}.wordmark span{font-size:9px}}

.is-page .content-block .fineline-intro-title{font-size:clamp(21px,2.35vw,28px);line-height:1.3}
@media(max-width:700px){.is-page .content-block .fineline-intro-title{font-size:26px}}

/* Titres des blocs de toutes les pages de styles. */
.is-page .style-page .content-block h2{font-size:clamp(21px,2.35vw,28px);line-height:1.3}
.is-page .style-page .content-block h2.style-title-long{font-size:clamp(19px,2vw,24px)}

@media(max-width:700px){.is-page .style-page .content-block h2,.is-page .style-page .content-block h2.style-title-long{font-size:26px}}

/* Navigation des styles : liste verticale harmonisée. */
.is-page .style-page .related-pages>div{grid-template-columns:1fr;max-width:calc(50% - 15px)}
@media(max-width:700px){.is-page .style-page .related-pages>div{max-width:100%}}

/* FAQ : laisser toute la largeur au titre. */
.is-page .style-page .seo-faq .section-heading{grid-template-columns:1fr;gap:14px}
.is-page .style-page #style-faq-title{text-align:center;width:100%;font-size:clamp(25px,3vw,36px)}
.gallery-preview-hidden{display:none!important}

/* Boutons de galerie centres et six autres styles en deux colonnes. */
.gallery-more{display:flex;justify-content:center;text-align:center;width:100%}
.is-page .style-page .related-pages>div{max-width:100%;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,auto);grid-auto-flow:column}
@media(max-width:700px){.is-page .style-page .related-pages>div{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}}

/* Accueil : liens de styles a la suite, reseaux sous les avis. */
.home-story .welcome-styles{text-align:center;max-width:1000px}
.home-story .welcome-styles h3{text-align:center}
.home-story .welcome-styles ul{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 24px}
.home-story .welcome-styles li{margin:0}
.home-story .welcome-social{margin-top:24px}

.about-studio-practical{margin-top:36px;padding-top:30px;border-top:1px solid var(--gold)}

/* Titre de presentation compact. */
.is-page .about-profile__title{font-size:clamp(25px,3vw,36px);line-height:1.2}

.home-story .welcome-signature{padding-top:0}

.about-cta-wrap #cta-title{font-size:clamp(22px,2.4vw,28px);line-height:1.3}

/* Titres harmonises des invitations a contacter le studio. */
.is-page .cta-panel h2{font-size:clamp(22px,2.4vw,28px);line-height:1.3}

.appointment-page .appointment-send{display:flex;justify-content:center;text-align:center}

/* Ajustements des titres demandes par Yan. */
.is-page .appointment-page .deposit-panel h2{font-size:clamp(22px,2.4vw,28px);line-height:1.3}
body main .welcome-letter h2{width:fit-content;max-width:100%;background-image:linear-gradient(115deg,#fff5e2 8%,#e8c17d 48%,#c98b2e 88%)}

body main #tour-title{width:fit-content;max-width:100%;background-image:linear-gradient(115deg,#fff5e2 8%,#e8c17d 48%,#c98b2e 88%)}

/* Rendez-vous : degrades sur la largeur du texte. */
body main .appointment-page :is(.page-intro h1,.deposit-panel h2,#cta-title){width:fit-content;max-width:100%;background-image:linear-gradient(115deg,#fff5e2 8%,#e8c17d 48%,#c98b2e 88%)}
.is-page .appointment-page :is(.deposit-panel h2,#cta-title){font-size:clamp(22px,2.4vw,28px);line-height:1.3}

/* Meme palette douce que le titre d accueil sur tous les titres. */
body main :is(h1,h2,h3,h4,h5,h6){background-image:linear-gradient(115deg,#fff5e2 8%,#e8c17d 48%,#c98b2e 88%)!important}
@media(forced-colors:active){body main :is(h1,h2,h3,h4,h5,h6){background-image:none!important}}

/* Bon cadeau : appliquer le degrade sur toute la largeur des mots. */
body main.gift-page :is(#gift-how,.cta-panel h2){width:fit-content;max-width:100%}

/* Coordonnees : texte discret, dore au survol et au clavier. */
body.is-page main .contact-page .contact-card a.contact-link{color:inherit;transition:color .2s ease}
body.is-page main .contact-page .contact-card a.contact-link:is(:hover,:focus-visible){color:var(--gold)}

/* Galerie : degrade visible sur le titre principal. */
body main .gallery-page>.page-intro>h1{width:fit-content;max-width:100%}
