/* =========================================================
   Smart Start Website - layouts
   The body carries layout-<id>. "Fresh" is the base design in style.css;
   every other layout restyles the same pages here. Colours always come from
   the chosen palette, so any layout works with any palette.
   ========================================================= */

/* ---------- shared helpers ---------- */
[class*="layout-"]:not(.layout-fresh) .hero .sweep { margin-top: 0; }

/* =========================================================
   CLASSIC: serif headings, centred header, square-ish corners
   ========================================================= */
.layout-classic h1, .layout-classic h2 { font-weight: 600; letter-spacing: -0.01em; }
.layout-classic h3 { font-weight: 600; }
.layout-classic .btn { border-radius: 4px; }
.layout-classic .sweep { display: none; }
.layout-classic .hero, .layout-classic .page-hero { padding-bottom: clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid color-mix(in srgb, var(--c-ink) 14%, white); }
.layout-classic .hero__media::before { display: none; }
.layout-classic .hero__media img, .layout-classic .service-detail__media img, .layout-classic .service-detail--flip .service-detail__media img,
.layout-classic .about__media img, .layout-classic .news-card img, .layout-classic .post__image img, .layout-classic .gallery img { border-radius: 4px; }
.layout-classic .service-row img { border-radius: 4px; }
.layout-classic .section-head { grid-template-columns: 1fr; text-align: center; justify-items: center; }
.layout-classic .section h2 { text-align: center; }
.layout-classic .section .service-detail h2, .layout-classic .price-group h2, .layout-classic .pricing__aside h2,
.layout-classic .faq__aside h2, .layout-classic .contact-card h2, .layout-classic .about-facts h2, .layout-classic .post__body h2 { text-align: left; }
.layout-classic .promise { border-top: 3px solid var(--c-accent); padding-top: 1.2rem; }
.layout-classic .promise .sparkle { display: none; }
.layout-classic .step__num { border-radius: 4px; }
.layout-classic .pricing__aside, .layout-classic .contact-card, .layout-classic .faq__aside { border-radius: 6px; }
.layout-classic .chips li { border-radius: 4px; }
.layout-classic .site-footer { background: var(--c-mist); color: var(--c-ink); }
.layout-classic .site-footer a, .layout-classic .site-footer__heading, .layout-classic .brand--footer, .layout-classic .hours--footer dt { color: var(--c-ink); }
.layout-classic .site-footer a:hover { color: var(--c-primary); }
.layout-classic .site-footer__base { border-top-color: color-mix(in srgb, var(--c-ink) 14%, white); }
@media (min-width: 1181px) {
  .layout-classic .site-header__inner { flex-direction: column; gap: 0.4rem; padding: 0.9rem 0 0.4rem; }
  .layout-classic .site-nav { margin-left: 0; }
}

/* =========================================================
   BOLD: heavy type, dark opening section, square edges
   ========================================================= */
