/* Boutique Silk v4 — BienPrints Atelier (women-first)
   - Fullscreen velvet-rose wrinkled silk background
   - Unified palette + editorial typography
   - Works as an override layer over styles.css
*/

:root{
  --bf-bg-rose: #e7a6bf;
  --bf-plum: #5b1d3a;
  --bf-plum-2: #7a2e51;
  --bf-cream: #fff7fb;
  --bf-paper: rgba(255,255,255,.78);
  --bf-glass: rgba(255,255,255,.58);
  --bf-border: rgba(91,29,58,.18);
  --bf-shadow: 0 18px 55px rgba(45, 6, 22, .22);
  --bf-shadow-soft: 0 10px 30px rgba(45, 6, 22, .16);
  --bf-radius: 22px;
  --bf-radius-lg: 32px;

  --bf-h1: clamp(2.05rem, 4.8vw, 3.7rem);
  --bf-h2: clamp(1.55rem, 3.2vw, 2.3rem);
  --bf-h3: clamp(1.15rem, 2.2vw, 1.45rem);
  --bf-body: 1.02rem;
  --bf-muted: rgba(91,29,58,.72);
}

html{
  background:
    url("/dla-domu/assets/bg-silk-velvet-rose.jpg") center / cover no-repeat fixed;
  min-height: 100%;
}

html[data-theme="dark"]{
  background:
    url("/dla-domu/assets/bg-silk-velvet-rose.jpg") center / cover no-repeat fixed;
}

body{
  background: transparent !important;
  color: var(--bf-plum);
}

/* soft overlay for readability */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(1200px 700px at 18% 12%, rgba(255,255,255,.82), rgba(255,255,255,.15) 58%, rgba(0,0,0,.00) 74%),
    radial-gradient(900px 600px at 82% 18%, rgba(255,240,247,.55), rgba(0,0,0,.00) 66%),
    radial-gradient(900px 900px at 50% 100%, rgba(255,255,255,.45), rgba(0,0,0,.00) 60%),
    linear-gradient(to bottom, rgba(255,255,255,.20), rgba(255,255,255,.03) 35%, rgba(255,255,255,.10));
  mix-blend-mode: screen;
  z-index: 0;
}

main, header, footer{ position: relative; z-index: 1; }

/* editorial type */
body, input, select, textarea, button{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  font-size: var(--bf-body);
}

.bfv4 h1, .bfv4 h2, .bfv4 h3, .bfv4 .brandTitle{
  font-family: ui-serif, "Times New Roman", Georgia, serif;
  letter-spacing: .2px;
}

.bfv4 .muted{ color: var(--bf-muted) !important; }

/* Header */
header.header.bfv4-header{
  backdrop-filter: blur(12px);
  background: rgba(255,255,255,.30);
  border-bottom: 1px solid rgba(255,255,255,.35);
}

.bfv4-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  padding: 14px 0;
}

.bfv4-brand{
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  color: inherit;
}

.bfv4-brand img{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  box-shadow: var(--bf-shadow-soft);
}

.brandTitle{
  line-height: 1.05;
}
.brandTitle .name{
  font-weight: 700;
  font-size: 1.1rem;
}
.brandTitle .tag{
  font-size: .92rem;
  color: var(--bf-muted);
}

.bfv4-nav{
  display:flex;
  gap: 14px;
  align-items:center;
  flex-wrap:wrap;
}

.bfv4-nav a{
  text-decoration:none;
  color: var(--bf-plum);
  font-weight: 650;
  padding: 10px 12px;
  border-radius: 999px;
  transition: transform .12s ease, background .12s ease;
}

.bfv4-nav a:hover{
  background: rgba(255,255,255,.55);
  transform: translateY(-1px);
}

.bfv4-actions{
  display:flex;
  gap:10px;
  align-items:center;
}

/* Buttons */
.bfv4 .btn, header.header .btn{
  border-radius: 999px !important;
  border: 1px solid var(--bf-border) !important;
  background: rgba(255,255,255,.55) !important;
  color: var(--bf-plum) !important;
  box-shadow: var(--bf-shadow-soft);
}

