
:root{
  --black:#111111;
  --black-2:#242424;
  --white:#ffffff;
  --offwhite:#f7f7f5;
  --gray:#6c6c69;
  --line:#deded9;
  --red:#c61f2d;
  --red-dark:#a81320;
  --green:#147a43;
  --green-soft:#e9f4ed;
  --shadow:0 14px 42px rgba(17,17,17,.09);
  --shell:min(1420px,calc(100% - 48px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--white);color:var(--black);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
#app:focus{outline:none}
button,input{font:inherit}
a{color:inherit;text-decoration:none}
button{color:inherit}
.shell{width:var(--shell);margin:0 auto}

.site-header{background:white;position:relative;z-index:30;border-bottom:1px solid var(--line)}
.topbar{background:var(--black);color:white}
.topbar-inner{min-height:34px;display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.02em}
.topbar-left,.topbar-right{display:flex;gap:17px;align-items:center}
.topbar a:hover{text-decoration:underline}

.main-header{
  display:grid;grid-template-columns:auto minmax(360px,690px) auto;align-items:center;
  gap:34px;padding:12px 0 14px;
}
.brand{display:flex;align-items:center;min-width:245px;height:54px}
.brand-logo{display:block;max-width:245px;max-height:52px;width:auto;height:auto;object-fit:contain;object-position:left center}
.brand-wordmark{display:flex;flex-direction:column;line-height:.93}
.brand-fallback{display:none}
.brand-main{font-size:20px;font-weight:900;letter-spacing:.025em}
.brand-sub{font-size:15px;font-weight:750;letter-spacing:.34em;margin-top:6px}

.search-launch{
  height:48px;border:1px solid #bbb;background:#fafafa;border-radius:999px;
  display:flex;align-items:center;gap:12px;padding:0 20px;color:#777;text-align:left;cursor:text;
}
.search-launch:hover{border-color:#888;background:#fff}
.search-icon{font-size:22px;color:#222}
.header-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px}
.text-icon,.icon-button{border:0;background:transparent;cursor:pointer;padding:8px;font-size:14px}
.bag-button{font-weight:700}
.mobile-menu-button,.search-mobile{display:none}

.primary-nav{border-top:1px solid #ededed;position:relative}
.nav-inner{display:flex;align-items:center;gap:32px;min-height:47px}
.nav-link{
  border:0;background:transparent;cursor:pointer;padding:14px 0 13px;
  font-size:13px;font-weight:720;position:relative;white-space:nowrap;
}
.nav-link:after{
  content:"";position:absolute;height:2px;left:0;right:100%;bottom:6px;background:var(--black);transition:.18s ease;
}
.nav-link:hover:after,.nav-link.active:after{right:0}
.nav-stock{color:var(--green)}
.nav-stock:after{background:var(--green)}
.nav-sale{color:var(--red)}
.nav-sale:after{background:var(--red)}

.mega-menu{
  position:absolute;left:0;right:0;top:100%;background:white;border-top:1px solid var(--line);
  box-shadow:var(--shadow);padding:28px 0 32px;
}
.mega-content{width:var(--shell);margin:0 auto;display:grid;grid-template-columns:1.2fr .8fr;gap:64px}
.mega-title{font-family:Georgia,"Times New Roman",serif;font-size:27px;margin:0 0 18px}
.mega-links{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 30px}
.mega-links a{padding:7px 0;font-size:14px;color:#333}
.mega-links a:hover{text-decoration:underline}
.mega-feature{
  min-height:165px;padding:26px;border-radius:14px;color:white;
  background:linear-gradient(135deg,var(--black),#2b2b2b);
  display:flex;flex-direction:column;justify-content:flex-end;border-bottom:5px solid var(--red);
}
.mega-feature strong{font-family:Georgia,"Times New Roman",serif;font-size:24px}
.mega-feature span{color:#d3d3d3;margin-top:7px;font-size:13px}

.hero{
  width:var(--shell);margin:18px auto 0;min-height:390px;border-radius:18px;overflow:hidden;
  display:grid;grid-template-columns:40% 60%;background:white;border:1px solid var(--line);
}
.hero-copy{padding:38px 44px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.kicker{
  text-transform:uppercase;letter-spacing:.14em;font-weight:850;font-size:10px;
  color:var(--red);margin-bottom:15px;
}
.hero h1,.category-hero h1{
  font-family:Georgia,"Times New Roman",serif;font-weight:400;
  font-size:clamp(42px,4.2vw,62px);line-height:.98;letter-spacing:-.035em;margin:0;
}
.hero-copy p{font-size:15px;line-height:1.55;color:#575757;max-width:460px;margin:17px 0 22px}
.button-row{display:flex;gap:10px;flex-wrap:wrap}
.btn{
  min-height:45px;border-radius:999px;padding:0 21px;display:inline-flex;align-items:center;justify-content:center;
  font-weight:760;font-size:13px;border:1px solid var(--black);transition:.18s ease;cursor:pointer;
}
.btn-primary{background:var(--red);border-color:var(--red);color:white}
.btn-primary:hover{background:var(--red-dark);border-color:var(--red-dark)}
.btn-dark{background:var(--black);color:white}
.btn-dark:hover{background:#2c2c2c}
.btn-light{background:white}
.btn-light:hover{background:#f7f7f7}

.hero-media{position:relative;overflow:hidden;background:#efefed}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 55%;display:block}

.trust-strip{
  width:var(--shell);margin:16px auto 0;display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line);border-radius:14px;overflow:hidden;background:white;
}
.trust-item{padding:15px 19px;border-right:1px solid var(--line)}
.trust-item:last-child{border-right:0}
.trust-item strong{display:block;font-size:12px}
.trust-item span{display:block;color:var(--gray);font-size:11px;margin-top:4px}

.section{width:var(--shell);margin:44px auto}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}
.section-head h2{
  font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,3vw,43px);font-weight:400;margin:0;letter-spacing:-.02em
}
.section-head p{max-width:520px;color:var(--gray);margin:7px 0 0;line-height:1.5;font-size:13px}
.text-link{font-weight:750;font-size:12px;text-decoration:underline;text-underline-offset:4px}

.room-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.room-card{
  min-height:278px;border-radius:16px;padding:23px;display:flex;flex-direction:column;justify-content:flex-end;
  position:relative;overflow:hidden;background:#f4f4f2;border:1px solid #e3e3df;
}
.room-card:before{
  content:"";position:absolute;inset:0;opacity:1;
  background:
    radial-gradient(circle at 75% 22%,rgba(255,255,255,.96),transparent 31%),
    linear-gradient(145deg,var(--card-a),var(--card-b));
}
.room-card:after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--card-accent)}
.room-card .room-art{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.furniture-glyph{width:70%;height:40%;position:relative;opacity:.42}
.furniture-glyph:before,.furniture-glyph:after{content:"";position:absolute;background:#242424}
.furniture-glyph.sofa:before{left:9%;right:9%;height:42%;bottom:15%;border-radius:22px 22px 8px 8px}
.furniture-glyph.sofa:after{left:18%;right:18%;height:38%;bottom:44%;border-radius:22px 22px 4px 4px}
.furniture-glyph.bed:before{left:5%;right:5%;height:40%;bottom:16%;border-radius:6px 6px 14px 14px}
.furniture-glyph.bed:after{left:12%;width:30%;height:65%;bottom:16%;border-radius:18px 18px 5px 5px}
.furniture-glyph.table:before{left:13%;right:13%;height:12%;bottom:45%;border-radius:50%}
.furniture-glyph.table:after{width:10%;height:36%;bottom:12%;left:45%;border-radius:6px}
.furniture-glyph.mattress:before{left:7%;right:7%;height:42%;bottom:19%;border-radius:20px}
.furniture-glyph.mattress:after{left:12%;right:12%;height:5%;bottom:15%;border-radius:4px}
.room-card-content{position:relative;z-index:2}
.room-card h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:27px;margin:0 0 7px}
.room-card p{margin:0 0 14px;color:#555;font-size:12px}
.room-card .room-link{font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}

.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.product-card{min-width:0}
.product-image{aspect-ratio:1.22/1;background:#f2f2ef;border-radius:15px;overflow:hidden;position:relative;margin-bottom:13px}
.product-image img{width:100%;height:100%;object-fit:cover;display:block}
.product-placeholder{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#f4f4f1,#e8e8e2);color:#777;text-align:center;padding:20px;
}
.product-placeholder .shape{width:52%;height:29%;border-radius:22px 22px 7px 7px;background:#c7c7c1;position:relative;margin-bottom:18px}
.product-placeholder .shape:after{content:"";position:absolute;left:14%;right:14%;height:42%;bottom:70%;background:#d6d6d1;border-radius:20px 20px 4px 4px}
.product-placeholder span{font-size:10px;text-transform:uppercase;letter-spacing:.12em}
.product-badge{
  position:absolute;top:11px;left:11px;background:var(--green);color:white;border-radius:999px;padding:7px 9px;
  font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.06em;
}
.product-brand{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--gray);margin-bottom:5px}
.product-name{font-family:Georgia,"Times New Roman",serif;font-size:18px;line-height:1.25;margin:0 0 7px}
.price-row{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.price{font-weight:800}
.compare{color:#999;text-decoration:line-through;font-size:11px}
.from{font-size:10px;color:var(--gray)}

.promo-band{
  background:var(--black);color:white;border-radius:18px;padding:34px 40px;
  display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center;border-bottom:6px solid var(--red);
}
.promo-band h2{font-family:Georgia,"Times New Roman",serif;font-size:38px;font-weight:400;margin:0}
.promo-band p{color:#d0d0d0;line-height:1.55;margin:12px 0 0;font-size:13px}
.promo-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.promo-band .btn-light{border-color:white;color:white;background:transparent}
.promo-band .btn-light:hover{background:white;color:var(--black)}

.store-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.store-card{border:1px solid var(--line);border-radius:16px;padding:27px;background:white;border-top:4px solid var(--green)}
.store-card h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:27px;margin:0 0 8px}
.store-card p{color:var(--gray);line-height:1.55;font-size:13px}
.store-meta{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding-top:15px;margin-top:19px;font-size:11px}

.category-hero{width:var(--shell);margin:36px auto 26px;padding:38px 0 24px;border-bottom:1px solid var(--line)}
.category-hero p{color:var(--gray);font-size:15px;max-width:700px;line-height:1.55}
.category-chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:21px}
.category-chip{border:1px solid var(--line);border-radius:999px;padding:9px 13px;font-size:11px;background:white;cursor:pointer}
.category-chip:hover{border-color:#888}
.catalog-toolbar{width:var(--shell);margin:0 auto 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.result-count{font-size:11px;color:var(--gray)}
.toolbar-actions{display:flex;gap:8px}
.toolbar-button{border:1px solid var(--line);background:white;border-radius:999px;padding:9px 13px;font-size:11px}
.catalog-wrap{width:var(--shell);margin:0 auto 65px}
.catalog-wrap .product-grid{grid-template-columns:repeat(4,1fr)}

.product-page{width:var(--shell);margin:40px auto 75px;display:grid;grid-template-columns:1.15fr .85fr;gap:52px}
.product-gallery{background:#f1f1ee;border-radius:20px;min-height:590px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.product-gallery img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.product-gallery .product-placeholder{position:absolute}
.product-info{padding-top:15px}
.crumbs{font-size:10px;color:var(--gray);margin-bottom:21px}
.product-info h1{font-family:Georgia,"Times New Roman",serif;font-size:42px;font-weight:400;line-height:1.04;letter-spacing:-.025em;margin:0}
.product-info .product-brand{margin-top:12px}
.product-info .price-row{font-size:21px;margin:21px 0 10px}
.product-description{font-size:14px;line-height:1.65;color:#555;border-top:1px solid var(--line);padding-top:21px;margin-top:21px}
.info-card{border:1px solid var(--line);border-radius:13px;padding:15px;margin-top:14px}
.info-card strong{display:block;font-size:12px;margin-bottom:5px}
.info-card span{font-size:11px;color:var(--gray)}

.empty-state{width:var(--shell);margin:70px auto 110px;text-align:center;padding:60px 20px;background:var(--offwhite);border-radius:18px}
.empty-state h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:44px;margin:0}
.empty-state p{color:var(--gray);max-width:600px;margin:13px auto 23px;line-height:1.55}

.footer{background:var(--black);color:#efefef;padding:52px 0 24px;border-top:5px solid var(--red)}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:42px}
.footer h3{font-size:12px;text-transform:uppercase;letter-spacing:.1em;margin:0 0 13px}
.footer p{font-size:12px;line-height:1.65;color:#aaa;margin:0 0 9px}
.footer a{font-size:12px;text-decoration:underline;text-underline-offset:3px}
.footer-brand{font-weight:900;letter-spacing:.06em;margin-bottom:13px}
.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid #333;margin-top:40px;padding-top:20px;color:#777;font-size:10px}

.search-panel,.mobile-drawer{position:fixed;inset:0;z-index:100;background:rgba(10,10,10,.48);backdrop-filter:blur(5px)}
.search-dialog{background:white;width:min(900px,calc(100% - 32px));max-height:75vh;overflow:auto;margin:80px auto 0;border-radius:18px;box-shadow:var(--shadow);padding:21px}
.search-top{display:flex;gap:10px}
.search-top input{flex:1;height:48px;border:1px solid var(--line);border-radius:999px;padding:0 19px;outline:none}
.search-top input:focus{border-color:#777}
.close-button{border:0;background:transparent;cursor:pointer;font-weight:750;font-size:11px}
.search-results{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:18px}
.search-result{display:flex;gap:13px;padding:13px;border:1px solid var(--line);border-radius:12px;cursor:pointer}
.search-thumb{width:72px;height:60px;border-radius:8px;background:var(--offwhite)}
.search-result strong{display:block;font-family:Georgia,"Times New Roman",serif;font-weight:400}
.search-result span{font-size:10px;color:var(--gray);display:block;margin-top:4px}

.mobile-drawer{background:white}
.drawer-top{height:70px;display:flex;justify-content:space-between;align-items:center;padding:0 20px;border-bottom:1px solid var(--line)}
.drawer-brand{font-size:12px;font-weight:900;letter-spacing:.05em}
.drawer-links{padding:18px}
.drawer-section{border-bottom:1px solid var(--line);padding:11px 0}
.drawer-section>a,.drawer-section>button{display:block;width:100%;text-align:left;border:0;background:none;padding:9px 0;font-weight:780}
.drawer-sub{display:flex;flex-wrap:wrap;gap:8px 14px;padding:0 0 9px}
.drawer-sub a{font-size:11px;color:var(--gray)}

@media (max-width:1100px){
  :root{--shell:min(100% - 34px,1420px)}
  .main-header{grid-template-columns:auto 1fr auto;gap:24px}
  .search-launch{min-width:0}
  .nav-inner{gap:20px}
  .room-grid,.product-grid,.catalog-wrap .product-grid{grid-template-columns:repeat(2,1fr)}
  .hero{grid-template-columns:1fr 1.08fr;min-height:430px}
  .hero-copy{padding:42px 33px}
}
@media (max-width:780px){
  :root{--shell:calc(100% - 28px)}
  .topbar-inner{justify-content:center}.topbar-right{display:none}
  .utility-bar,.primary-nav,.search-launch{display:none}
  .main-header{grid-template-columns:42px 1fr auto;padding:13px 0;gap:8px}
  .mobile-menu-button,.search-mobile{display:block}
  .brand{min-width:0;justify-content:center;height:44px}
  .brand-logo{max-width:180px;max-height:42px}
  .brand-main{font-size:14px}.brand-sub{font-size:10px}
  .header-actions{gap:2px}.header-actions .text-icon:nth-of-type(2),.header-actions .text-icon:nth-of-type(3){display:none}
  .hero{width:100%;margin-top:0;border-radius:0;border-left:0;border-right:0;grid-template-columns:1fr;min-height:0}
  .hero-copy{padding:41px 24px 38px;order:2}
  .hero-media{height:295px;order:1}
  .hero h1{font-size:44px}
  .trust-strip{grid-template-columns:1fr 1fr}
  .trust-item:nth-child(2){border-right:0}
  .trust-item:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .section{margin:48px auto}
  .section-head{align-items:flex-start;flex-direction:column}
  .room-grid{grid-template-columns:1fr 1fr}
  .room-card{min-height:265px;padding:19px}
  .room-card h3{font-size:23px}
  .product-grid,.catalog-wrap .product-grid{grid-template-columns:1fr 1fr;gap:22px 11px}
  .promo-band{grid-template-columns:1fr;padding:29px 24px}
  .promo-actions{justify-content:flex-start}
  .store-grid{grid-template-columns:1fr}
  .product-page{grid-template-columns:1fr;gap:26px;margin-top:18px}
  .product-gallery{min-height:380px}
  .product-info h1{font-size:37px}
  .footer-grid{grid-template-columns:1fr 1fr}
  .search-results{grid-template-columns:1fr}
}
@media (max-width:480px){
  .room-grid{grid-template-columns:1fr}
  .product-grid,.catalog-wrap .product-grid{grid-template-columns:1fr 1fr}
  .product-name{font-size:15px}.product-brand{font-size:8px}.price{font-size:12px}.compare{font-size:9px}
  .footer-grid{grid-template-columns:1fr}
}


/* ==========================================================
   WEBSITE STUDIO — STAGE 2 PREVIEW
   Configuration prototype only. No ERP writes.
   ========================================================== */
.studio-link{color:#fff;font-weight:800}
.studio-shell{min-height:calc(100vh - 180px);background:#f4f5f3;padding:24px 0 50px}
.studio-layout{
  width:min(1500px,calc(100% - 32px));margin:0 auto;
  display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px
}
.studio-sidebar{
  background:#111;color:#fff;border-radius:16px;padding:18px 12px;align-self:start;
  position:sticky;top:18px
}
.studio-brand{padding:4px 10px 18px;border-bottom:1px solid #333;margin-bottom:10px}
.studio-brand strong{display:block;font-size:15px}
.studio-brand span{display:block;color:#9e9e9e;font-size:10px;margin-top:5px}
.studio-nav{display:flex;flex-direction:column;gap:4px}
.studio-nav button{
  border:0;background:transparent;color:#d6d6d6;text-align:left;padding:11px 12px;
  border-radius:10px;cursor:pointer;font-size:12px;font-weight:700
}
.studio-nav button:hover,.studio-nav button.active{background:#272727;color:#fff}
.studio-nav .commerce-divider{
  margin:12px 10px 5px;color:#7f7f7f;font-size:9px;font-weight:850;
  text-transform:uppercase;letter-spacing:.12em
}

.studio-main{min-width:0}
.studio-top{
  display:flex;justify-content:space-between;gap:18px;align-items:center;
  background:#fff;border:1px solid #ddd;border-radius:16px;padding:18px 20px;margin-bottom:16px
}
.studio-top h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:29px;margin:0}
.studio-top p{margin:5px 0 0;color:#70706b;font-size:11px}
.studio-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.studio-pill{
  border:1px solid #d6d6d1;background:#fff;border-radius:999px;padding:8px 11px;
  font-size:10px;font-weight:800
}
.studio-pill.readonly{border-color:#b8d6c3;background:#eef8f1;color:#147a43}
.studio-btn{
  border:1px solid #111;border-radius:999px;background:#111;color:#fff;
  min-height:38px;padding:0 16px;font-size:11px;font-weight:800;cursor:pointer
}
.studio-btn.secondary{background:#fff;color:#111;border-color:#ccc}
.studio-btn.red{background:#c61f2d;border-color:#c61f2d}
.studio-btn:disabled{opacity:.45;cursor:not-allowed}

.studio-panel{
  background:#fff;border:1px solid #ddd;border-radius:16px;padding:20px;margin-bottom:16px
}
.studio-panel h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:24px;margin:0}
.studio-panel .panel-sub{color:#74746f;font-size:11px;margin-top:6px;line-height:1.5}
.studio-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.studio-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}

.theme-card{
  border:1px solid #ddd;border-radius:14px;overflow:hidden;background:#fff;position:relative
}
.theme-preview{aspect-ratio:1.6/1;background:#f0f0ed;padding:14px;display:flex;flex-direction:column;gap:8px}
.theme-preview .mini-header{height:12px;border-radius:999px;background:#111;width:100%}
.theme-preview .mini-hero{flex:1;border-radius:9px;background:linear-gradient(135deg,#fff 0 42%,#dcdcd5 42% 100%);position:relative}
.theme-preview .mini-hero:after{content:"";position:absolute;left:9%;bottom:14%;width:27%;height:8%;border-radius:999px;background:#c61f2d}
.theme-preview.showroom .mini-hero{background:linear-gradient(135deg,#eee9e1,#beb7ab)}
.theme-preview.bold .mini-hero{background:linear-gradient(135deg,#111 0 47%,#c61f2d 47% 100%)}
.theme-preview.classic .mini-hero{background:linear-gradient(135deg,#f4efe7,#d7c6ae)}
.theme-meta{padding:14px}
.theme-meta-row{display:flex;justify-content:space-between;gap:10px;align-items:center}
.theme-meta strong{font-size:13px}
.theme-meta p{font-size:10px;color:#777;margin:7px 0 0;line-height:1.5}
.theme-live{font-size:9px;background:#e9f4ed;color:#147a43;border-radius:999px;padding:5px 7px;font-weight:850}
.theme-buttons{display:flex;gap:7px;margin-top:12px}
.theme-buttons button{border:1px solid #ccc;background:#fff;border-radius:999px;padding:7px 10px;font-size:9px;font-weight:800;cursor:pointer}
.theme-buttons button.primary{background:#111;color:#fff;border-color:#111}

.editor-layout{display:grid;grid-template-columns:350px minmax(0,1fr);gap:14px;margin-top:18px}
.editor-settings,.editor-preview{border:1px solid #ddd;border-radius:14px;background:#fafafa;overflow:hidden}
.editor-settings{padding:12px}
.editor-preview{padding:12px;min-height:580px}
.section-list{display:flex;flex-direction:column;gap:7px}
.section-row{
  border:1px solid #ddd;background:white;border-radius:10px;padding:11px;
  display:grid;grid-template-columns:26px 1fr auto;gap:8px;align-items:center
}
.drag-handle{color:#999;font-weight:900;cursor:grab}
.section-row strong{font-size:11px}
.section-row span{display:block;color:#888;font-size:9px;margin-top:3px}
.section-toggle{width:35px;height:20px;background:#147a43;border-radius:999px;position:relative}
.section-toggle:after{content:"";position:absolute;width:16px;height:16px;background:#fff;border-radius:50%;right:2px;top:2px}
.add-section{margin-top:9px;border:1px dashed #bbb;background:#fff;border-radius:10px;padding:10px;width:100%;font-size:10px;font-weight:800;cursor:pointer}
.preview-frame{
  min-height:550px;background:#fff;border-radius:11px;border:1px solid #ddd;overflow:hidden;
  display:flex;flex-direction:column
}
.preview-bar{height:25px;background:#111}
.preview-nav{height:44px;border-bottom:1px solid #ddd;display:flex;align-items:center;padding:0 18px;gap:18px}
.preview-logo{width:90px;height:13px;background:#111;border-radius:3px}
.preview-search{height:24px;flex:1;max-width:260px;border:1px solid #ccc;border-radius:999px}
.preview-hero{display:grid;grid-template-columns:42% 58%;min-height:210px;border-bottom:1px solid #ddd}
.preview-hero-copy{padding:28px}
.preview-hero-copy .line1{width:75%;height:23px;background:#111;margin-bottom:9px}
.preview-hero-copy .line2{width:58%;height:23px;background:#111;margin-bottom:16px}
.preview-hero-copy .copy{width:78%;height:8px;background:#bbb;margin-bottom:6px}
.preview-hero-copy .button{width:85px;height:25px;background:#c61f2d;border-radius:999px;margin-top:16px}
.preview-hero-photo{background:linear-gradient(140deg,#e8e8e2,#c7c7bd);position:relative}
.preview-hero-photo:after{content:"";position:absolute;left:18%;right:15%;bottom:20%;height:37%;background:#222;border-radius:30px 30px 12px 12px}
.preview-section-title{height:13px;width:150px;background:#222;margin:24px 18px 13px}
.preview-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 18px 20px}
.preview-card{height:90px;background:#eee;border-radius:8px;border-bottom:4px solid #147a43}

.menu-builder{margin-top:18px;border:1px solid #ddd;border-radius:14px;overflow:hidden}
.menu-row{
  display:grid;grid-template-columns:30px 1.2fr 1fr 90px;gap:10px;align-items:center;
  padding:12px 14px;border-bottom:1px solid #eee;background:#fff
}
.menu-row:last-child{border-bottom:0}
.menu-row .handle{color:#999;font-weight:900}
.menu-label{font-size:12px;font-weight:800}
.menu-target{font-size:10px;color:#777}
.menu-visibility{font-size:9px;font-weight:850;color:#147a43;text-align:right}
.menu-child{padding-left:42px;background:#fafafa}

.pricing-standard{
  border:1px solid #d9d9d4;border-radius:14px;padding:16px;margin-top:18px;
  display:flex;justify-content:space-between;gap:20px;align-items:center;background:#fafafa
}
.pricing-standard strong{font-size:13px}
.pricing-standard span{display:block;color:#777;font-size:10px;margin-top:4px}
.company-table{margin-top:16px;border:1px solid #ddd;border-radius:14px;overflow:hidden}
.company-row{
  display:grid;grid-template-columns:minmax(180px,1.5fr) 110px 110px minmax(160px,1fr) 145px;
  gap:10px;align-items:center;padding:12px 14px;border-bottom:1px solid #eee;background:#fff
}
.company-row:last-child{border-bottom:0}
.company-row.header{background:#f5f5f2;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#777}
.company-name strong{font-size:11px}
.company-name span{display:block;color:#888;font-size:9px;margin-top:3px}
.control-switch{display:inline-flex;align-items:center;gap:7px;font-size:10px;font-weight:800}
.switch-ui{width:34px;height:19px;border-radius:999px;background:#bbb;position:relative;display:inline-block}
.switch-ui:after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff}
.switch-ui.on{background:#147a43}
.switch-ui.on:after{left:17px}
.price-rule{font-size:10px;font-weight:750}
.readiness{font-size:9px;color:#666}
.readiness strong{color:#147a43}
.catalog-note{
  margin-top:14px;border-left:4px solid #147a43;background:#eff7f1;padding:12px 14px;
  border-radius:0 10px 10px 0;font-size:10px;line-height:1.6;color:#51514e
}

.studio-empty{padding:50px 20px;text-align:center;color:#777}
.studio-empty h2{font-family:Georgia,"Times New Roman",serif;color:#111;font-weight:400}

@media(max-width:950px){
  .studio-layout{grid-template-columns:1fr}
  .studio-sidebar{position:static}
  .studio-nav{display:grid;grid-template-columns:repeat(3,1fr)}
  .studio-nav .commerce-divider{grid-column:1/-1}
  .editor-layout{grid-template-columns:1fr}
  .studio-grid-3{grid-template-columns:1fr 1fr}
  .company-row{grid-template-columns:1fr 90px 90px}
  .company-row>:nth-child(4),.company-row>:nth-child(5){display:none}
}
@media(max-width:650px){
  .studio-grid-2,.studio-grid-3{grid-template-columns:1fr}
  .studio-top{align-items:flex-start;flex-direction:column}
  .studio-nav{grid-template-columns:1fr 1fr}
  .menu-row{grid-template-columns:24px 1fr 70px}
  .menu-target{display:none}
}


/* ==========================================================
   WEBSITE STUDIO — STAGE 3 PERSISTENT CONFIGURATION
   D1-backed draft/publish/versioning. ERP remains untouched.
   ========================================================== */
:root{
  --studio-border:#d9d9d5;
  --studio-muted:#74746f;
}
body.theme-showroom{background:#f7f3ed}
body.theme-showroom .hero{background:#efe9df}
body.theme-showroom .hero h1,
body.theme-showroom .section h2,
body.theme-showroom .category-hero h1{font-family:Georgia,"Times New Roman",serif}
body.theme-bold .hero-copy{background:#111;color:#fff}
body.theme-bold .hero-copy .kicker{color:#ef5b66}
body.theme-bold .hero-copy p{color:#dedede}
body.theme-bold .section-head h2{font-weight:850}
body.theme-classic{background:#fbf8f3}
body.theme-classic .hero{background:#f1e9dc}
body.theme-classic .btn-primary{background:#9f1b26;border-color:#9f1b26}
body.theme-classic .section h2,
body.theme-classic .hero h1{font-family:Georgia,"Times New Roman",serif}

.hero.hero-position-center .hero-copy{text-align:center;align-items:center}
.hero.hero-position-right .hero-copy{text-align:right;align-items:flex-end}
.hero.hero-compact{min-height:320px}
.hero.hero-standard{min-height:390px}
.hero.hero-large{min-height:500px}

.studio-login-card{
  max-width:520px;margin:42px auto;background:#fff;border:1px solid var(--studio-border);
  border-radius:16px;padding:28px
}
.studio-login-card h2{font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:28px;margin:0}
.studio-login-card p{font-size:11px;color:var(--studio-muted);line-height:1.6}
.studio-form-row{display:grid;gap:6px;margin:14px 0}
.studio-form-row label{font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#666}
.studio-input,.studio-select,.studio-textarea{
  width:100%;box-sizing:border-box;border:1px solid #ccc;border-radius:9px;background:#fff;color:#111;
  min-height:38px;padding:9px 11px;font:inherit;font-size:11px
}
.studio-textarea{min-height:86px;resize:vertical}
.studio-status{
  min-height:20px;margin-top:10px;font-size:10px;font-weight:750;color:#555
}
.studio-status.ok{color:#147a43}
.studio-status.err{color:#a51622}
.studio-top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.studio-btn.green{background:#147a43;border-color:#147a43}
.studio-btn.danger{background:#fff;color:#a51622;border-color:#d4a1a6}
.studio-btn.small{min-height:31px;padding:0 11px;font-size:9px}
.studio-btn[aria-busy="true"]{opacity:.55;pointer-events:none}
.studio-auth-name{font-size:9px;color:#6d6d68}

.section-row[draggable="true"]{cursor:grab}
.section-row.dragging{opacity:.45}
.section-row.drop-target{outline:2px solid #147a43}
.section-row-controls{display:flex;gap:6px;align-items:center}
.section-toggle-button{
  width:38px;height:22px;border:0;border-radius:999px;background:#bbb;position:relative;cursor:pointer
}
.section-toggle-button:after{
  content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#fff;top:2px;left:2px
}
.section-toggle-button.on{background:#147a43}
.section-toggle-button.on:after{left:18px}
.section-settings{
  margin-top:14px;padding:14px;border:1px solid #ddd;border-radius:12px;background:#fff
}
.section-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.section-settings-grid .wide{grid-column:1/-1}
.section-save-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}

.nav-editor{display:flex;flex-direction:column}
.nav-edit-row{
  display:grid;grid-template-columns:28px minmax(130px,1.2fr) minmax(150px,1.3fr) 90px 56px;
  gap:8px;align-items:center;padding:10px 12px;border-bottom:1px solid #eee;background:#fff
}
.nav-edit-row.child{padding-left:38px;background:#fafafa}
.nav-edit-row .studio-input{min-height:34px;padding:7px 9px}
.nav-edit-row .nav-move{display:flex;gap:3px}
.mini-icon-btn{
  border:1px solid #ccc;background:#fff;border-radius:7px;min-width:25px;height:27px;cursor:pointer;font-size:10px
}
.visible-check{display:flex;gap:6px;align-items:center;font-size:9px;font-weight:800}
.nav-editor-head{
  display:grid;grid-template-columns:28px minmax(130px,1.2fr) minmax(150px,1.3fr) 90px 56px;
  gap:8px;padding:9px 12px;background:#f5f5f2;font-size:8px;font-weight:850;text-transform:uppercase;
  letter-spacing:.08em;color:#777
}

.pricing-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.company-row.editable{grid-template-columns:minmax(180px,1.4fr) 105px 105px minmax(180px,1fr) 145px}
.company-row .studio-select{min-height:34px;padding:6px 8px}
.control-switch-button{
  display:inline-flex;align-items:center;gap:7px;border:0;background:transparent;padding:0;cursor:pointer;
  font-size:9px;font-weight:800;color:#111
}

.publish-summary{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px
}
.publish-stat{border:1px solid #ddd;border-radius:12px;padding:14px;background:#fafafa}
.publish-stat span{display:block;font-size:9px;color:#777;text-transform:uppercase;letter-spacing:.08em;font-weight:800}
.publish-stat strong{display:block;font-size:14px;margin-top:6px}
.version-table{margin-top:16px;border:1px solid #ddd;border-radius:12px;overflow:hidden}
.version-row{
  display:grid;grid-template-columns:70px 1fr 150px 115px;gap:10px;align-items:center;
  padding:11px 13px;border-bottom:1px solid #eee;font-size:10px
}
.version-row:last-child{border-bottom:0}
.version-row.head{background:#f5f5f2;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:850;color:#777}
.version-empty{padding:22px;color:#777;font-size:10px}

.studio-warning{
  border-left:4px solid #c61f2d;background:#fff1f2;padding:12px 14px;border-radius:0 10px 10px 0;
  margin-top:14px;font-size:10px;line-height:1.6;color:#555
}
.studio-note{
  border-left:4px solid #147a43;background:#eff7f1;padding:12px 14px;border-radius:0 10px 10px 0;
  margin-top:14px;font-size:10px;line-height:1.6;color:#51514e
}

.price-presentation{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}
.check-card{
  border:1px solid #ddd;border-radius:10px;padding:10px;display:flex;gap:8px;align-items:center;
  font-size:10px;font-weight:750;background:#fff
}

@media(max-width:950px){
  .company-row.editable{grid-template-columns:1fr 95px 95px}
  .company-row.editable>:nth-child(4),.company-row.editable>:nth-child(5){display:none}
  .nav-edit-row,.nav-editor-head{grid-template-columns:24px 1fr 80px}
  .nav-edit-row>:nth-child(3),.nav-edit-row>:nth-child(5),
  .nav-editor-head>:nth-child(3),.nav-editor-head>:nth-child(5){display:none}
  .publish-summary{grid-template-columns:1fr}
}
@media(max-width:650px){
  .section-settings-grid,.pricing-controls,.price-presentation{grid-template-columns:1fr}
  .section-settings-grid .wide{grid-column:auto}
  .version-row{grid-template-columns:55px 1fr 85px}
  .version-row>:nth-child(3){display:none}
}
