/* Rebrand: three distinct demo salons. Loaded last so each brand's palette, type and marks win.
   Classic = Petal Nail Studio (the brick loft from the commercial). Luxury = Atelier Lune. Modern = Gloss Club. */

/* Brand marks shared by every demo */
.salon .wordmark.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit;line-height:1}
.salon .wordmark.brand svg{flex:none;width:30px;height:30px}
.salon .wordmark.brand small{display:block;font:500 9px/1.4 'DM Sans',sans-serif;letter-spacing:.28em;text-transform:uppercase;margin-top:4px;opacity:.8}

/* Petal Nail Studio: cream, blush and plum, warm serif, neighborhood loft */
body .salon.classic{--paper:#f7f1eb;--ink:#2f2527;--muted:#6b5a5a;--accent:#652a40;--line:#e3d2cb;--wash:#efdcd6}
body .salon.classic .wordmark.brand{font:500 27px/1 'Cormorant Garamond',Georgia,serif;letter-spacing:.14em;text-transform:uppercase;color:#652a40}
body .salon.classic .site-nav{background:#f7f1eb}
body .salon.classic .button{background:#652a40;border-color:#652a40;color:#fff8f3;border-radius:999px}
body .salon.classic .button.light{background:transparent;color:#652a40}
body .salon.classic .hero-copy .button{background:#652a40;border-color:#652a40;color:#fff8f3}
body .salon.classic .hero-media:after{background:linear-gradient(90deg,#f7f1ebf2 0%,#f7f1ebc4 26%,#f7f1eb00 64%)}
body .salon.classic h1,body .salon.classic h2,body .salon.classic .service h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:500}
body .salon.classic .eyebrow{color:#8a4a5f}
body .salon.classic .benefits{background:#efdcd6;color:#652a40;border-color:#e3c9c1}
body .salon.classic .style-ribbon{background:#652a40;color:#fbeee8}
body .salon.classic .style-ribbon p{font-family:'Cormorant Garamond',Georgia,serif;font-size:32px}

/* Atelier Lune: onyx, champagne and bone, light serif with wide capitals, private suites */
body .salon.luxury{--paper:#f3ece2;--ink:#1b1715;--muted:#6f6359;--accent:#1b1715;--line:#d8cbbb;--wash:#e9dfd1}
body .salon.luxury .site-nav{background:#171412;color:#efe3cf;border-color:#3a322b}
body .salon.luxury .wordmark.brand{font:400 21px/1 'Cormorant Garamond',Georgia,serif;letter-spacing:.32em;text-transform:uppercase;color:#e9d7b5}
body .salon.luxury .site-nav .button{background:transparent;border-color:#c9a978;color:#efe3cf}
body .salon.luxury .salon-hero{background:#171412}
body .salon.luxury .hero-media:after{background:linear-gradient(90deg,#171412ee 0%,#17141299 36%,#17141200 74%)}
body .salon.luxury .hero-copy,body .salon.luxury .hero-copy>p{color:#f3ece2}
body .salon.luxury .hero-copy h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300}
body .salon.luxury .hero-copy .button{background:#c9a978;border-color:#c9a978;color:#171412}
body .salon.luxury .hero-actions a{color:#e9d7b5;border-color:#8c7b6b}
body .salon.luxury .eyebrow{letter-spacing:.24em}
body .salon.luxury .button{background:#1b1715;border-color:#1b1715;color:#f3ece2;border-radius:0}
body .salon.luxury .button.light{background:transparent;color:#1b1715}
body .salon.luxury #services{background:#211c19}
body .salon.luxury #services,body .salon.luxury #services .section-head h2,body .salon.luxury #services .service h3{color:#f3ece2}
body .salon.luxury #services p,body .salon.luxury #services .eyebrow,body .salon.luxury #services .service-meta{color:#cdbfae}
body .salon.luxury #services .service-book{color:#e9d7b5;border-color:#8c7b6b}
body .salon.luxury .duo{background:#171412;color:#f3ece2}
body .salon.luxury .duo .eyebrow,body .salon.luxury .duo p{color:#cdbfae}
body .salon.luxury .duo h2{color:#f3ece2}
body .salon.luxury .duo .button.light{color:#e9d7b5;border-color:#c9a978}
body .salon.luxury .benefits{background:#171412;color:#c9a978;border-color:#3a322b;letter-spacing:.16em;text-transform:uppercase;font-size:11px}
body .salon.luxury .style-ribbon{background:#171412;color:#e9d7b5}
body .salon.luxury .style-ribbon p{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:32px}
body .salon.luxury h1,body .salon.luxury h2,body .salon.luxury .service h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400}

/* Gloss Club: paper white, ink and cherry, heavy grotesk, flash energy */
body .salon.modern{--paper:#f6f4f0;--ink:#121212;--muted:#555;--accent:#c8102e;--line:#dedad3;--wash:#f1ede6;font-family:'Manrope',sans-serif}
body .salon.modern .site-nav{background:#f6f4f0}
body .salon.modern .wordmark.brand{font:800 26px/1 'Manrope',Arial,sans-serif;letter-spacing:-.05em;color:#121212}
body .salon.modern .wordmark.brand small{letter-spacing:.2em;color:#c8102e;opacity:1}
body .salon.modern .salon-hero{background:#f6f4f0;color:#121212}
body .salon.modern .hero-media:after{background:linear-gradient(90deg,#f6f4f0 0%,#f6f4f0e8 16%,#f6f4f000 56%)}
body .salon.modern .hero-copy h1{font-family:'Manrope',Arial,sans-serif;font-weight:800;letter-spacing:-.06em;color:#121212}
body .salon.modern h2{font-family:'Manrope',Arial,sans-serif;font-weight:800;letter-spacing:-.04em}
body .salon.modern .eyebrow{color:#c8102e;font-weight:700}
body .salon.modern .button{background:#c8102e;border-color:#c8102e;color:#fff;border-radius:999px;font-weight:700}
body .salon.modern .button.light{background:#121212;border-color:#121212;color:#fff}
body .salon.modern .hero-actions a{color:#121212;border-color:#121212}
body .salon.modern .benefits{background:#121212;color:#fff;letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:700}
body .salon.modern .style-ribbon{background:#c8102e;color:#fff}
body .salon.modern .style-ribbon p{font:800 30px/1.2 'Manrope',Arial,sans-serif;letter-spacing:-.03em}
body .salon.modern .service h3{font-family:'Manrope',Arial,sans-serif;font-weight:700}

@media(max-width:800px){
 body .salon.classic .hero-media:after{background:linear-gradient(0deg,#f7f1ebf5 0%,#f7f1ebcc 30%,#f7f1eb00 75%)}
 body .salon.luxury .hero-media:after{background:linear-gradient(0deg,#171412f2 0%,#1714129c 38%,#17141200 90%)}
 body .salon.modern .hero-media:after{background:linear-gradient(0deg,#f6f4f0 0%,#f6f4f0cc 35%,#f6f4f000 80%)}
 .salon .wordmark.brand{font-size:20px}
 .salon .wordmark.brand svg{width:24px;height:24px}
 body .salon.luxury .wordmark.brand{font-size:16px;letter-spacing:.24em}
}

/* Sales page cards and previews pick up the new brand colors */
.edition-mini-luxury{background:#171412;color:#e9d7b5}
.edition-mini-modern{background:#f6f4f0;color:#121212}
.edition-mini-modern .mini-heading{font-family:'Manrope',Arial,sans-serif;font-weight:800}
.edition-mini-classic{background:#efdcd6;color:#652a40}
.site-choice.luxury{--choice:#171412}
.site-choice.modern{--choice:#c8102e}
.site-choice.classic{--choice:#652a40}
.brand-preview.luxury{background:#e9dfd1}
.brand-preview.modern{background:#f1ede6}
.actual-design-card.luxury .actual-design-window,.actual-design-card.luxury .actual-design-label{background:#171412}
.actual-design-card.modern .actual-design-window,.actual-design-card.modern .actual-design-label{background:#f6f4f0}
.product-grid.luxury{--paper:#171412;--ink:#efe3cf;--scene:#e9dfd1}
.product-grid.modern{--paper:#c8102e;--ink:#fff;--scene:#f1ede6}

/* Keep each brand's wash above the hero photo and film so the headline always reads */
.salon .salon-hero .hero-media:after{z-index:2}
body .salon.modern #services{background-color:#f1ede6}
body .salon.modern .salon-hero .hero-copy h1{font-size:clamp(56px,6.2vw,100px)}
body .salon.modern .hero-media:after{background:linear-gradient(90deg,#f6f4f0 0%,#f6f4f0f2 22%,#f6f4f000 58%)}
@media(max-width:800px){body .salon.modern .salon-hero .hero-copy h1{font-size:58px}}
@media(max-width:800px){
 body .salon.classic .hero-media:after{background:linear-gradient(0deg,#f7f1eb 0%,#f7f1eb 42%,#f7f1ebcc 58%,#f7f1eb00 82%)}
 body .salon.modern .hero-media:after{background:linear-gradient(0deg,#f6f4f0 0%,#f6f4f0 42%,#f6f4f0cc 58%,#f6f4f000 82%)}
}

/* Print collections: tabbed examples on the sales page, collection photography in the shop */
.print-collections{display:grid;gap:14px}
.print-tabs{display:flex;flex-wrap:wrap;gap:8px}
.print-tabs button{min-height:44px;padding:10px 18px;border:1px solid #c9b3ab;border-radius:999px;background:transparent;color:#4b3438;font:500 14px/1.2 'DM Sans',sans-serif;cursor:pointer}
.print-tabs button[aria-selected=true]{background:#652a40;border-color:#652a40;color:#fff8f3}
.print-tabs button:focus-visible{outline:2px solid #652a40;outline-offset:2px}
.print-panel{margin:0}
.print-panel img{display:block;width:100%;height:auto;aspect-ratio:2752/1536;object-fit:cover;border-radius:6px;background:#efe4dc}
.print-panel figcaption{font-size:14px;line-height:1.6;color:#593f42;padding-top:12px}
.collection-hero{display:grid;grid-template-columns:2.4fr 1fr;gap:14px;margin:0 0 34px}
.collection-hero img{display:block;width:100%;height:100%;max-height:440px;object-fit:cover;border-radius:6px;background:#efe4dc}
.collection-hero figcaption{grid-column:1/-1;font-size:13px;color:#6b5a5a}
.product-grid.classic .mock-brand{font-family:'Cormorant Garamond',Georgia,serif;letter-spacing:.14em;text-transform:uppercase}
.product-grid.luxury .mock-brand{font-family:'Cormorant Garamond',Georgia,serif;letter-spacing:.24em;text-transform:uppercase}
.product-grid.modern .mock-brand{font-family:'Manrope',Arial,sans-serif;font-weight:800;letter-spacing:-.02em}
@media(max-width:700px){.collection-hero{grid-template-columns:1fr}.collection-hero img:nth-of-type(2){display:none}}
body .artwork-page .landing-extras .print-collections{grid-column:2;grid-row:1/3;display:flex;flex-direction:column;gap:14px;min-width:0}
body .artwork-page .landing-extras .print-collections figure{grid-column:auto;grid-row:auto}
@media(max-width:700px){body .artwork-page .landing-extras .print-collections{grid-column:1;grid-row:2}}