/* Theme palette overrides loaded separately so a changed Appearance is never hidden by a stale bundled stylesheet. */
body.business-page{background:var(--business-bg,#f8faf7)!important;color:var(--business-primary,#235c45)!important}
.business-page .business-shell{background-color:var(--business-bg,#f8faf7);border-color:var(--business-secondary,#dae7d5);color:var(--business-primary,#235c45)}
.business-page .business-nav{background-color:var(--business-secondary,#dae7d5);border-block-color:var(--business-primary,#235c45);color:var(--business-primary,#235c45)}
.business-page .business-nav a{color:var(--business-primary,#235c45)}
.business-page .business-nav a:hover,.business-page .business-nav a.is-active{background-color:var(--business-primary,#235c45);color:#fff}
.business-page .business-section{border-color:var(--business-secondary,#dae7d5)}
.business-page .business-section h2,.business-page .business-section h3,.business-page .business-intro h1{color:var(--business-primary,#235c45)}
.business-page .business-announcement,.business-page .business-offer{background:var(--business-secondary,#dae7d5);border-color:var(--business-primary,#235c45);color:var(--business-primary,#235c45)}
.business-page .business-offer:before{background:var(--business-primary,#235c45);color:#fff}
.business-page .business-product,.business-page .service-row,.business-page .business-quote,.business-page .business-contact-grid{background:var(--business-secondary,#dae7d5);border-color:var(--business-primary,#235c45)}
.business-page .business-product .product-art{background:var(--business-secondary,#dae7d5)!important;color:var(--business-primary,#235c45)}
.business-page .service-row .service-icon{background:var(--business-bg,#f8faf7);border-color:var(--business-primary,#235c45);color:var(--business-primary,#235c45)}
.business-page .contact-action{border-color:var(--business-primary,#235c45);color:var(--business-primary,#235c45);background:var(--business-bg,#f8faf7)}
.business-page .business-footer{border-top-color:var(--business-primary,#235c45);background:var(--business-secondary,#dae7d5)}
.business-page .btn-primary,.business-page .basket-button{background:var(--business-primary,#235c45)!important;border-color:var(--business-primary,#235c45)!important;color:#fff!important}
.business-page .btn-outline-primary{border-color:var(--business-primary,#235c45)!important;color:var(--business-primary,#235c45)!important}
.business-page .btn-outline-primary:hover{background:var(--business-primary,#235c45)!important;color:#fff!important}
.business-page .product-price,.business-page .basket-summary strong{color:var(--business-primary,#235c45)}
.business-page.font-serif{font-family:Georgia,'Times New Roman',serif}.business-page.font-rounded{font-family:'Manrope','DM Sans',sans-serif}.business-page.font-sans{font-family:'DM Sans',sans-serif}

/* Theme-aware public form controls. Some theme bundles use light/white text
   on their controls; keep the field surface in the customer's secondary
   palette so the text remains readable in every theme and in live preview. */
.business-page input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]),
.business-page select,
.business-page textarea{
  background-color:var(--business-secondary,#dae7d5)!important;
  color:var(--ink,#182f27)!important;
  border-color:color-mix(in srgb,var(--business-primary,#235c45) 32%,transparent)!important;
  caret-color:var(--business-primary,#235c45);
}
.business-page input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color])::placeholder,
.business-page textarea::placeholder{
  color:var(--muted,#78817b)!important;
  opacity:1;
}
.business-page input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=color]):focus,
.business-page select:focus,
.business-page textarea:focus{
  background-color:var(--business-secondary,#dae7d5)!important;
  border-color:var(--business-primary,#235c45)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--business-primary,#235c45) 18%,transparent)!important;
}
.business-page select option{
  background-color:var(--business-secondary,#dae7d5);
  color:var(--ink,#182f27);
}
/* Search controls have a wrapper surface; keep their inner field transparent
   so the icon and text read as one themed control. */
.business-page .catalogue-toolbar .catalogue-search-field{
  background-color:var(--business-secondary,#dae7d5)!important;
  border-color:color-mix(in srgb,var(--business-primary,#235c45) 32%,transparent)!important;
}
.business-page .catalogue-toolbar .catalogue-search-field input{
  background-color:transparent!important;
  border-color:transparent!important;
}
/* Contact form labels follow the tenant's primary palette as well, keeping
   the field captions aligned with the rest of the customized VCard. */
.business-page .business-contact-grid form label{
  color:var(--business-primary,#235c45)!important;
}

/* Uploaded brand media is part of every VCard header, including themes whose
   original layouts intentionally used a text-only header. Keep each theme's
   own cover/logo placement and shape while guaranteeing the media is visible. */
.business-page .business-cover>img{display:block;width:100%;height:100%;object-fit:cover}
.business-page .business-logo img{width:100%;height:100%;object-fit:contain}
.appearance-default{display:block;margin-top:6px;padding:0;border:0;background:transparent;color:#6b7f63;font-size:10px;font-weight:650;text-decoration:underline;text-underline-offset:3px}
.appearance-default:hover{color:var(--green,#235c45)}

/* Modern spacing, surface hierarchy and interaction language per theme.  These
   rules intentionally live after the base theme bundle so each customer card
   keeps its own visual rhythm when Appearance colors are customized. */
.business-page .business-section,
.business-page .business-product,
.business-page .service-row,
.business-page .business-offer,
.business-page .business-quote,
.business-page .business-contact-grid{transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background-color .24s ease}

/* Studio modern — soft rhythm and floating surfaces. */
.business-page.layout-modern .business-section{margin:24px 0;padding:44px 38px;border:1px solid #e3ebe1;border-radius:24px;box-shadow:0 14px 36px #193e300b}
.business-page.layout-modern .business-product{border:1px solid #e0e9de;border-radius:20px;box-shadow:0 10px 28px #193e3010}
.business-page.layout-modern .business-product:hover,.business-page.layout-modern .service-row:hover{transform:translateY(-5px);border-color:#9fbea0;box-shadow:0 18px 38px #193e3020}
.business-page.layout-modern .business-offer:hover,.business-page.layout-modern .business-quote:hover,.business-page.layout-modern .business-contact-grid:hover{transform:translateY(-3px);box-shadow:0 14px 30px #193e3018}

/* Retail — compact commerce cards with crisp edges and directional hover. */
.business-page.layout-retail .business-section{margin:18px 0;padding:36px 30px;border:1px solid #dfe5da;border-top:4px solid var(--green);border-radius:10px;box-shadow:0 8px 22px #193e300a}
.business-page.layout-retail .business-product{border:1px solid #d7e0d4;border-radius:8px;box-shadow:0 7px 18px #193e300d;transition:transform .2s ease,border-color .2s ease}
.business-page.layout-retail .business-product:hover{transform:translateY(-3px);border-color:var(--green);box-shadow:0 12px 25px #193e3018}
.business-page.layout-retail .service-row:hover{transform:translateX(5px);border-color:var(--green);box-shadow:0 10px 22px #193e3014}
.business-page.layout-retail .business-offer:hover{transform:translateX(4px);box-shadow:0 10px 23px #193e3015}

/* Fashion — editorial whitespace, hairline borders and image-led hover. */
.business-page.layout-fashion .business-section{margin:30px 0;padding:68px 42px;border-radius:3px;box-shadow:0 16px 38px #513e3410}
.business-page.layout-fashion .business-product{border:0;border-bottom:1px solid #c9b9a8;border-radius:0;box-shadow:none}
.business-page.layout-fashion .business-product:hover{transform:translateY(-4px);border-bottom-color:var(--ink);box-shadow:0 16px 26px #513e3414}
.business-page.layout-fashion .business-product:hover .product-art{transform:scale(1.025)}
.business-page.layout-fashion .product-art{transition:transform .35s ease}
.business-page.layout-fashion .service-row:hover{transform:translateY(-3px);border-bottom-color:var(--ink);box-shadow:0 12px 24px #513e3410}
.business-page.layout-fashion .business-offer:hover{transform:translateY(-3px);box-shadow:0 14px 25px #182f2726}

/* Restaurant — warm dining-card rhythm with rounded, tactile interactions. */
.business-page.layout-restaurant .business-section{margin:14px 0;padding:40px 32px;border:1px solid #eadbc7;border-radius:18px;box-shadow:0 12px 28px #7b4c2b12}
.business-page.layout-restaurant .business-product{border:1px solid #eadbc7;border-radius:14px;background:#fffaf2;box-shadow:0 7px 20px #7b4c2b0d}
.business-page.layout-restaurant .business-product:hover{transform:translateY(-4px);border-color:#b76b3d;box-shadow:0 15px 30px #7b4c2b22}
.business-page.layout-restaurant .service-row:hover{transform:scale(1.012);border-color:#b76b3d;box-shadow:0 12px 25px #7b4c2b1c}
.business-page.layout-restaurant .business-offer:hover,.business-page.layout-restaurant .business-quote:hover{transform:translateY(-3px);box-shadow:0 11px 24px #7b4c2b18}

/* Professional — dashboard-like split layout with a sticky identity rail. */
.business-page.layout-professional .business-intro{position:sticky;top:0;height:100vh;min-height:560px;align-self:start;overflow-y:auto;padding:48px 42px;scrollbar-width:thin;z-index:4}
.business-page.layout-professional .business-section{margin:20px 0;padding:42px 34px;border:1px solid #cbd6df;border-radius:14px;box-shadow:0 10px 26px #315c7a12}
.business-page.layout-professional .business-product{border:1px solid #cbd6df;border-radius:12px;box-shadow:0 6px 18px #315c7a0d}
.business-page.layout-professional .business-product:hover{transform:translateY(-4px);border-color:#78a4bd;box-shadow:0 15px 30px #315c7a20}
.business-page.layout-professional .service-row:hover{transform:translateX(5px);border-left-color:#78a4bd;box-shadow:0 10px 24px #315c7a1c}
.business-page.layout-professional .business-offer:hover,.business-page.layout-professional .business-quote:hover,.business-page.layout-professional .business-contact-grid:hover{transform:translateY(-3px);border-color:#78a4bd;box-shadow:0 12px 25px #315c7a18}

/* Salon — gentle pill geometry and a soft, lifted hover state. */
.business-page.layout-salon .business-section{margin:22px 0;padding:54px 36px;border:1px solid #efd9dc;border-radius:32px;box-shadow:0 14px 34px #b8798315}
.business-page.layout-salon .business-product{border:1px solid #ead5d8;border-radius:34px 34px 16px 16px;box-shadow:0 10px 25px #b8798318}
.business-page.layout-salon .business-product:hover{transform:translateY(-5px) scale(1.01);border-color:#d99ba7;box-shadow:0 18px 35px #b8798328}
.business-page.layout-salon .service-row:hover{transform:translateY(-3px);border-color:#d99ba7;box-shadow:0 12px 27px #b8798320}
.business-page.layout-salon .business-offer:hover,.business-page.layout-salon .business-quote:hover{transform:translateY(-3px);box-shadow:0 13px 28px #b8798322}

/* Premium identities keep their own spacing and hover signatures. */
.business-page.theme-noir-atelier .business-section{margin:18px 0;padding:50px 46px;border-radius:4px;box-shadow:0 18px 36px #0005}
.business-page.theme-noir-atelier .product-copy{padding-inline:26px}
.business-page.theme-noir-atelier .business-quote{padding-inline:30px}
.business-page.theme-noir-atelier .business-product:hover{transform:translateY(-5px);border-color:#c78554;box-shadow:0 18px 32px #0008}
.business-page.theme-noir-atelier .service-row:hover{transform:translateX(6px);border-color:#c78554;box-shadow:0 12px 25px #0008}
.business-page.theme-lumen-studio .business-section{margin:20px 0;padding:38px 34px;border-radius:26px;box-shadow:0 12px 34px #397fa018}
.business-page.theme-lumen-studio .business-product:hover,.business-page.theme-lumen-studio .service-row:hover{transform:translateY(-5px);border-color:#71b9d1;box-shadow:0 20px 42px #397fa02e}
.business-page.theme-terra-table .business-section{margin:12px 0;padding:46px 34px;border-radius:2px;box-shadow:0 8px 18px #9b5d3210}
.business-page.theme-terra-table .business-product:hover,.business-page.theme-terra-table .service-row:hover{transform:translateX(5px);border-bottom-color:#9b5d32;box-shadow:0 9px 20px #9b5d3217}
.business-page.theme-velvet-muse .business-section{margin:22px 0;padding:48px 36px;border-radius:34px;box-shadow:0 15px 34px #a65e7020}
.business-page.theme-velvet-muse .business-product:hover,.business-page.theme-velvet-muse .service-row:hover{transform:translateY(-5px);border-color:#d18b9d;box-shadow:0 18px 36px #a65e7030}

.business-page.layout-modern .business-gallery a:hover img{transform:scale(1.035);box-shadow:0 14px 28px #193e3020}
.business-page.layout-retail .business-gallery a:hover img{transform:translateY(-3px);filter:saturate(1.12);box-shadow:0 9px 20px #193e3018}
.business-page.layout-fashion .business-gallery a:hover img{transform:scale(1.04);filter:grayscale(0);}
.business-page.layout-restaurant .business-gallery a:hover img{transform:rotate(-1.5deg) scale(1.035);box-shadow:0 12px 25px #7b4c2b20}
.business-page.layout-professional .business-gallery a:hover img{transform:translateY(-4px);box-shadow:0 13px 25px #315c7a22}
.business-page.layout-salon .business-gallery a:hover img{transform:scale(1.045);box-shadow:0 14px 28px #b8798325}
.business-page.theme-noir-atelier .business-gallery a:hover img{transform:scale(1.04);filter:grayscale(0) sepia(.2);box-shadow:0 16px 30px #0009}
.business-page.theme-lumen-studio .business-gallery a:hover img{transform:translateY(-4px) scale(1.025);box-shadow:0 16px 32px #397fa02c}
.business-page.theme-terra-table .business-gallery a:hover img{transform:translateY(-3px);box-shadow:0 11px 22px #9b5d3220}
.business-page.theme-velvet-muse .business-gallery a:hover img{transform:scale(1.035);box-shadow:0 15px 30px #a65e7030}

/* Keep catalogue and service content in a clear title → details → action
   sequence instead of letting grid columns push buttons beside the copy. */
.business-page .business-offer{display:inline-flex;vertical-align:top;width:calc(50% - 10px);margin:8px 8px 8px 0;flex-direction:column;align-items:flex-start;gap:7px;line-height:1.55}
.business-page .business-offer b{display:block;margin:0;line-height:1.25}
.business-page .business-offer br{display:none}
.business-page .product-copy{display:flex;flex-direction:column;align-items:stretch;min-width:0;gap:7px; padding: 10px 12px;}
.business-page .product-copy h3{margin:0;line-height:1.35}
.business-page .product-copy .product-price{margin:0;line-height:1.35}
.business-page .product-copy select{margin:0;flex:0 0 auto}
.business-page .product-copy .btn{margin-top:auto;align-self:stretch}
.business-page .service-row{grid-template-columns:46px minmax(0,1fr);align-items:start;row-gap:0}
.business-page .service-row>div{display:flex;flex-direction:column;min-width:0}
.business-page .service-row h3{margin:0 0 6px;line-height:1.35}
.business-page .service-row p{margin:0 0 7px;line-height:1.65}
.business-page .service-row small{margin-top:0;line-height:1.35}
.business-page .service-row .btn,.business-page .service-row>.contact-action{grid-column:2;justify-self:start;align-self:start;margin-top:12px;max-width:100%;white-space:normal}
@media(max-width:650px){
  .business-page .business-offer{display:flex;width:100%;margin:7px 0;gap:6px;padding-right:16px}
  .business-page .service-row{grid-template-columns:40px minmax(0,1fr)}
  .business-page .service-row .btn,.business-page .service-row>.contact-action{grid-column:1/-1;justify-self:stretch;width:100%}
}

@media(max-width:900px){
  .business-page.layout-professional .business-intro{position:relative;top:auto;height:auto;min-height:0;overflow:visible;padding:30px 25px}
  .business-page.layout-modern .business-section,.business-page.layout-retail .business-section,.business-page.layout-fashion .business-section,.business-page.layout-restaurant .business-section,.business-page.layout-professional .business-section,.business-page.layout-salon .business-section,.business-page.theme-noir-atelier .business-section,.business-page.theme-lumen-studio .business-section,.business-page.theme-terra-table .business-section,.business-page.theme-velvet-muse .business-section{padding-inline:10px;margin-block:14px}
}
@media(max-width:700px){
  .business-page.theme-noir-atelier .product-copy{padding-inline:18px}
  .business-page.theme-noir-atelier .business-quote{padding-inline:20px}
}
.business-page .business-logo{display:grid}
.layout-fashion .business-logo{display:grid;margin:-45px auto 0}
.layout-salon .business-logo{display:grid}
.layout-professional .business-cover{display:block;grid-column:1/-1;grid-row:1;height:240px}
.layout-professional .business-announcement{grid-column:1/-1;grid-row:2}
.layout-professional .business-intro{grid-column:1;grid-row:3/span 2}
.layout-professional .business-nav{grid-column:2;grid-row:3}
.layout-professional .business-sections{grid-column:2;grid-row:4}
.layout-professional .business-footer{grid-column:1/-1;grid-row:5}
@media(max-width:700px){
  .layout-professional .business-cover{display:block;grid-column:1;grid-row:auto;height:220px}
  .layout-professional .business-announcement,.layout-professional .business-intro,.layout-professional .business-nav,.layout-professional .business-sections,.layout-professional .business-footer{grid-column:auto;grid-row:auto}
}

/* Shared public-card sliders and progressive media galleries. Each theme keeps
   its own card styling while the interaction remains consistent and touch friendly. */
.business-slider{position:relative;min-width:0}
.business-slider-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:2px 2px 8px}
.business-slider-track::-webkit-scrollbar{display:none}
.business-slider .business-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.business-slider .business-offer{width:100%;max-width:none;margin:0;min-height:100%;box-sizing:border-box}
.business-testimonials{display:block}
.business-testimonials .business-quote{height:100%;box-sizing:border-box;margin:0;padding: 20px;}
.business-slider-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:12px;color:var(--business-primary,var(--green));font-size:11px;font-weight:600}
.business-slider-button{display:inline-grid;place-items:center;width:32px;height:32px;border:1px solid color-mix(in srgb,var(--business-primary,var(--green)) 35%,transparent);border-radius:50%;background:var(--business-bg,var(--cream));color:var(--business-primary,var(--green));font-size:17px;line-height:1;cursor:pointer;transition:transform .2s ease,background .2s ease,color .2s ease}
.business-slider-button:hover{transform:translateY(-2px);background:var(--business-primary,var(--green));color:#fff}
.business-slider-button:focus-visible,.media-see-more:focus-visible{outline:3px solid color-mix(in srgb,var(--business-primary,var(--green)) 35%,transparent);outline-offset:3px}
.business-gallery [data-media-extra][hidden],.business-videos [data-media-extra][hidden]{display:none!important}
.media-see-more{display:flex;align-items:center;justify-content:center;gap:7px;margin:18px auto 0;padding:9px 16px;border:1px solid color-mix(in srgb,var(--business-primary,var(--green)) 35%,transparent);border-radius:999px;background:transparent;color:var(--business-primary,var(--green));font-size:11px;font-weight:700;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}
.media-see-more:hover{transform:translateY(-2px);background:var(--business-primary,var(--green));color:#fff}
.media-see-more-count{opacity:.7;font-weight:500}
@media(min-width:760px){
  .business-testimonials .business-slide{flex-basis:calc(50% - 8px)}
}