.layout-bold h1 { font-weight: 800; font-size: clamp(2.6rem, 6.5vw, 4.8rem); letter-spacing: -0.035em; line-height: 1; }
.layout-bold h2 { font-weight: 800; letter-spacing: -0.03em; }
.layout-bold h3 { font-weight: 700; }
.layout-bold .btn { border-radius: 0; font-weight: 700; }
.layout-bold .sweep { display: none; }
.layout-bold .hero, .layout-bold .page-hero { background: var(--c-ink); color: #fff; padding-bottom: clamp(3rem, 6vw, 5rem); }
.layout-bold .hero h1, .layout-bold .page-hero h1 { color: #fff; }
.layout-bold .hero__lead, .layout-bold .page-hero__lead, .layout-bold .hero__area, .layout-bold .post__date { color: rgba(255,255,255,.85); }
.layout-bold .post__back a { color: var(--c-highlight); }
.layout-bold .hero .btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.6); }
.layout-bold .hero .btn--ghost:hover { border-color: #fff; color: #fff; }
.layout-bold .hero .btn--primary { background: var(--c-highlight); color: var(--c-ink); }
.layout-bold .hero .btn--primary:hover { background: #fff; color: var(--c-ink); }
.layout-bold .page-hero .jump a { background: rgba(255,255,255,.12); color: #fff; }
.layout-bold .hero__media::before { display: none; }
.layout-bold .hero__media img, .layout-bold .service-detail__media img, .layout-bold .service-detail--flip .service-detail__media img,
.layout-bold .about__media img, .layout-bold .news-card img, .layout-bold .post__image img, .layout-bold .gallery img, .layout-bold .service-row img { border-radius: 0; }
.layout-bold .service-rows, .layout-bold .service-row { border-color: var(--c-ink); border-width: 2px; }
.layout-bold .service-row__name { font-weight: 700; }
.layout-bold .service-row__more { border-radius: 0; border-color: var(--c-ink); color: var(--c-ink); }
.layout-bold .step__num { border-radius: 0; background: var(--c-ink); }
.layout-bold .chips li, .layout-bold .pricing__aside, .layout-bold .contact-card, .layout-bold .faq__aside { border-radius: 0; }
.layout-bold .cta-band { background: var(--c-highlight); color: var(--c-ink); }
.layout-bold .cta-band::after { display: none; }
.layout-bold .cta-band h2, .layout-bold .cta-band__phone { color: var(--c-ink); }
.layout-bold .cta-band .btn--light { background: var(--c-ink); color: #fff; }
.layout-bold .cta-band .btn--light:hover { background: var(--c-primary-dark); color: #fff; }

/* =========================================================
   SOFT: very rounded, floating menu bar, content on white cards
   ========================================================= */
.layout-soft { background: var(--c-mist); }
.layout-soft h1, .layout-soft h2 { font-weight: 800; letter-spacing: -0.02em; }
.layout-soft .site-header { background: transparent; border: 0; backdrop-filter: none; padding-top: 0.8rem; }
.layout-soft .site-header__inner { background: rgba(255,255,255,.96); border-radius: 999px; padding: 0 0.6rem 0 1rem; box-shadow: 0 10px 30px -18px rgba(13,42,74,.35); min-height: 68px; }
.layout-soft .sweep { display: none; }
.layout-soft .hero, .layout-soft .page-hero { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.layout-soft .hero__media::before { background: #fff; }
.layout-soft .hero__media img { border-radius: 40px; }
.layout-soft .section { background: transparent; }
.layout-soft .section--mist { background: #fff; border-radius: 40px; width: min(1240px, 100% - 1.5rem); margin-inline: auto; }
.layout-soft .service-rows { border: 0; display: grid; gap: 0.8rem; }
.layout-soft .service-row { background: #fff; border: 0; border-radius: 28px; padding: 1rem 1.4rem 1rem 1rem; box-shadow: 0 8px 24px -18px rgba(13,42,74,.4); }
.layout-soft .service-row img { border-radius: 20px; }
.layout-soft .service-detail { background: #fff; border-radius: 40px; width: min(1240px, 100% - 1.5rem); margin: 0 auto 1.25rem; }
.layout-soft .service-detail + .service-detail { border-top: 0; }
.layout-soft .service-detail__media img, .layout-soft .service-detail--flip .service-detail__media img, .layout-soft .about__media img { border-radius: 32px; }
.layout-soft .pricing__groups, .layout-soft .faq__list, .layout-soft .quote-form { background: #fff; border-radius: 32px; padding: clamp(1.25rem, 3vw, 2.25rem); border: 0; }
.layout-soft .pricing__aside, .layout-soft .contact-card, .layout-soft .faq__aside { background: #fff; border-radius: 32px; }
.layout-soft .news-card a { background: #fff; border-radius: 28px; padding: 0.8rem 0.8rem 1.2rem; }
.layout-soft .news-card__body { padding: 0 0.5rem; }
.layout-soft .news-card img, .layout-soft .gallery img, .layout-soft .post__image img { border-radius: 22px; }
.layout-soft .post__body { background: #fff; border-radius: 28px; padding: clamp(1.25rem, 3vw, 2rem); }
.layout-soft .cta-band { width: min(1240px, 100% - 1.5rem); margin: 0 auto clamp(2rem, 4vw, 3rem); border-radius: 40px; }
.layout-soft .site-footer { border-radius: 40px 40px 0 0; }
.layout-soft input[type=text], .layout-soft input[type=email], .layout-soft input[type=tel], .layout-soft input[type=date], .layout-soft select, .layout-soft textarea { border-radius: 16px; }
@media (max-width: 1180px) { .layout-soft .site-nav { border-radius: 24px; margin-top: 0.5rem; } }

/* =========================================================
   MINIMAL: white space, hairlines, no decoration
   ========================================================= */
.layout-minimal h1 { font-weight: 500; letter-spacing: -0.04em; }
.layout-minimal h2 { font-weight: 500; letter-spacing: -0.03em; }
.layout-minimal h3 { font-weight: 500; }
.layout-minimal .btn { border-radius: 2px; font-weight: 500; }
.layout-minimal .sweep, .layout-minimal .sparkle { display: none; }
.layout-minimal .checklist li { padding-left: 1rem; position: relative; }
.layout-minimal .checklist li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 6px; height: 1px; background: var(--c-ink); }
.layout-minimal .site-header { border-bottom-color: color-mix(in srgb, var(--c-ink) 10%, white); }
.layout-minimal .site-nav ul a[aria-current="page"] { box-shadow: inset 0 -1px 0 var(--c-ink); color: var(--c-ink); }
.layout-minimal .hero, .layout-minimal .page-hero { padding-bottom: clamp(3rem, 6vw, 5rem); }
.layout-minimal .hero__media::before { display: none; }
.layout-minimal .hero__media img, .layout-minimal .service-detail__media img, .layout-minimal .service-detail--flip .service-detail__media img,
.layout-minimal .about__media img, .layout-minimal .news-card img, .layout-minimal .post__image img, .layout-minimal .gallery img, .layout-minimal .service-row img { border-radius: 0; }
.layout-minimal .section--mist { background: #fff; border-top: 1px solid color-mix(in srgb, var(--c-ink) 10%, white); border-bottom: 1px solid color-mix(in srgb, var(--c-ink) 10%, white); }
.layout-minimal .service-row__more { border: 0; padding: 0; }
.layout-minimal .service-row:hover .service-row__more { background: none; color: var(--c-primary); text-decoration: underline; }
.layout-minimal .step__num { background: #fff; color: var(--c-ink); border: 1px solid var(--c-ink); width: 44px; height: 44px; font-size: 1rem; }
.layout-minimal .step:not(:last-child)::after { background: color-mix(in srgb, var(--c-ink) 20%, white); height: 1px; top: 22px; left: 48px; }
.layout-minimal .chips li { background: none; border: 1px solid color-mix(in srgb, var(--c-ink) 20%, white); border-radius: 2px; }
.layout-minimal .pricing__aside, .layout-minimal .contact-card, .layout-minimal .faq__aside { background: #fff; border: 1px solid color-mix(in srgb, var(--c-ink) 12%, white); border-radius: 0; }
.layout-minimal .price-group h2 { border-bottom: 1px solid var(--c-ink); }
.layout-minimal .faq-item__icon { background: none; }
.layout-minimal .cta-band { background: #fff; color: var(--c-ink); border-top: 1px solid color-mix(in srgb, var(--c-ink) 10%, white); }
.layout-minimal .cta-band::after { display: none; }
.layout-minimal .cta-band h2, .layout-minimal .cta-band__phone { color: var(--c-ink); }
.layout-minimal .cta-band .btn--light { background: var(--c-primary); color: #fff; }
.layout-minimal .site-footer { background: #fff; color: color-mix(in srgb, var(--c-ink) 75%, white); border-top: 1px solid color-mix(in srgb, var(--c-ink) 10%, white); }
.layout-minimal .site-footer a, .layout-minimal .site-footer__heading, .layout-minimal .brand--footer, .layout-minimal .hours--footer dt { color: var(--c-ink); }
.layout-minimal .site-footer__base { border-top-color: color-mix(in srgb, var(--c-ink) 10%, white); }

/* =========================================================
   MODERN: angled opening section, numbered services
   ========================================================= */
.layout-modern h1 { font-weight: 700; letter-spacing: -0.045em; }
.layout-modern h2 { font-weight: 600; letter-spacing: -0.035em; }
.layout-modern .btn { border-radius: 10px; }
.layout-modern .sweep { display: none; }
.layout-modern .hero, .layout-modern .page-hero { background: var(--c-mist); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5vw), 0 100%); padding-bottom: calc(clamp(2.5rem, 5vw, 4rem) + 5vw); }
.layout-modern .hero__media::before { display: none; }
.layout-modern .hero__media img { border-radius: 16px; box-shadow: 18px 18px 0 var(--c-accent); }
.layout-modern .service-detail__media img, .layout-modern .service-detail--flip .service-detail__media img, .layout-modern .about__media img,
.layout-modern .news-card img, .layout-modern .post__image img, .layout-modern .gallery img, .layout-modern .service-row img { border-radius: 12px; }
.layout-modern .section h2::before { content: ""; display: block; width: 44px; height: 4px; background: var(--c-accent); border-radius: 4px; margin-bottom: 0.9rem; }
.layout-modern .faq-item__q::before, .layout-modern .price-group h2::before, .layout-modern .post__body h2::before, .layout-modern .contact-card h2::before { display: none; }
.layout-modern .service-rows { counter-reset: svc; }
.layout-modern .service-row { grid-template-columns: 3rem 140px 1fr auto; counter-increment: svc; }
.layout-modern .service-row::before { content: counter(svc, decimal-leading-zero); font-family: var(--font-heading); font-weight: 600; font-size: 1.3rem; color: var(--c-primary); }
.layout-modern .service-row img { width: 140px; }
.layout-modern .service-row__more { border-radius: 10px; }
.layout-modern .step__num { border-radius: 12px; }
.layout-modern .chips li { border-radius: 8px; }
.layout-modern .pricing__aside, .layout-modern .contact-card, .layout-modern .faq__aside { border-radius: 16px; }
.layout-modern .cta-band { clip-path: polygon(0 3vw, 100% 0, 100% 100%, 0 100%); padding-top: calc(clamp(3rem, 6vw, 4.5rem) + 3vw); }
@media (max-width: 640px) {
  .layout-modern .service-row { grid-template-columns: 2.2rem 80px 1fr; }
  .layout-modern .service-row img { width: 80px; }
}

/* =========================================================
   ELEGANT: centred, wide feature photo, fine rules
   ========================================================= */
.layout-elegant h1 { font-weight: 500; letter-spacing: -0.01em; }
.layout-elegant h2 { font-weight: 500; letter-spacing: 0; }
.layout-elegant h3 { font-weight: 600; }
.layout-elegant .btn { border-radius: 0; letter-spacing: 0.05em; font-size: 0.92rem; padding: 0.95rem 1.7rem; }
.layout-elegant .sweep { display: none; }
.layout-elegant .hero__grid { grid-template-columns: 1fr; text-align: center; justify-items: center; }
.layout-elegant .hero__text { max-width: 760px; }
.layout-elegant .hero h1 { max-width: none; }
.layout-elegant .hero__lead, .layout-elegant .hero__area { margin-inline: auto; }
.layout-elegant .hero__actions { justify-content: center; }
.layout-elegant .hero__media { order: 2; width: 100%; }
.layout-elegant .hero__media::before { display: none; }
.layout-elegant .hero__media:not(.mask) img { aspect-ratio: 21 / 9; border-radius: 0; }
.layout-elegant .hero { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.layout-elegant .page-hero { text-align: center; padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.layout-elegant .page-hero h1, .layout-elegant .page-hero__lead { margin-inline: auto; }
.layout-elegant .page-hero::after, .layout-elegant .hero::after { content: ""; display: block; width: 80px; height: 1px; background: var(--c-ink); margin: clamp(2rem, 4vw, 3rem) auto 0; }
.layout-elegant .jump ul, .layout-elegant .post__back { justify-content: center; }
.layout-elegant .post__date { text-align: center; }
.layout-elegant .service-detail__media img, .layout-elegant .service-detail--flip .service-detail__media img, .layout-elegant .about__media img,
.layout-elegant .news-card img, .layout-elegant .post__image img, .layout-elegant .gallery img, .layout-elegant .service-row img { border-radius: 0; }
.layout-elegant .section-head { grid-template-columns: 1fr; text-align: center; justify-items: center; }
.layout-elegant .section > .wrap > h2 { text-align: center; }
.layout-elegant .promises { text-align: center; }
.layout-elegant .promise .sparkle { margin-inline: auto; }
.layout-elegant .step__num { background: #fff; color: var(--c-ink); border: 1px solid var(--c-ink); }
.layout-elegant .step:not(:last-child)::after { background: color-mix(in srgb, var(--c-ink) 30%, white); height: 1px; }
.layout-elegant .chips li, .layout-elegant .pricing__aside, .layout-elegant .contact-card, .layout-elegant .faq__aside { border-radius: 0; }
.layout-elegant .area { justify-content: center; }

/* =========================================================
   FRIENDLY: chunky buttons, tilted framed photos
   ========================================================= */
.layout-friendly h1, .layout-friendly h2 { font-weight: 800; letter-spacing: -0.01em; line-height: 1.05; }
.layout-friendly h3 { font-weight: 700; }
.layout-friendly .btn { border-radius: 16px; font-weight: 700; box-shadow: 0 5px 0 var(--c-primary-dark); transform: translateY(-2px); }
.layout-friendly .btn:active { box-shadow: 0 2px 0 var(--c-primary-dark); transform: translateY(1px); }
.layout-friendly .btn--ghost { box-shadow: 0 5px 0 color-mix(in srgb, var(--c-primary) 35%, white); }
.layout-friendly .btn--light { box-shadow: 0 5px 0 rgba(0,0,0,.25); }
.layout-friendly .sweep__line { stroke-width: 8px; }
.layout-friendly .hero__media::before { background: color-mix(in srgb, var(--c-highlight) 45%, white); }
.layout-friendly .hero__media:not(.mask) img { border-radius: 28px; border: 10px solid #fff; box-shadow: 0 20px 40px -24px rgba(13,42,74,.5); transform: rotate(-2.5deg); }
.layout-friendly .about__media:not(.mask) img { border-radius: 28px; border: 10px solid #fff; box-shadow: 0 20px 40px -24px rgba(13,42,74,.5); transform: rotate(2deg); }
.layout-friendly .service-detail__media:not(.mask) img { border-radius: 28px; }
.layout-friendly .news-card img, .layout-friendly .post__image img, .layout-friendly .gallery img, .layout-friendly .service-row img { border-radius: 22px; }
.layout-friendly .gallery li:nth-child(odd) img { transform: rotate(-1.5deg); }
.layout-friendly .gallery li:nth-child(even) img { transform: rotate(1.5deg); }
.layout-friendly .step__num { width: 64px; height: 64px; font-size: 1.6rem; background: var(--c-accent); color: var(--c-ink); }
.layout-friendly .step:not(:last-child)::after { top: 31px; left: 64px; height: 4px; }
.layout-friendly .promise .sparkle { width: 40px; height: 40px; }
.layout-friendly .chips li { background: color-mix(in srgb, var(--c-highlight) 40%, white); font-weight: 700; }
.layout-friendly .pricing__aside, .layout-friendly .contact-card, .layout-friendly .faq__aside { border-radius: 28px; }
@media (prefers-reduced-motion: reduce) { .layout-friendly .btn { transform: none; } }

/* =========================================================
   CORPORATE: solid menu bar, boxed content, crisp lines
   ========================================================= */
.layout-corporate h1, .layout-corporate h2 { font-weight: 800; letter-spacing: -0.025em; }
.layout-corporate h3 { font-weight: 700; }
.layout-corporate .btn { border-radius: 6px; font-weight: 600; }
.layout-corporate .site-header { background: var(--c-primary-dark); border-bottom: 0; backdrop-filter: none; }
.layout-corporate .site-header .brand, .layout-corporate .site-nav ul a, .layout-corporate .site-nav__phone { color: #fff; }
.layout-corporate .site-header .brand img { background: #fff; border-radius: 10px; padding: 3px; }
.layout-corporate .site-nav ul a:hover { background: rgba(255,255,255,.12); color: #fff; }
.layout-corporate .site-nav ul a[aria-current="page"] { color: #fff; box-shadow: inset 0 -3px 0 var(--c-highlight); }
.layout-corporate .site-header .btn--primary { background: #fff; color: var(--c-primary-dark); }
.layout-corporate .site-header .btn--primary:hover { background: var(--c-highlight); color: var(--c-ink); }
.layout-corporate .nav-toggle { background: rgba(255,255,255,.14); }
.layout-corporate .nav-toggle__bars, .layout-corporate .nav-toggle__bars::before, .layout-corporate .nav-toggle__bars::after { background: #fff; }
@media (max-width: 1180px) {
  .layout-corporate .site-nav { background: var(--c-primary-dark); }
  .layout-corporate .nav-toggle[aria-expanded="true"] .nav-toggle__bars { background: transparent; }
}
.layout-corporate .sweep { display: none; }
.layout-corporate .hero, .layout-corporate .page-hero { background: var(--c-mist); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.layout-corporate .hero__media::before { display: none; }
.layout-corporate .hero__media img, .layout-corporate .service-detail__media img, .layout-corporate .service-detail--flip .service-detail__media img,
.layout-corporate .about__media img, .layout-corporate .news-card img, .layout-corporate .post__image img, .layout-corporate .gallery img, .layout-corporate .service-row img { border-radius: 8px; }
.layout-corporate .service-rows { border: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 1rem; }
.layout-corporate .service-row { grid-template-columns: 110px 1fr; border: 1px solid color-mix(in srgb, var(--c-ink) 14%, white); border-radius: 10px; padding: 1rem; }
.layout-corporate .service-row img { width: 110px; }
.layout-corporate .service-row__more { display: none; }
.layout-corporate .service-row__name { font-size: 1.15rem; font-weight: 700; }
.layout-corporate .promise { background: #fff; border: 1px solid color-mix(in srgb, var(--c-ink) 12%, white); border-radius: 10px; padding: 1.4rem; }
.layout-corporate .promises { gap: 1rem; }
.layout-corporate .step__num { border-radius: 8px; }
.layout-corporate .chips li, .layout-corporate .pricing__aside, .layout-corporate .contact-card, .layout-corporate .faq__aside { border-radius: 8px; }
.layout-corporate .cta-band { background: var(--c-ink); }
.layout-corporate .cta-band::after { display: none; }

/* =========================================================
   COASTAL: photo behind the opening headline, soft serif
   ========================================================= */
.layout-coastal h1 { font-weight: 600; letter-spacing: -0.02em; }
.layout-coastal h2 { font-weight: 600; letter-spacing: -0.015em; }
.layout-coastal .btn { border-radius: 999px; }
.layout-coastal .hero { position: relative; padding-top: 0; isolation: isolate; }
.layout-coastal .hero__grid { grid-template-columns: 1fr; min-height: clamp(520px, 72vh, 720px); align-items: center; padding-block: clamp(3rem, 7vw, 6rem) clamp(4rem, 8vw, 7rem); }
.layout-coastal .hero__media { position: absolute; inset: 0; z-index: -1; max-width: none !important; margin: 0; }
.layout-coastal .hero__media::before { display: none; }
.layout-coastal .hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--c-ink) 92%, transparent) 0%, color-mix(in srgb, var(--c-ink) 78%, transparent) 50%, color-mix(in srgb, var(--c-ink) 35%, transparent) 100%); }
.layout-coastal .hero__media img { width: 100%; height: 100%; aspect-ratio: auto !important; object-fit: cover; border-radius: 0 !important; }
.layout-coastal .hero__text { max-width: 640px; }
.layout-coastal .hero h1, .layout-coastal .hero__lead, .layout-coastal .hero__area { color: #fff; }
.layout-coastal .hero__area { opacity: .85; }
.layout-coastal .hero .btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.layout-coastal .hero .btn--ghost:hover { color: #fff; border-color: #fff; }
.layout-coastal .hero .sweep { position: absolute; bottom: -1px; left: 0; margin: 0; }
.layout-coastal .hero .sweep__body { fill: #fff; }
.layout-coastal .hero .sweep__line { stroke: rgba(255,255,255,.75); }
.layout-coastal .page-hero { background: var(--c-mist); }
.layout-coastal .service-detail__media img, .layout-coastal .service-detail--flip .service-detail__media img, .layout-coastal .about__media img { border-radius: 24px; }
.layout-coastal .news-card img, .layout-coastal .post__image img, .layout-coastal .gallery img, .layout-coastal .service-row img { border-radius: 18px; }
@media (max-width: 960px) { .layout-coastal .hero__media { order: 0; max-width: none; } }


/* =========================================================
   VISUAL LAYOUTS (Wave, Boutique, Studio, Heritage, Sunrise,
   Editorial, Pebble, Botanical, Geometric, Luxe)
   Shared shape dividers: each coloured block gets a shape cut into its
   top edge in the colour of the block above it, so sections flow into
   each other. Each layout picks its shape with --div and its height with --div-h.
   ========================================================= */
:root {
  --shape-wave: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V60C1000 120 800 0 600 60C400 120 200 0 0 60Z'/%3E%3C/svg%3E");
  --shape-waves: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V50C1050 110 900 110 750 60C600 10 450 10 300 60C150 110 50 90 0 70Z'/%3E%3C/svg%3E");
  --shape-curve: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V0C900 120 300 120 0 0Z'/%3E%3C/svg%3E");
  --shape-arch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V120C900 0 300 0 0 120Z'/%3E%3C/svg%3E");
  --shape-tilt: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200L0 120Z'/%3E%3C/svg%3E");
  --shape-peak: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V120L600 10L0 120Z'/%3E%3C/svg%3E");
  --shape-hills: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V80C1100 40 1000 40 900 80C800 120 700 30 550 70C400 110 300 40 150 80C80 100 30 90 0 80Z'/%3E%3C/svg%3E");
  --shape-zigzag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V40L1140 70L1080 40L1020 70L960 40L900 70L840 40L780 70L720 40L660 70L600 40L540 70L480 40L420 70L360 40L300 70L240 40L180 70L120 40L60 70L0 40Z'/%3E%3C/svg%3E");
  --shape-clouds: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1200V90A50 50 0 0 0 1100 90A50 50 0 0 0 1000 90A50 50 0 0 0 900 90A50 50 0 0 0 800 90A50 50 0 0 0 700 90A50 50 0 0 0 600 90A50 50 0 0 0 500 90A50 50 0 0 0 400 90A50 50 0 0 0 300 90A50 50 0 0 0 200 90A50 50 0 0 0 100 90A50 50 0 0 0 0 90Z'/%3E%3C/svg%3E");
}

:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) { --div-h: clamp(36px, 6vw, 90px); --mist-bg: var(--c-mist); --hero-bg: var(--c-mist); }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .sweep { display: none; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .hero, :is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .page-hero { position: relative; background: var(--hero-bg); padding-bottom: calc(clamp(2.5rem, 5vw, 4rem) + var(--div-h)); isolation: isolate; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .hero::after, :is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .page-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: var(--div-h); background: #fff; z-index: 1;
  -webkit-mask: var(--div) 0 0 / 100% 100% no-repeat; mask: var(--div) 0 0 / 100% 100% no-repeat; transform: scaleY(-1); pointer-events: none;
}
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .section--mist { position: relative; background: var(--mist-bg); padding-top: calc(clamp(3.5rem, 7vw, 6rem) + var(--div-h)); }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .section--mist::before, :is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .cta-band::before {
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: var(--div-h); background: #fff; z-index: 1;
  -webkit-mask: var(--div) 0 0 / 100% 100% no-repeat; mask: var(--div) 0 0 / 100% 100% no-repeat; pointer-events: none;
}
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .section--mist + .cta-band::before { background: var(--mist-bg); }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .cta-band { padding-top: calc(clamp(3rem, 6vw, 4.5rem) + var(--div-h)); }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .hero__media::before { display: none; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .hero .wrap, :is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .page-hero .wrap { position: relative; z-index: 2; }

/* ---------------- WAVE ---------------- */
.layout-wave { --div: var(--shape-wave); }
.layout-wave h1, .layout-wave h2 { font-weight: 600; letter-spacing: -0.025em; }
.layout-wave .hero, .layout-wave .page-hero {
  background:
    radial-gradient(circle at 85% 20%, color-mix(in srgb, var(--c-secondary) 28%, transparent) 0, transparent 38%),
    radial-gradient(circle at 10% 90%, color-mix(in srgb, var(--c-accent) 26%, transparent) 0, transparent 40%),
    var(--c-mist);
}
.layout-wave .hero__media:not(.mask) img { border-radius: 32px; box-shadow: 0 30px 60px -30px color-mix(in srgb, var(--c-primary) 60%, transparent); }
.layout-wave .service-row img, .layout-wave .service-detail__media:not(.mask) img, .layout-wave .about__media:not(.mask) img,
.layout-wave .news-card img, .layout-wave .post__image img, .layout-wave .gallery img { border-radius: 24px; }
.layout-wave .step__num { box-shadow: 0 0 0 6px color-mix(in srgb, var(--c-secondary) 25%, white); }
.layout-wave .promise .sparkle { width: 42px; height: 42px; padding: 0; filter: drop-shadow(0 6px 10px color-mix(in srgb, var(--c-primary) 35%, transparent)); }
.layout-wave .chips li { background: #fff; box-shadow: 0 6px 16px -10px rgba(13,42,74,.4); }

/* ---------------- BOUTIQUE (serif) ---------------- */
.layout-boutique { --div: var(--shape-curve); --div-h: clamp(30px, 5vw, 70px); }
.layout-boutique h1 { font-weight: 600; font-size: clamp(2.6rem, 6vw, 4.6rem); letter-spacing: -0.01em; line-height: 1.02; }
.layout-boutique h2 { font-weight: 600; letter-spacing: 0; font-size: clamp(2rem, 4vw, 2.9rem); }
.layout-boutique h3 { font-family: var(--font-heading); font-weight: 700; font-size: 1.4rem; }
.layout-boutique .btn { border-radius: 0; letter-spacing: 0.08em; font-size: 0.85rem; text-transform: uppercase; padding: 0.95rem 1.8rem; }
.layout-boutique .hero__media:not(.mask) img, .layout-boutique .about__media:not(.mask) img { border-radius: 999px 999px 8px 8px; aspect-ratio: 4 / 5; }
.layout-boutique .hero__media:not(.mask) { max-width: 460px; justify-self: center; position: relative; }
.layout-boutique .hero__media:not(.mask)::after { content: ""; position: absolute; inset: -14px; border: 1px solid var(--c-accent); border-radius: 999px 999px 12px 12px; z-index: -1; }
.layout-boutique .service-detail__media:not(.mask) img, .layout-boutique .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 999px 999px 8px 8px; aspect-ratio: 4 / 5; max-width: 440px; margin-inline: auto; }
.layout-boutique .section h2::after, .layout-boutique .page-hero h1::after { content: ""; display: block; width: 56px; height: 2px; background: var(--c-accent); margin-top: 0.9rem; }
.layout-boutique .faq-item__q::after, .layout-boutique .price-group h2::after, .layout-boutique .contact-card h2::after, .layout-boutique .post__body h2::after { display: none; }
.layout-boutique .service-row img, .layout-boutique .news-card img, .layout-boutique .gallery img, .layout-boutique .post__image img { border-radius: 4px; }
.layout-boutique .step__num { background: #fff; color: var(--c-primary); border: 1px solid var(--c-accent); font-family: var(--font-heading); }
.layout-boutique .chips li { background: none; border: 1px solid color-mix(in srgb, var(--c-accent) 60%, white); border-radius: 0; }

/* ---------------- STUDIO ---------------- */
.layout-studio { --div: var(--shape-zigzag); --div-h: clamp(22px, 3vw, 36px); }
.layout-studio h1 { font-weight: 800; letter-spacing: -0.04em; }
.layout-studio h2 { font-weight: 700; letter-spacing: -0.03em; }
.layout-studio .btn { border-radius: 8px; box-shadow: 4px 4px 0 var(--c-ink); font-weight: 700; }
.layout-studio .btn:hover { transform: translate(-1px, -1px); box-shadow: 5px 5px 0 var(--c-ink); }
.layout-studio .hero::before { content: ""; position: absolute; width: clamp(180px, 26vw, 360px); aspect-ratio: 1; border-radius: 50%; background: color-mix(in srgb, var(--c-highlight) 55%, transparent); right: -4%; top: -8%; z-index: 0; }
.layout-studio .hero__text::before { content: ""; display: block; width: 46px; height: 46px; background: var(--c-accent); transform: rotate(18deg); border-radius: 6px; margin-bottom: 1.4rem; }
.layout-studio .hero__media:not(.mask) img, .layout-studio .service-detail__media:not(.mask) img, .layout-studio .service-detail--flip .service-detail__media:not(.mask) img, .layout-studio .about__media:not(.mask) img { border-radius: 14px; box-shadow: 16px 16px 0 var(--c-primary); }
.layout-studio .section--mist { background-image: radial-gradient(color-mix(in srgb, var(--c-primary) 22%, transparent) 1.6px, transparent 1.8px); background-size: 22px 22px; }
.layout-studio .service-row img, .layout-studio .news-card img, .layout-studio .gallery img, .layout-studio .post__image img { border-radius: 12px; }
.layout-studio .service-row__name::before { content: ""; display: inline-block; width: 12px; height: 12px; background: var(--c-accent); transform: rotate(45deg); margin-right: 0.7rem; vertical-align: 0.1em; }
.layout-studio .step__num { border-radius: 12px; transform: rotate(-6deg); }
.layout-studio .promise { background: #fff; border: 2px solid var(--c-ink); border-radius: 14px; padding: 1.3rem; box-shadow: 6px 6px 0 var(--c-accent); }
.layout-studio .cta-band::after { border-top-style: dashed; }

/* ---------------- HERITAGE (serif) ---------------- */
.layout-heritage { --div: var(--shape-arch); --div-h: clamp(28px, 4vw, 60px); }
.layout-heritage h1, .layout-heritage h2 { font-weight: 700; letter-spacing: -0.01em; }
.layout-heritage h1 { font-size: clamp(2.2rem, 4.8vw, 3.5rem); line-height: 1.15; }
.layout-heritage .btn { border-radius: 3px; }
.layout-heritage .hero, .layout-heritage .page-hero { background-image: radial-gradient(color-mix(in srgb, var(--c-ink) 9%, transparent) 1px, transparent 1.2px); background-size: 14px 14px; background-color: var(--c-mist); }
.layout-heritage .hero__media:not(.mask) img, .layout-heritage .about__media:not(.mask) img,
.layout-heritage .service-detail__media:not(.mask) img, .layout-heritage .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 2px; border: 10px solid #fff; outline: 1px solid color-mix(in srgb, var(--c-ink) 25%, white); outline-offset: 6px; box-shadow: 0 18px 40px -26px rgba(0,0,0,.45); }
.layout-heritage .section h2, .layout-heritage .section-head { text-align: center; justify-items: center; }
.layout-heritage .section-head { grid-template-columns: 1fr; }
.layout-heritage .section > .wrap > h2::after, .layout-heritage .section-head h2::after {
  content: "\25C6"; display: block; font-size: 0.7rem; color: var(--c-accent); letter-spacing: 0; margin-top: 0.8rem;
  background: linear-gradient(var(--c-accent), var(--c-accent)) left 50% / 38% 1px no-repeat, linear-gradient(var(--c-accent), var(--c-accent)) right 50% / 38% 1px no-repeat;
  width: 180px; margin-inline: auto; text-align: center;
}
.layout-heritage .service-detail h2, .layout-heritage .price-group h2, .layout-heritage .post__body h2 { text-align: left; }
.layout-heritage .promises { text-align: center; }
.layout-heritage .promise .sparkle { margin-inline: auto; }
.layout-heritage .step__num { border-radius: 50%; background: #fff; color: var(--c-ink); border: 2px solid var(--c-ink); font-family: var(--font-heading); }
.layout-heritage .service-row img, .layout-heritage .news-card img, .layout-heritage .gallery img, .layout-heritage .post__image img { border-radius: 2px; }
.layout-heritage .chips li { border-radius: 3px; }
.layout-heritage .area { justify-content: center; }

/* ---------------- SUNRISE ---------------- */
.layout-sunrise { --div: var(--shape-waves); --hero-bg: linear-gradient(135deg, var(--c-primary-dark), var(--c-primary) 55%, color-mix(in srgb, var(--c-primary) 55%, var(--c-secondary))); }
.layout-sunrise h1, .layout-sunrise h2 { font-weight: 800; letter-spacing: -0.03em; }
.layout-sunrise .hero h1, .layout-sunrise .page-hero h1, .layout-sunrise .hero__lead, .layout-sunrise .page-hero__lead, .layout-sunrise .hero__area, .layout-sunrise .post__date { color: #fff; }
.layout-sunrise .hero__area, .layout-sunrise .post__date { opacity: .85; }
.layout-sunrise .post__back a { color: #fff; }
.layout-sunrise .page-hero .jump a { background: rgba(255,255,255,.16); color: #fff; }
.layout-sunrise .hero .btn--primary { background: #fff; color: var(--c-primary-dark); }
.layout-sunrise .hero .btn--primary:hover { background: var(--c-highlight); color: var(--c-ink); }
.layout-sunrise .hero .btn--ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.65); }
.layout-sunrise .hero::before { content: ""; position: absolute; width: 520px; aspect-ratio: 1; border-radius: 50%; right: -120px; top: -160px; background: radial-gradient(circle, rgba(255,255,255,.22), transparent 65%); }
.layout-sunrise .hero__media:not(.mask) img { border-radius: 26px; box-shadow: 0 30px 60px -20px rgba(0,0,0,.45); }
.layout-sunrise .service-rows { border: 0; display: grid; gap: 1rem; }
.layout-sunrise .service-row { background: #fff; border: 0; border-radius: 22px; padding: 1rem 1.3rem 1rem 1rem; box-shadow: 0 16px 40px -26px rgba(13,42,74,.5); }
.layout-sunrise .service-row img, .layout-sunrise .news-card img, .layout-sunrise .gallery img, .layout-sunrise .post__image img,
.layout-sunrise .service-detail__media:not(.mask) img, .layout-sunrise .about__media:not(.mask) img { border-radius: 20px; }
.layout-sunrise .promise { background: #fff; border-radius: 22px; padding: 1.4rem; box-shadow: 0 16px 40px -28px rgba(13,42,74,.55); }
.layout-sunrise .promise .sparkle { width: 46px; height: 46px; }
.layout-sunrise .cta-band { background: linear-gradient(135deg, var(--c-primary-dark), var(--c-primary)); }

/* ---------------- EDITORIAL (serif) ---------------- */
.layout-editorial { --div: var(--shape-tilt); --div-h: clamp(30px, 5vw, 80px); --hero-bg: #fff; }
.layout-editorial h1 { font-weight: 400; font-size: clamp(2.8rem, 7vw, 5.4rem); letter-spacing: -0.02em; line-height: 0.98; }
.layout-editorial h2 { font-weight: 400; font-size: clamp(2rem, 4.4vw, 3.2rem); letter-spacing: -0.01em; }
.layout-editorial h3 { font-weight: 700; }
.layout-editorial .btn { border-radius: 0; font-weight: 700; }
.layout-editorial .hero, .layout-editorial .page-hero { border-top: 6px solid var(--c-ink); }
.layout-editorial .hero__lead { font-size: 1.35rem; border-left: 4px solid var(--c-accent); padding-left: 1rem; }
.layout-editorial .hero__media:not(.mask) img, .layout-editorial .service-detail__media:not(.mask) img, .layout-editorial .service-detail--flip .service-detail__media:not(.mask) img,
.layout-editorial .about__media:not(.mask) img, .layout-editorial .news-card img, .layout-editorial .post__image img, .layout-editorial .gallery img, .layout-editorial .service-row img { border-radius: 0; }
.layout-editorial .hero__media:not(.mask) img { border-bottom: 8px solid var(--c-accent); }
.layout-editorial .section h2 { border-top: 3px solid var(--c-ink); padding-top: 0.8rem; }
.layout-editorial .section .faq-item__q, .layout-editorial .section .contact-card h2, .layout-editorial .section .price-group h2 { border-top: 0; padding-top: 0; }
.layout-editorial .steps { counter-reset: none; }
.layout-editorial .step__num { background: none; border: 0; color: transparent; -webkit-text-stroke: 2px var(--c-primary); font-family: var(--font-heading); font-size: 3.6rem; width: auto; height: auto; justify-content: start; margin-bottom: 0.3rem; }
.layout-editorial .step:not(:last-child)::after { display: none; }
.layout-editorial .about__body p:first-child::first-letter { font-family: var(--font-heading); float: left; font-size: 4.2rem; line-height: 0.85; margin: 0.35rem 0.6rem 0 0; color: var(--c-primary); }
.layout-editorial .chips li { border-radius: 0; background: none; border-bottom: 2px solid var(--c-accent); padding-inline: 0.3rem; }

/* ---------------- PEBBLE ---------------- */
.layout-pebble { --div: var(--shape-clouds); --div-h: clamp(28px, 4vw, 54px); }
.layout-pebble h1, .layout-pebble h2 { font-weight: 800; letter-spacing: -0.025em; }
.layout-pebble .btn { border-radius: 999px; }
.layout-pebble .hero::before { content: ""; position: absolute; width: clamp(260px, 36vw, 520px); aspect-ratio: 1; right: 4%; top: 6%; z-index: 0;
  background: color-mix(in srgb, var(--c-highlight) 45%, transparent); border-radius: 58% 42% 63% 37% / 45% 55% 45% 55%; }
.layout-pebble .hero__media:not(.mask) img { border-radius: 62% 38% 55% 45% / 50% 58% 42% 50%; aspect-ratio: 1; }
.layout-pebble .about__media:not(.mask) img { border-radius: 45% 55% 40% 60% / 55% 45% 55% 45%; aspect-ratio: 1; }
.layout-pebble .service-detail__media:not(.mask) img { border-radius: 40% 60% 52% 48% / 48% 42% 58% 52%; }
.layout-pebble .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 58% 42% 45% 55% / 52% 58% 42% 48%; }
.layout-pebble .service-row img { border-radius: 46% 54% 50% 50% / 52% 48% 52% 48%; aspect-ratio: 1; width: 110px; }
.layout-pebble .service-row { grid-template-columns: 110px 1fr auto; }
.layout-pebble .news-card img, .layout-pebble .post__image img { border-radius: 32px; }
.layout-pebble .gallery img { border-radius: 40% 60% 55% 45% / 50% 45% 55% 50%; }
.layout-pebble .step__num { border-radius: 48% 52% 45% 55% / 55% 45% 55% 45%; width: 60px; height: 60px; }
.layout-pebble .promise { background: #fff; border-radius: 32px; padding: 1.4rem; }
.layout-pebble .chips li { background: color-mix(in srgb, var(--c-highlight) 35%, white); }
@media (max-width: 640px) { .layout-pebble .service-row { grid-template-columns: 80px 1fr; } .layout-pebble .service-row img { width: 80px; } }

/* ---------------- BOTANICAL (serif) ---------------- */
.layout-botanical { --div: var(--shape-hills); --div-h: clamp(34px, 5vw, 80px); }
.layout-botanical h1, .layout-botanical h2 { font-weight: 400; letter-spacing: -0.01em; }
.layout-botanical h3 { font-weight: 600; }
.layout-botanical .btn { border-radius: 999px 999px 999px 4px; }
.layout-botanical .hero::before { content: ""; position: absolute; width: clamp(160px, 20vw, 280px); aspect-ratio: 1; left: -90px; bottom: 4%; z-index: 0;
  background: color-mix(in srgb, var(--c-accent) 22%, transparent); border-radius: 0 100% 0 100%; transform: rotate(-20deg); }
.layout-botanical .hero__media:not(.mask) img, .layout-botanical .about__media:not(.mask) img { border-radius: 220px 8px 220px 8px; }
.layout-botanical .service-detail__media:not(.mask) img { border-radius: 160px 8px 160px 8px; }
.layout-botanical .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 8px 160px 8px 160px; }
.layout-botanical .service-row img, .layout-botanical .news-card img, .layout-botanical .post__image img { border-radius: 60px 6px 60px 6px; }
.layout-botanical .gallery img { border-radius: 100px 8px 100px 8px; }
.layout-botanical .section h2::before { content: ""; display: inline-block; width: 0.55em; height: 0.55em; background: var(--c-accent); border-radius: 0 100% 0 100%; margin-right: 0.45em; vertical-align: 0.08em; }
.layout-botanical .faq-item__q::before, .layout-botanical .contact-card h2::before, .layout-botanical .post__body h2::before { display: none; }
.layout-botanical .step__num { border-radius: 0 50% 50% 50%; }
.layout-botanical .promise .sparkle { fill: var(--c-accent); }
.layout-botanical .chips li { border-radius: 999px 999px 999px 4px; }

/* ---------------- GEOMETRIC ---------------- */
.layout-geometric { --div: var(--shape-peak); --div-h: clamp(28px, 4vw, 64px); }
.layout-geometric h1 { font-weight: 800; letter-spacing: -0.035em; }
.layout-geometric h2 { font-weight: 700; letter-spacing: -0.025em; }
.layout-geometric .btn { border-radius: 0; clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px); padding-inline: 1.7rem; }
.layout-geometric .hero, .layout-geometric .page-hero { background-color: var(--c-mist); background-image: radial-gradient(color-mix(in srgb, var(--c-primary) 30%, transparent) 1.5px, transparent 1.7px); background-size: 24px 24px; }
.layout-geometric .hero__media:not(.mask) img { aspect-ratio: 1.1 / 1; border-radius: 0; clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
.layout-geometric .hero__media:not(.mask) { position: relative; }
.layout-geometric .hero__media:not(.mask)::after { content: ""; position: absolute; inset: 6% -4% -6% 4%; z-index: -1; background: var(--c-accent); opacity: .35; clip-path: polygon(25% 0, 75% 0, 100% 50%, 75% 100%, 25% 100%, 0 50%); }
.layout-geometric .about__media:not(.mask) img, .layout-geometric .service-detail__media:not(.mask) img, .layout-geometric .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 0; clip-path: polygon(40px 0, 100% 0, 100% calc(100% - 40px), calc(100% - 40px) 100%, 0 100%, 0 40px); }
.layout-geometric .service-row img, .layout-geometric .news-card img, .layout-geometric .post__image img, .layout-geometric .gallery img { border-radius: 0; clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px); }
.layout-geometric .step__num { border-radius: 0; border: 0; width: 62px; height: 62px; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.layout-geometric .step:not(:last-child)::after { top: 30px; left: 62px; }
.layout-geometric .step h3 { margin-top: 0.4rem; }
.layout-geometric .chips li { border-radius: 0; clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); padding-inline: 1.1rem; }
.layout-geometric .section-head h2::after, .layout-geometric .section > .wrap > h2::after { content: ""; display: block; width: 0; height: 0; margin-top: 0.8rem; border-left: 14px solid transparent; border-right: 14px solid transparent; border-top: 14px solid var(--c-accent); }

/* ---------------- LUXE (serif) ---------------- */
.layout-luxe { --div: var(--shape-curve); --div-h: clamp(30px, 5vw, 76px); --hero-bg: var(--c-ink); --mist-bg: var(--c-ink); }
.layout-luxe h1 { font-weight: 500; font-size: clamp(2.6rem, 6vw, 4.6rem); letter-spacing: -0.01em; line-height: 1.04; }
.layout-luxe h2 { font-weight: 500; letter-spacing: 0; }
.layout-luxe h3 { font-weight: 600; }
.layout-luxe body, .layout-luxe { letter-spacing: 0.01em; }
.layout-luxe .btn { border-radius: 0; text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.82rem; padding: 1rem 1.9rem; }
.layout-luxe .btn--primary { background: var(--c-ink); color: #fff; }
.layout-luxe .btn--primary:hover { background: var(--c-primary-dark); }
.layout-luxe .hero h1, .layout-luxe .page-hero h1, .layout-luxe .hero__lead, .layout-luxe .page-hero__lead, .layout-luxe .hero__area, .layout-luxe .post__date, .layout-luxe .post__back a { color: #fff; }
.layout-luxe .hero__lead, .layout-luxe .page-hero__lead { opacity: .85; }
.layout-luxe .hero__area, .layout-luxe .post__date { opacity: .65; }
.layout-luxe .hero .btn--primary { background: var(--c-highlight); color: var(--c-ink); }
.layout-luxe .hero .btn--primary:hover { background: #fff; }
.layout-luxe .hero .btn--ghost { background: transparent; color: #fff; border-color: color-mix(in srgb, var(--c-highlight) 70%, transparent); }
.layout-luxe .page-hero .jump a { background: rgba(255,255,255,.1); color: #fff; }
.layout-luxe .hero__media:not(.mask) { position: relative; }
.layout-luxe .hero__media:not(.mask) img, .layout-luxe .about__media:not(.mask) img, .layout-luxe .service-detail__media:not(.mask) img, .layout-luxe .service-detail--flip .service-detail__media:not(.mask) img { border-radius: 0; }
.layout-luxe .hero__media:not(.mask)::after { content: ""; position: absolute; inset: -16px 16px 16px -16px; border: 1px solid var(--c-highlight); z-index: -1; }
.layout-luxe .about__media:not(.mask) img, .layout-luxe .service-detail__media:not(.mask) img { outline: 1px solid var(--c-highlight); outline-offset: 10px; }
.layout-luxe .service-row img, .layout-luxe .news-card img, .layout-luxe .post__image img, .layout-luxe .gallery img { border-radius: 0; }
.layout-luxe .section--mist, .layout-luxe .section--mist h2, .layout-luxe .section--mist h3 { color: #fff; }
.layout-luxe .section--mist p, .layout-luxe .section--mist .checklist li, .layout-luxe .section--mist .muted { color: rgba(255,255,255,.78); }
.layout-luxe .section--mist .chips li { background: rgba(255,255,255,.1); color: #fff; }
.layout-luxe .section--mist .promise .sparkle { fill: var(--c-highlight); }
.layout-luxe .section--mist .checklist .sparkle { fill: var(--c-highlight); }
.layout-luxe .section h2::after { content: ""; display: block; width: 44px; height: 1px; background: var(--c-highlight); margin-top: 1rem; }
.layout-luxe .faq-item__q::after, .layout-luxe .contact-card h2::after, .layout-luxe .price-group h2::after, .layout-luxe .post__body h2::after { display: none; }
.layout-luxe .step__num { background: var(--c-ink); color: var(--c-highlight); border: 1px solid var(--c-highlight); font-family: var(--font-heading); }
.layout-luxe .chips li { border-radius: 0; }
.layout-luxe .cta-band { background: var(--c-ink); }
.layout-luxe .cta-band::after { border-top-width: 1px; }
.layout-luxe .cta-band .btn--light { background: var(--c-highlight); color: var(--c-ink); }
.layout-luxe .site-footer { border-top: 1px solid color-mix(in srgb, var(--c-highlight) 40%, transparent); }

@media (prefers-reduced-motion: reduce) { .layout-studio .btn:hover { transform: none; } }

/* keep small headings small when a layout enlarges its section headings */
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .site-footer__heading { font-size: 1.05rem; letter-spacing: 0; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .faq-item__q { font-size: 1.05rem; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .contact-card h2 { font-size: 1.2rem; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .price-group h2 { font-size: 1.6rem; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .pricing__aside h2, :is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .faq__aside h2 { font-size: 1.5rem; }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .area__heading { font-size: clamp(1.5rem, 2.6vw, 2rem); }
:is(.layout-wave, .layout-boutique, .layout-studio, .layout-heritage, .layout-sunrise, .layout-editorial, .layout-pebble, .layout-botanical, .layout-geometric, .layout-luxe) .post__body h2 { font-size: 1.6rem; }
.layout-heritage .feature__text h2, .layout-heritage .feature__text { text-align: left; }
.layout-heritage .feature__text h2::after { margin-left: 0; }


/* =========================================================
   ENGAGING LAYOUTS (Aurora, Neon, Split, Magazine, Glass, Bauhaus,
   Confetti, Mosaic, Billboard, Velvet): scroll reveal, hover lift,
   and bolder openings. Motion is off for reduced-motion visitors.
   ========================================================= */
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); transition-delay: var(--reveal-delay, 0ms); }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .reveal.is-in { opacity: 1; transform: none; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .service-row, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .promise, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .news-card, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .price-group { transition: transform .3s ease, box-shadow .3s ease, opacity .7s ease; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .service-row:hover, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .news-card:hover, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .promise:hover { transform: translateY(-5px); }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .sweep { display: none; }
@media (prefers-reduced-motion: reduce) { :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) * { animation: none !important; transition: none !important; } }

/* full-screen photo openings (Glass, Billboard, Velvet) */
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero { position: relative; min-height: min(92vh, 900px); display: grid; align-items: center; padding: 7rem 0 5rem; overflow: hidden; background: var(--c-ink); }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__media { position: absolute; inset: 0; margin: 0; z-index: 0; border-radius: 0 !important; clip-path: none !important; max-width: none; width: auto; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__media img, :is(.layout-glass, .layout-billboard, .layout-velvet) .hero__media--slides .hero__slide { position: absolute !important; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; aspect-ratio: auto; box-shadow: none; border: 0; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__media::before { display: none; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__media::after { content: ""; position: absolute; inset: 0; z-index: 1; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__grid { position: static; grid-template-columns: 1fr; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__text { position: relative; z-index: 2; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__pause { z-index: 3; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero h1, :is(.layout-glass, .layout-billboard, .layout-velvet) .hero__lead, :is(.layout-glass, .layout-billboard, .layout-velvet) .hero__area { color: #fff; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero__area { opacity: .85; }
:is(.layout-glass, .layout-billboard, .layout-velvet) .hero .btn--ghost { color: #fff; border-color: rgba(255,255,255,.7); background: transparent; }

/* ---------------- AURORA ---------------- */
@keyframes aurora-drift { 0% { background-position: 0% 0%, 100% 100%, 50% 0%; } 50% { background-position: 30% 20%, 70% 60%, 20% 40%; } 100% { background-position: 0% 0%, 100% 100%, 50% 0%; } }
.layout-aurora h1, .layout-aurora h2 { font-weight: 800; letter-spacing: -0.03em; }
.layout-aurora .hero { background:
  radial-gradient(40% 50% at 20% 20%, color-mix(in srgb, var(--c-accent) 45%, transparent), transparent 70%),
  radial-gradient(45% 55% at 85% 75%, color-mix(in srgb, var(--c-primary) 40%, transparent), transparent 70%),
  radial-gradient(35% 45% at 60% 10%, color-mix(in srgb, var(--c-highlight) 55%, transparent), transparent 70%), var(--c-mist);
  background-size: 140% 140%, 140% 140%, 140% 140%; animation: aurora-drift 18s ease-in-out infinite; }
.layout-aurora .hero__media:not(.mask) img, .layout-aurora .hero__media--slides:not(.mask) { border-radius: 28px; }
.layout-aurora .hero__media:not(.mask) { padding: 10px; border-radius: 34px; background: rgba(255,255,255,.45); backdrop-filter: blur(10px); box-shadow: 0 30px 70px -30px rgba(13,42,74,.5); }
.layout-aurora .service-row, .layout-aurora .promise { background: rgba(255,255,255,.75); border: 1px solid rgba(255,255,255,.9); border-radius: 22px; box-shadow: 0 16px 40px -28px rgba(13,42,74,.5); padding: 1.2rem; }
.layout-aurora .section--mist { background: linear-gradient(160deg, var(--c-mist), color-mix(in srgb, var(--c-highlight) 22%, white)); }
.layout-aurora .btn { border-radius: 999px; }
.layout-aurora .btn--primary { background: linear-gradient(120deg, var(--c-primary), color-mix(in srgb, var(--c-primary) 60%, var(--c-accent))); border: 0; }

/* ---------------- NEON (dark opening and feature areas) ---------------- */
.layout-neon { --neon: var(--c-accent); }
.layout-neon h1, .layout-neon h2 { font-weight: 700; letter-spacing: -0.03em; }
.layout-neon .site-header { background: #0b0f17; }
.layout-neon .site-header a, .layout-neon .brand__name { color: #e8edf5; }
.layout-neon .hero, .layout-neon .section--mist, .layout-neon .cta-band, .layout-neon .page-hero { background: radial-gradient(60% 80% at 80% 0%, color-mix(in srgb, var(--c-primary) 35%, transparent), transparent 70%), #0b0f17; color: #c9d3e1; }
.layout-neon .hero h1, .layout-neon .page-hero h1 { background: linear-gradient(100deg, #fff 20%, var(--neon)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.layout-neon .hero__lead, .layout-neon .hero__area, .layout-neon .page-hero__lead, .layout-neon .section--mist p { color: #b7c2d3; }
.layout-neon .section--mist h2, .layout-neon .section--mist h3, .layout-neon .cta-band h2 { color: #fff; }
.layout-neon .hero__media:not(.mask) img, .layout-neon .hero__media--slides { border-radius: 18px; box-shadow: 0 0 0 1px color-mix(in srgb, var(--neon) 60%, transparent), 0 0 60px -10px color-mix(in srgb, var(--neon) 70%, transparent); }
.layout-neon .promise { background: #121826; border: 1px solid color-mix(in srgb, var(--neon) 45%, transparent); border-radius: 16px; padding: 1.3rem; box-shadow: 0 0 30px -18px var(--neon); }
.layout-neon .promise:hover { box-shadow: 0 0 40px -10px var(--neon); }
.layout-neon .promise p { color: #b7c2d3; }
.layout-neon .service-row { border-radius: 16px; }
.layout-neon .service-row:hover { box-shadow: 0 0 0 2px var(--neon); }
.layout-neon .btn--primary { box-shadow: 0 0 24px -6px var(--neon); }
.layout-neon .hero .btn--ghost, .layout-neon .page-hero .btn--ghost { color: #fff; border-color: color-mix(in srgb, var(--neon) 70%, transparent); background: transparent; }
.layout-neon .chips li { border: 1px solid color-mix(in srgb, var(--neon) 40%, transparent); }
.layout-neon .site-footer { background: #070a10; }

/* ---------------- SPLIT (split-screen opening) ---------------- */
.layout-split h1 { font-weight: 800; letter-spacing: -0.035em; font-size: clamp(2.6rem, 5.5vw, 4.6rem); line-height: 1; }
.layout-split h2 { font-weight: 800; letter-spacing: -0.03em; }
.layout-split .hero { padding: 0; background: var(--c-primary-dark); }
.layout-split .hero__grid { max-width: none; padding: 0; gap: 0; grid-template-columns: 1fr 1fr; min-height: min(88vh, 860px); }
.layout-split .hero__text { padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 6vw, 6rem); align-self: center; }
.layout-split .hero h1, .layout-split .hero__lead, .layout-split .hero__area { color: #fff; }
.layout-split .hero .btn--primary { background: #fff; color: var(--c-primary-dark); border-color: #fff; }
.layout-split .hero .btn--ghost { color: #fff; border-color: rgba(255,255,255,.6); background: transparent; }
.layout-split .hero__media { margin: 0; border-radius: 0 !important; clip-path: none !important; position: relative; max-width: none; align-self: stretch; height: 100%; min-height: 420px; }
.layout-split .hero__media:not(.hero__media--slides) img { position: absolute; inset: 0; }
.layout-split .hero__media img, .layout-split .hero__media--slides .hero__slide { width: 100%; height: 100%; object-fit: cover; border-radius: 0 !important; aspect-ratio: auto; }
.layout-split .hero__media--slides .hero__slide { position: absolute !important; inset: 0; }
.layout-split .hero__media::before { display: none; }
.layout-split .service-rows { counter-reset: svc; }
.layout-split .service-row { counter-increment: svc; position: relative; }
.layout-split .service-row::before { content: counter(svc, decimal-leading-zero); font-size: 2.6rem; font-weight: 800; color: color-mix(in srgb, var(--c-primary) 22%, white); position: absolute; right: 1rem; top: .2rem; }
.layout-split .section--mist { background: var(--c-ink); }
.layout-split .section--mist h2, .layout-split .section--mist h3 { color: #fff; }
.layout-split .section--mist p { color: rgba(255,255,255,.75); }
.layout-split .btn { border-radius: 4px; }
@media (max-width: 820px) { .layout-split .hero__grid { grid-template-columns: 1fr; } .layout-split .hero__media { min-height: 320px; } }

/* ---------------- MAGAZINE (serif) ---------------- */
.layout-magazine h1 { font-weight: 700; font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: .98; letter-spacing: -0.03em; }
.layout-magazine h2 { font-weight: 600; font-size: clamp(2rem, 4.4vw, 3.2rem); letter-spacing: -0.02em; }
.layout-magazine .hero { background: #fff; border-top: 8px solid var(--c-ink); }
.layout-magazine .hero__lead { font-size: 1.3rem; font-style: italic; font-family: var(--font-heading); }
.layout-magazine .hero__media:not(.mask) { position: relative; }
.layout-magazine .hero__media:not(.mask) img, .layout-magazine .hero__media--slides:not(.mask) { border-radius: 0; }
.layout-magazine .hero__media:not(.mask)::after { content: ""; position: absolute; left: -22px; bottom: -22px; width: 55%; height: 45%; background: var(--c-accent); z-index: -1; }
.layout-magazine main { counter-reset: mag; }
.layout-magazine main > .section h2 { counter-increment: mag; }
.layout-magazine main > .section h2::before { content: counter(mag, decimal-leading-zero) " /"; display: block; font-size: .9rem; letter-spacing: .2em; color: var(--c-primary); font-family: var(--font-body); font-weight: 700; margin-bottom: .6rem; }
.layout-magazine .section-head { border-top: 2px solid var(--c-ink); padding-top: 1.2rem; }
.layout-magazine .feature__text p:first-of-type::first-letter, .layout-magazine .about__body p:first-child::first-letter { float: left; font-family: var(--font-heading); font-size: 4rem; line-height: .85; margin: .3rem .6rem 0 0; color: var(--c-primary); }
.layout-magazine .btn { border-radius: 0; font-weight: 700; }
.layout-magazine .service-row img, .layout-magazine .news-card img, .layout-magazine .feature__back, .layout-magazine .feature__front { border-radius: 0; }

/* ---------------- GLASS ---------------- */
.layout-glass h1 { font-weight: 800; letter-spacing: -0.03em; }
.layout-glass .hero__media::after { background: linear-gradient(110deg, rgba(10,16,28,.55), rgba(10,16,28,.15)); }
.layout-glass .hero__text { max-width: 620px; padding: clamp(1.6rem, 4vw, 2.8rem); border-radius: 28px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); box-shadow: 0 30px 80px -30px rgba(0,0,0,.6); }
.layout-glass body, .layout-glass { background: linear-gradient(180deg, #fff, var(--c-mist)); }
.layout-glass .service-row, .layout-glass .promise, .layout-glass .news-card { background: rgba(255,255,255,.7); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.9); border-radius: 22px; box-shadow: 0 18px 40px -26px rgba(13,42,74,.45); padding: 1.1rem; }
.layout-glass .btn { border-radius: 999px; }
.layout-glass .section--mist { background: radial-gradient(50% 70% at 10% 0%, color-mix(in srgb, var(--c-highlight) 40%, transparent), transparent 70%), var(--c-mist); }

/* ---------------- BAUHAUS ---------------- */
.layout-bauhaus h1, .layout-bauhaus h2 { font-weight: 800; letter-spacing: -0.02em; text-transform: none; }
.layout-bauhaus .hero { position: relative; overflow: hidden; background: #fff; }
.layout-bauhaus .hero::before { content: ""; position: absolute; width: clamp(200px, 26vw, 380px); aspect-ratio: 1; border-radius: 50%; background: var(--c-accent); right: -60px; top: -80px; }
.layout-bauhaus .hero::after { content: ""; position: absolute; width: clamp(140px, 16vw, 240px); aspect-ratio: 2 / 1; border-radius: 999px 999px 0 0; background: var(--c-primary); right: 34%; bottom: 0; }
.layout-bauhaus .hero .wrap { position: relative; z-index: 1; }
.layout-bauhaus .hero__media:not(.mask) img, .layout-bauhaus .hero__media--slides:not(.mask) { border-radius: 0; border: 4px solid var(--c-ink); box-shadow: 14px 14px 0 var(--c-highlight); }
.layout-bauhaus .btn { border-radius: 0; border: 3px solid var(--c-ink); box-shadow: 5px 5px 0 var(--c-ink); font-weight: 800; }
.layout-bauhaus .btn:hover { transform: translate(-2px, -2px); box-shadow: 7px 7px 0 var(--c-ink); }
.layout-bauhaus .section-head h2::after, .layout-bauhaus .section > .wrap > h2::after { content: ""; display: block; width: 90px; height: 10px; background: linear-gradient(90deg, var(--c-primary) 0 33%, var(--c-accent) 33% 66%, var(--c-highlight) 66%); margin-top: .8rem; }
.layout-bauhaus .promise { border: 3px solid var(--c-ink); padding: 1.2rem; background: #fff; }
.layout-bauhaus .promise:nth-child(3n+1) { border-top: 14px solid var(--c-primary); }
.layout-bauhaus .promise:nth-child(3n+2) { border-top: 14px solid var(--c-accent); }
.layout-bauhaus .promise:nth-child(3n) { border-top: 14px solid var(--c-highlight); }
.layout-bauhaus .service-row img, .layout-bauhaus .news-card img, .layout-bauhaus .feature__back, .layout-bauhaus .feature__front { border-radius: 0; }
.layout-bauhaus .step__num { border-radius: 0; }

/* ---------------- CONFETTI ---------------- */
.layout-confetti h1, .layout-confetti h2 { font-weight: 800; letter-spacing: -0.01em; }
.layout-confetti .hero, .layout-confetti .section--mist { background-color: var(--c-mist); }
.layout-confetti .btn { border-radius: 999px; border: 3px solid var(--c-ink); box-shadow: 0 5px 0 var(--c-ink); font-weight: 800; }
.layout-confetti .btn:hover { transform: translateY(2px); box-shadow: 0 3px 0 var(--c-ink); }
.layout-confetti .hero__media:not(.mask) img, .layout-confetti .hero__media--slides:not(.mask) { border-radius: 30px; border: 4px solid var(--c-ink); transform: rotate(2deg); box-shadow: 10px 12px 0 var(--c-ink); }
.layout-confetti .promise, .layout-confetti .news-card { background: #fff; border: 3px solid var(--c-ink); border-radius: 24px; padding: 1.2rem; box-shadow: 6px 6px 0 var(--c-ink); }
.layout-confetti .promise:nth-child(odd) { transform: rotate(-1.5deg); }
.layout-confetti .promise:nth-child(even) { transform: rotate(1.5deg); }
.layout-confetti .promise.reveal:not(.is-in) { transform: translateY(26px); }
.layout-confetti .service-row img { border-radius: 20px; border: 3px solid var(--c-ink); }
.layout-confetti .feature__back, .layout-confetti .feature__front { border: 4px solid var(--c-ink); border-radius: 28px; }
.layout-confetti .chips li { border: 2px solid var(--c-ink); }

/* ---------------- MOSAIC ---------------- */
.layout-mosaic h1, .layout-mosaic h2 { font-weight: 700; letter-spacing: -0.03em; }
.layout-mosaic .hero__media:not(.mask) { position: relative; padding: 0 0 14% 14%; }
.layout-mosaic .hero__media:not(.mask)::before { content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 42%; height: 46%; background: var(--c-primary); border-radius: 18px; }
.layout-mosaic .hero__media:not(.mask)::after { content: ""; position: absolute; right: -16px; top: -16px; width: 26%; aspect-ratio: 1; background: var(--c-accent); border-radius: 18px; z-index: -1; }
.layout-mosaic .hero__media:not(.mask) img, .layout-mosaic .hero__media--slides:not(.mask) { position: relative; border-radius: 18px; }
.layout-mosaic .service-rows { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; border: 0; }
.layout-mosaic .service-row { display: flex; flex-direction: column; gap: .6rem; padding: 0; border: 0; background: var(--c-mist); border-radius: 18px; overflow: hidden; }
.layout-mosaic .service-row:first-child { grid-row: span 2; }
.layout-mosaic .service-row img { width: 100%; height: 100%; min-height: 160px; object-fit: cover; border-radius: 0; flex: 1; }
.layout-mosaic .service-row > *:not(img) { padding: 0 1rem; }
.layout-mosaic .service-row > :last-child { padding-bottom: 1rem; }
.layout-mosaic .promises { gap: 1rem; }
.layout-mosaic .promise { border-radius: 18px; background: #fff; padding: 1.2rem; }
.layout-mosaic .promise:nth-child(2) { background: var(--c-primary); color: #fff; }
.layout-mosaic .promise:nth-child(2) h3, .layout-mosaic .promise:nth-child(2) p { color: #fff; }
@media (max-width: 820px) { .layout-mosaic .service-rows { grid-template-columns: 1fr; } .layout-mosaic .service-row:first-child { grid-row: auto; } }

/* ---------------- BILLBOARD ---------------- */
@keyframes billboard-ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.layout-billboard h1 { font-weight: 400; font-size: clamp(3.4rem, 10vw, 8.5rem); line-height: .9; letter-spacing: .01em; text-transform: uppercase; }
.layout-billboard h2 { font-weight: 400; font-size: clamp(2.4rem, 5vw, 3.8rem); letter-spacing: .02em; text-transform: uppercase; line-height: 1; }
.layout-billboard h3 { font-weight: 700; }
.layout-billboard .hero__media::after { background: linear-gradient(0deg, rgba(0,0,0,.65), rgba(0,0,0,.2) 60%); }
.layout-billboard .hero__grid { align-self: end; }
.layout-billboard .hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 10px; background: repeating-linear-gradient(-45deg, var(--c-accent) 0 18px, var(--c-ink) 18px 36px); z-index: 2; }
.layout-billboard .btn { border-radius: 0; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.layout-billboard .area { overflow: hidden; }
.layout-billboard .area .chips { flex-wrap: nowrap; width: max-content; animation: billboard-ticker 26s linear infinite; }
.layout-billboard .area .chips li { font-size: 1.1rem; padding: .6rem 1.2rem; }
.layout-billboard .area:hover .chips { animation-play-state: paused; }
.layout-billboard .service-row img, .layout-billboard .news-card img { border-radius: 0; filter: grayscale(.2) contrast(1.05); }
.layout-billboard .section--mist { background: var(--c-ink); }
.layout-billboard .section--mist h2, .layout-billboard .section--mist h3 { color: #fff; }
.layout-billboard .section--mist p { color: rgba(255,255,255,.75); }

/* ---------------- VELVET (serif) ---------------- */
.layout-velvet h1 { font-weight: 400; font-size: clamp(2.6rem, 6vw, 4.8rem); line-height: 1.05; }
.layout-velvet h2 { font-weight: 400; }
.layout-velvet .hero__media::after { background: radial-gradient(80% 90% at 30% 50%, rgba(10,8,20,.35), rgba(10,8,20,.8)); }
.layout-velvet .hero__text { border-left: 2px solid var(--c-highlight); padding-left: clamp(1rem, 3vw, 2rem); max-width: 640px; }
.layout-velvet .section--mist, .layout-velvet .cta-band { background: linear-gradient(135deg, var(--c-ink), color-mix(in srgb, var(--c-primary-dark) 70%, var(--c-ink))); }
.layout-velvet .section--mist h2, .layout-velvet .section--mist h3, .layout-velvet .cta-band h2 { color: #fff; }
.layout-velvet .section--mist p { color: rgba(255,255,255,.78); }
.layout-velvet .section-head h2::after, .layout-velvet .section > .wrap > h2::after { content: ""; display: block; width: 60px; height: 1px; background: var(--c-highlight); margin-top: 1rem; }
.layout-velvet .btn { border-radius: 0; text-transform: uppercase; letter-spacing: .14em; font-size: .82rem; }
.layout-velvet .hero .btn--primary { background: var(--c-highlight); color: var(--c-ink); border-color: var(--c-highlight); }
.layout-velvet .feature__front { border-color: var(--c-highlight); }
.layout-velvet .site-footer { background: #0b0912; }
.layout-split .hero__grid { width: 100%; margin: 0; }

/* keep small headings small when these layouts enlarge section headings */
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .site-footer h2, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .site-footer h3, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .site-footer__heading { font-size: 1.05rem !important; letter-spacing: .02em; line-height: 1.3; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .faq-item__q { font-size: 1.05rem; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .contact-card h2 { font-size: 1.2rem; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .price-group h2 { font-size: 1.6rem; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .pricing__aside h2, :is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .faq__aside h2 { font-size: 1.5rem; }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .area__heading { font-size: clamp(1.5rem, 2.6vw, 2rem); }
:is(.layout-aurora, .layout-neon, .layout-split, .layout-magazine, .layout-glass, .layout-bauhaus, .layout-confetti, .layout-mosaic, .layout-billboard, .layout-velvet) .post__body h2 { font-size: 1.6rem; }
.layout-magazine .site-footer h2::before, .layout-magazine .faq-item__q::before, .layout-magazine .price-group h2::before, .layout-magazine .contact-card h2::before { content: none; }

/* layouts with dark grey ("mist") sections: every piece of text in them is light, in every colour palette.
   Items with their own light background (area chips) keep dark text. */
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist { color: rgba(255, 255, 255, .86); }
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist :is(h1, h2, h3, h4, h5, strong, .checklist-title) { color: #fff; }
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist :is(p, li, span, dt, dd, small, .muted, .checklist li, .checklist span):not(.chips li):not(.chips li *):not(.btn):not(.btn *) { color: rgba(255, 255, 255, .86); }
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist a:not(.btn) { color: #fff; text-decoration-color: color-mix(in srgb, var(--c-highlight) 70%, transparent); }
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist .checklist svg, :is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet, .layout-luxe) .section--mist .sparkle { fill: var(--c-highlight); }
:is(.layout-neon, .layout-split, .layout-billboard, .layout-velvet) .section--mist .chips li { background: rgba(255, 255, 255, .12); color: #fff; border-color: rgba(255, 255, 255, .25); }