/* ==========================================================================
   Sadec Online Shoppers — Sage Morning Mist
   Native Elementor build support stylesheet (atmosphere + helper classes)
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,500&family=Montserrat:wght@400;500;600;700&display=swap');

:root{
  --sage-100:#E9EEE1; --sage-200:#D3DCC5; --sage-300:#B7C6A5; --sage-700:#4F6640; --sage-800:#3C4E31;
  --cream-50:#FEFCF8; --cream-100:#FBF6EC; --cream-200:#F5EBD8;
  --charcoal-900:#26241E;
  --gold-500:#B08D57;
}

/* ---------- TYPE ---------- */
.sdc-serif{ font-family:"Cormorant Garamond", Georgia, serif; }
.sdc-sans{ font-family:"Montserrat", -apple-system, sans-serif; }
.sdc-eyebrow{
  font-family:"Montserrat", sans-serif; font-size:11px; font-weight:600;
  letter-spacing:.3em; text-transform:uppercase; color: var(--sage-800);
}

/* ---------- ATMOSPHERE LAYERS ---------- */
.sdc-field-base{
  background:
    radial-gradient(ellipse 90% 55% at 50% 100%, var(--sage-300) 0%, var(--sage-200) 45%, transparent 78%),
    linear-gradient(to bottom, var(--cream-100) 0%, var(--sage-100) 48%, var(--sage-200) 100%);
}
.sdc-seam{ background: linear-gradient(to bottom, var(--sage-200) 0%, var(--cream-100) 55%, #FBF1E8 100%); }
.sdc-seam-reverse{ background: linear-gradient(to bottom, #FBF1E8 0%, var(--cream-100) 45%, var(--sage-200) 100%); }
.sdc-kitchen-base{ background: linear-gradient(180deg, #FBF1E8 0%, #FCEFEA 45%, var(--cream-50) 100%); }

.sdc-mist-blob{
  position:absolute; border-radius:999px; pointer-events:none;
  background: radial-gradient(ellipse closest-side, rgba(255,255,255,0.8), rgba(255,255,255,0) 72%);
  filter: blur(48px);
}
.sdc-sun-glow{
  position:absolute; border-radius:999px; pointer-events:none;
  background: radial-gradient(circle, rgba(240,214,158,0.75) 0%, rgba(240,214,158,0.28) 42%, transparent 72%);
  filter: blur(70px); mix-blend-mode: multiply;
}
.sdc-grain{
  position:absolute; inset:0; pointer-events:none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay; opacity:.05;
}

/* ---------- PHOTO TREATMENT ---------- */
.sdc-photo-grade{ filter: saturate(.82) sepia(.06) hue-rotate(-6deg) brightness(1.02) contrast(.97); }
.sdc-photo-wrap{ position:relative; overflow:hidden; }
.sdc-photo-wrap img{ display:block; width:100%; height:100%; object-fit:cover; }
.sdc-photo-wash::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(233,238,225,.35) 0%, rgba(233,238,225,0) 30%, rgba(233,238,225,0) 70%, rgba(38,36,30,.35) 100%);
  mix-blend-mode: multiply;
}
.sdc-photo-wash-soft::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(180deg, rgba(233,238,225,.28) 0%, rgba(233,238,225,0) 35%, rgba(38,36,30,.28) 100%);
  mix-blend-mode: multiply;
}
.sdc-photo-vignette::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:2;
  box-shadow: inset 0 0 140px 40px rgba(38,36,30,.25);
}

/* ---------- GLASS LEGIBILITY PANEL ---------- */
.sdc-glass-panel{
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  background: rgba(255,255,255,.5);
  border-radius: 2.5rem;
  box-shadow: 0 30px 80px -20px rgba(43,56,35,0.35);
  padding: 2.25rem 1.75rem;
}
@media(min-width:768px){ .sdc-glass-panel{ padding: 2.75rem 2.5rem; } }

.sdc-card{
  border-radius: 2rem;
  box-shadow: 0 20px 45px -18px rgba(38,36,30,0.28);
  background: var(--cream-100);
}

/* ---------- BUTTONS ---------- */
.sdc-btn{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:"Montserrat", sans-serif; font-weight:600; font-size:14px;
  letter-spacing:.02em; text-decoration:none !important;
  padding:.9rem 1.75rem; border-radius:999px; transition: all .25s ease;
}
.sdc-btn-primary{ background: var(--sage-800); color: var(--cream-50) !important; }
.sdc-btn-primary:hover{ background: var(--sage-700); color: var(--cream-50) !important; }
.sdc-btn-outline{ background:transparent; color: var(--cream-50) !important; border:1.5px solid rgba(255,255,255,.75); }
.sdc-btn-outline:hover{ background: rgba(255,255,255,.15); }
.sdc-btn-outline-dark{ background:transparent; color: var(--sage-800) !important; border:1.5px solid var(--sage-800); }
.sdc-btn-outline-dark:hover{ background: var(--sage-800); color: var(--cream-50) !important; }

/* ---------- SMEG BENTO GRID ---------- */
.sdc-bento{
  display:grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(2, minmax(220px, auto));
  gap: 1.5rem;
  grid-template-areas:
    "a a a a b b"
    "a a a a c d";
}
@media (max-width: 900px){
  .sdc-bento{ grid-template-columns: 1fr; grid-template-rows: auto; grid-template-areas: "a" "b" "c" "d"; }
}
.sdc-bento-a{ grid-area:a; } .sdc-bento-b{ grid-area:b; } .sdc-bento-c{ grid-area:c; } .sdc-bento-d{ grid-area:d; }
.sdc-bento-tile{ position:relative; border-radius:2rem; overflow:hidden; display:block; min-height:220px; }
.sdc-bento-tile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: transform .6s ease; }
.sdc-bento-tile:hover img{ transform: scale(1.04); }
.sdc-bento-label{
  position:absolute; left:1.5rem; bottom:1.5rem; z-index:3; color:#fff;
  font-family:"Cormorant Garamond", serif; font-size:1.5rem; font-style:italic;
}

/* ---------- SWATCH BUTTON ---------- */
.sdc-swatch{
  display:inline-block; width:2.75rem; height:2.75rem; border-radius:999px;
  border:3px solid transparent; overflow:hidden; cursor:pointer; padding:0;
}
.sdc-swatch[aria-pressed="true"]{ border-color: var(--sage-700); }
.sdc-swatch img{ width:100%; height:100%; object-fit:cover; display:block; }

/* ---------- MOTION ---------- */
@keyframes sdc-float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }
@keyframes sdc-fade-up{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:translateY(0);} }
.sdc-animate-float{ animation: sdc-float 6s ease-in-out infinite; }
.sdc-animate-fade-up{ animation: sdc-fade-up .8s cubic-bezier(.16,1,.3,1) both; }

@media (prefers-reduced-motion: reduce){
  .sdc-animate-float, .sdc-animate-fade-up{ animation:none !important; }
}

a.sdc-btn:focus-visible, .sdc-swatch:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: 2px solid var(--sage-700); outline-offset:3px; border-radius:4px;
}