/* Sogand colour palettes — the parts that are more than colours (Sogand → Colour palette).
   Colours themselves come from the Elementor global colours the palette writes. */

/* ---------------- 1 Velvet glass (default) ---------------- */
body.sg-pal-velvet{
  background-image:
    radial-gradient(55% 40% at 12% 6%,rgba(140,75,92,.34),transparent 70%),
    radial-gradient(45% 38% at 92% 30%,rgba(143,167,151,.16),transparent 70%),
    radial-gradient(60% 45% at 20% 62%,rgba(110,52,67,.28),transparent 72%),
    radial-gradient(50% 40% at 85% 88%,rgba(143,167,151,.14),transparent 72%);
  background-repeat:no-repeat;background-size:100% 100%
}
html body.sg-pal-velvet .sg-b-light .elementor-button,html body.sg-pal-velvet .sg-btn-light,html body.sg-pal-velvet .sg-nl button{
  background:linear-gradient(90deg,var(--sg-champagne) 0%,color-mix(in srgb,var(--sg-champagne) 45%,var(--sg-celadon)) 62%,var(--sg-celadon) 100%);
  color:var(--sg-on-accent);border:1px solid color-mix(in srgb,var(--sg-hi) 18%,transparent);
  box-shadow:0 12px 30px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.12)
}
html body.sg-pal-velvet .sg-b-light .elementor-button:hover,html body.sg-pal-velvet .sg-btn-light:hover,html body.sg-pal-velvet .sg-nl button:hover{
  background:linear-gradient(90deg,color-mix(in srgb,var(--sg-champagne),#fff 12%),color-mix(in srgb,var(--sg-celadon),#fff 12%));color:var(--sg-on-accent)
}
/* the rose → celadon blend of the big glass panels */
body.sg-pal-velvet .sg-glass-deep{--_t1:var(--sg-gl-tint,rgba(122,64,79,.62));--_t2:var(--sg-gl-tint2,rgba(120,146,130,.40));--_edge:var(--sg-gl-edge,rgba(255,255,255,.18))}

/* ---------------- 2 Gallery bands & 6 Cream and mocha: light and green bands ---------------- */
body.sg-pal-gallery{--sg-band1:#C9B9B7;--sg-band1-ink:#3B2326;--sg-band1-acc:#7A4A4F;--sg-band2:#7B8276;--sg-band2-ink:#F3EBE4;--sg-band2-acc:#EADCCD}
body.sg-pal-mocha{--sg-band1:#E9DFD2;--sg-band1-ink:#3A271F;--sg-band1-acc:#8A5E36;--sg-band2:#8A7766;--sg-band2-ink:#F4ECE2;--sg-band2-acc:#F0D9B5}
/* light band: home services, collections grid, FAQ, process */
body:is(.sg-pal-gallery,.sg-pal-mocha) :is(.sg-svc-sec,.sg-tref-archive,.sg-faq-sec,.sg-proc-sec){
  background-color:var(--sg-band1);
  --e-global-color-text:var(--sg-band1-ink);--e-global-color-primary:var(--sg-band1-acc);
  --e-global-color-sgmuted:color-mix(in srgb,var(--sg-band1-ink) 78%,transparent);--e-global-color-sgfaint:color-mix(in srgb,var(--sg-band1-ink) 60%,transparent);
  --e-global-color-sghi:var(--sg-band1-ink);
  --sgk-gl-tint:rgba(255,255,255,.34);--sgk-gl-tint2:rgba(255,255,255,.18);--sgk-gl-edge:color-mix(in srgb,var(--sg-band1-ink) 14%,transparent);
  --sg-ox:rgba(255,255,255,.5);--sg-ox2:rgba(255,255,255,.42);--sg-deep:rgba(255,255,255,.26);
  --sg-card-media:color-mix(in srgb,var(--sg-band1-ink) 10%,transparent);
  --sg-mo-line:color-mix(in srgb,var(--sg-band1-ink) 58%,transparent)
}
/* green band: page doors, Join the Journey */
body:is(.sg-pal-gallery,.sg-pal-mocha) :is(.sg-doors-sec,.sg-journey-sec){
  background-color:var(--sg-band2);
  --e-global-color-text:var(--sg-band2-ink);--e-global-color-primary:var(--sg-band2-acc);
  --e-global-color-sgmuted:color-mix(in srgb,var(--sg-band2-ink) 80%,transparent);--e-global-color-sgfaint:color-mix(in srgb,var(--sg-band2-ink) 62%,transparent);
  --sgk-gl-tint:rgba(255,255,255,.10);--sgk-gl-tint2:rgba(255,255,255,.05);--sgk-gl-edge:rgba(255,255,255,.26);
  --sg-ox:rgba(0,0,0,.16);--sg-ox2:rgba(0,0,0,.14);--sg-deep:rgba(0,0,0,.10)
}
body:is(.sg-pal-gallery,.sg-pal-mocha) :is(.sg-svc-sec,.sg-tref-archive,.sg-faq-sec,.sg-proc-sec,.sg-doors-sec,.sg-journey-sec){
  --sg-gold:var(--e-global-color-primary);--sg-text:var(--e-global-color-text);--sg-muted:var(--e-global-color-sgmuted);--sg-faint:var(--e-global-color-sgfaint);
  --sg-hi:var(--e-global-color-sghi);--sg-line:color-mix(in srgb,var(--sg-hi) 14%,transparent);--sg-glass-border:color-mix(in srgb,var(--sg-hi) 16%,transparent);
  color:var(--e-global-color-text)
}
/* bands sit edge to edge */
body:is(.sg-pal-gallery,.sg-pal-mocha) :is(.sg-svc-sec,.sg-tref-archive,.sg-faq-sec,.sg-proc-sec,.sg-doors-sec,.sg-journey-sec){margin-block:0}
/* slim outlined buttons */
html body:is(.sg-pal-gallery,.sg-pal-mocha) .sg-b-light .elementor-button,html body:is(.sg-pal-gallery,.sg-pal-mocha) .sg-btn-light{
  background:transparent;color:var(--sg-text);border:1px solid color-mix(in srgb,var(--sg-text) 72%,transparent);box-shadow:none
}
html body:is(.sg-pal-gallery,.sg-pal-mocha) .sg-b-light .elementor-button:hover,html body:is(.sg-pal-gallery,.sg-pal-mocha) .sg-btn-light:hover{
  background:color-mix(in srgb,var(--sg-text) 12%,transparent);color:var(--sg-text)
}

/* ---------------- 5 Emerald night & 6 Cream and mocha: the page glow in their own colours ---------------- */
body:is(.sg-pal-emerald,.sg-pal-mocha){
  background-image:
    radial-gradient(60% 50% at 15% 20%,color-mix(in srgb,var(--sg-ox) 45%,transparent),transparent 70%),
    radial-gradient(50% 45% at 85% 70%,color-mix(in srgb,var(--sg-celadon) 8%,transparent),transparent 70%),
    radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--sg-ox) 25%,var(--sg-bg)) 0%,var(--sg-bg) 55%,var(--sg-deep) 100%);
  background-attachment:fixed
}

/* ---------------- 4 Ivory and gold (light) ---------------- */
body.sg-pal-ivory{
  background-image:radial-gradient(60% 40% at 10% 0%,rgba(201,163,92,.10),transparent 70%),radial-gradient(50% 40% at 95% 40%,rgba(127,154,139,.10),transparent 70%);
  background-repeat:no-repeat
}
/* the metal logo needs deeper gold on a light page */
body.sg-pal-ivory{--sg-metal:linear-gradient(100deg,#7d5d2f 0%,#b08a52 22%,#6f5229 38%,#8c847d 55%,#5f5a56 68%,#a07c45 82%,#7d5d2f 100%)}
/* the dark logo watermark is a faint shadow on light surfaces */
body.sg-pal-ivory .o-wm,body:is(.sg-pal-gallery,.sg-pal-mocha) :is(.sg-svc-sec,.sg-tref-archive,.sg-faq-sec,.sg-proc-sec) .o-wm{opacity:.12}
/* softer shadows on a light page */
body.sg-pal-ivory :is(.sg-glass-on,.sg-glass-card,.sg-glass-deep){--sgk-gl-shadow:.10}
/* phones: the dark model photo sits in a rounded frame instead of smudging into the light page */
@media (max-width:767px){
  body.sg-pal-ivory .sg-hxl-fade .elementor-element{--sg-ft:0%;--sg-fb:0%}
  body.sg-pal-ivory .sg-hxl-fade img{border-radius:18px}
}