.bfv4 .btn.primary, header.header .btn.primary{
  border: none !important;
  color: #fff !important;
  background:
    linear-gradient(135deg, #6b2141 0%, #a64069 42%, #d36a8e 100%) !important;
}

.bfv4 .btn:hover, header.header .btn:hover{
  transform: translateY(-1px);
}

/* Layout helpers */
.bfv4 .wrap{ max-width: 1180px; }

.bfv4-section{
  padding: clamp(34px, 5.5vw, 78px) 0;
}

.bfv4-card{
  background: var(--bf-paper);
  border: 1px solid rgba(255,255,255,.50);
  box-shadow: var(--bf-shadow);
  border-radius: var(--bf-radius-lg);
  backdrop-filter: blur(12px);
}

.bfv4-grid{
  display:grid;
  gap: 16px;
}

@media (min-width: 860px){
  .bfv4-grid.cols-3{ grid-template-columns: repeat(3, 1fr); }
  .bfv4-grid.cols-4{ grid-template-columns: repeat(4, 1fr); }
  .bfv4-grid.cols-2{ grid-template-columns: repeat(2, 1fr); }
}

.bfv4-kicker{
  display:inline-flex;
  gap: 10px;
  align-items:center;
  padding: 9px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.55);
  color: var(--bf-plum-2);
  font-weight: 650;
}

/* Hero */
.bfv4-hero{
  min-height: calc(100vh - var(--bp-header-h, 70px));
  display:flex;
  align-items:center;
  padding: 42px 0 10px;
}

.bfv4-heroInner{
  display:grid;
  gap: 18px;
  grid-template-columns: 1fr;
  align-items:center;
}

@media(min-width: 980px){
  .bfv4-heroInner{ grid-template-columns: 1.15fr .85fr; gap: 26px; }
}

.bfv4-hero h1{
  font-size: var(--bf-h1);
  margin: 14px 0 8px;
}

.bfv4-hero p{
  font-size: 1.1rem;
  color: rgba(91,29,58,.82);
  line-height: 1.6;
}

.bfv4-ctaRow{ display:flex; flex-wrap:wrap; gap: 10px; margin-top: 14px; }

.bfv4-heroCard{
  padding: 18px;
  border-radius: var(--bf-radius-lg);
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.60);
  box-shadow: var(--bf-shadow);
}

.bfv4-heroCard img{
  width: 100%;
  border-radius: 22px;
  display:block;
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: var(--bf-shadow-soft);
}

.bfv4-mini{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  margin-top: 14px;
}

.bfv4-pill{
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.55);
  color: rgba(91,29,58,.78);
  font-weight: 600;
}

/* Collection cards */
.bfv4-collection{
  padding: 16px;
  border-radius: var(--bf-radius);
  background: rgba(255,255,255,.62);
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: var(--bf-shadow-soft);
  display:flex;
  gap: 14px;
  align-items:flex-start;
}

.bfv4-collection img{
  width: 92px;
  height: 92px;
  object-fit: cover;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.7);
}

.bfv4-collection h3{ margin: 0 0 6px; font-size: var(--bf-h3); }
.bfv4-collection p{ margin: 0; color: var(--bf-muted); line-height: 1.45; }

/* Gift idea cards */
.bfv4-idea{
  padding: 14px;
  border-radius: var(--bf-radius);
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: var(--bf-shadow-soft);
}
.bfv4-idea .top{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
}
.bfv4-idea .tag{
  font-weight:700; color: var(--bf-plum-2);
  background: rgba(255,255,255,.65);
  border:1px solid rgba(255,255,255,.7);
  padding: 6px 10px; border-radius: 999px;
}
.bfv4-idea h3{ margin: 10px 0 6px; font-size: 1.18rem; }
.bfv4-idea p{ margin: 0 0 10px; color: var(--bf-muted); }
.bfv4-idea a{ text-decoration:none; }

/* Lookbook grid */
.bfv4-lookbook{
  display:grid;
  gap: 14px;
}
@media(min-width: 900px){
  .bfv4-lookbook{ grid-template-columns: 1.2fr 1fr; }
}
.bfv4-lookMasonry{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
@media(min-width: 900px){
  .bfv4-lookMasonry{ grid-template-columns: repeat(3, 1fr); }
}
.bfv4-lookMasonry figure{
  margin:0;
  border-radius: 22px;
  overflow:hidden;
  background: rgba(255,255,255,.55);
  border:1px solid rgba(255,255,255,.6);
  box-shadow: var(--bf-shadow-soft);
}
.bfv4-lookMasonry img{ width:100%; height:auto; display:block; }
.bfv4-lookMasonry figcaption{
  padding: 10px 12px;
  font-weight: 650;
  color: rgba(91,29,58,.80);
}

/* Steps */
.bfv4-steps .step{
  padding: 16px;
  border-radius: var(--bf-radius);
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: var(--bf-shadow-soft);
}
.bfv4-steps .n{
  width: 44px; height: 44px; border-radius: 999px;
  display:grid; place-items:center;
  color:#fff; font-weight: 800;
  background: linear-gradient(135deg, #6b2141, #d36a8e);
  box-shadow: var(--bf-shadow-soft);
  margin-bottom: 10px;
}

/* Contact section polish */
.bfv4 .panel{
  background: rgba(255,255,255,.62) !important;
  border: 1px solid rgba(255,255,255,.65) !important;
  border-radius: var(--bf-radius-lg) !important;
  box-shadow: var(--bf-shadow) !important;
  backdrop-filter: blur(12px);
}
.bfv4 label{ color: rgba(91,29,58,.88) !important; font-weight: 650; }
.bfv4 input, .bfv4 select, .bfv4 textarea{
  border-radius: 16px !important;
  border: 1px solid rgba(91,29,58,.20) !important;
  background: rgba(255,255,255,.78) !important;
}
.bfv4 input:focus, .bfv4 select:focus, .bfv4 textarea:focus{
  outline: none !important;
  box-shadow: 0 0 0 4px rgba(211,106,142,.25) !important;
  border-color: rgba(211,106,142,.65) !important;
}

/* Footer */
.bfv4-footer{
  padding: 34px 0 70px;
}
.bfv4-footer .cols{
  display:grid; gap: 14px;
}
@media(min-width: 900px){
  .bfv4-footer .cols{ grid-template-columns: 1.2fr .8fr 1fr; }
}
.bfv4-footer a{ color: rgba(91,29,58,.85); text-decoration:none; }
.bfv4-footer a:hover{ text-decoration:underline; }

/* Pages mode (existing markup) — boutique polish */
.bp-pages h1, .bp-pages h2, .bp-pages h3,
.bp-pages .brand-name{
  font-family: ui-serif, "Times New Roman", Georgia, serif;
  letter-spacing: .2px;
}

.bp-pages .muted{ color: var(--bf-muted) !important; }

.bp-pages header.header{
  backdrop-filter: blur(12px);
  background: rgba(255,255,255,.30);
  border-bottom: 1px solid rgba(255,255,255,.35);
}

.bp-pages .brand{
  text-decoration:none;
  color: inherit;
}

.bp-pages .brand-mark{
  border-radius: 14px;
  box-shadow: var(--bf-shadow-soft);
}

.bp-pages .nav a{
  border-radius: 999px;
  padding: 10px 12px;
  font-weight: 650;
  color: var(--bf-plum);
  text-decoration:none;
  transition: transform .12s ease, background .12s ease;
}

.bp-pages .nav a:hover{
  background: rgba(255,255,255,.55);
  transform: translateY(-1px);
}

.bp-pages .card,
.bp-pages .panel{
  background: rgba(255,255,255,.62) !important;
  border: 1px solid rgba(255,255,255,.65) !important;
  border-radius: var(--bf-radius-lg) !important;
  box-shadow: var(--bf-shadow) !important;
  backdrop-filter: blur(12px);
}

.bp-pages input, .bp-pages select, .bp-pages textarea{
  border-radius: 16px !important;
  border: 1px solid rgba(91,29,58,.20) !important;
  background: rgba(255,255,255,.78) !important;
}

.bp-pages .btn{
  border-radius: 999px !important;
  border: 1px solid var(--bf-border) !important;
  background: rgba(255,255,255,.55) !important;
  color: var(--bf-plum) !important;
  box-shadow: var(--bf-shadow-soft);
}

.bp-pages .btn.primary{
  border: none !important;
  color: #fff !important;
  background: linear-gradient(135deg, #6b2141 0%, #a64069 42%, #d36a8e 100%) !important;
}