:root{
  --ink:#2c2b31;
  --ink-strong:#29282e;
  --text:#55555c;
  --muted:#747479;
  --line:#dddeda;
  --line-strong:#c9cac5;
  --paper:#fff;
  --wash:#f3f3f0;
  --blue:#3158ed;
  --blue-dark:#2649cc;
  --blue-soft:#eef1ff;
  --violet:#3158ed;
  --shadow:0 22px 70px rgba(35,35,40,.09);
  --shadow-soft:0 12px 34px rgba(35,35,40,.07);
  --ease:cubic-bezier(.22,1,.36,1);
}

body{background:#fff;color:var(--text);font-size:16px;line-height:1.75}
.proposal-bar{min-height:42px;padding:8px clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#fff;background:var(--ink);font-size:13px;font-weight:700;line-height:1.5;letter-spacing:.06em}
.proposal-bar a{color:#fff;text-decoration:none}.proposal-bar strong{color:#ffd85a}.proposal-bar span{font-size:12px;letter-spacing:.1em}
.site-header{height:92px}
.family-brand{margin-right:auto;display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}
.family-brand>img{width:112px;height:auto}.family-brand>i{width:1px;height:46px;background:var(--line)}
.family-brand>.family-logo{display:block;width:auto;height:112px;margin:-10px 0 -10px -14px}.family-brand>span{display:grid;line-height:1.2}.family-brand b{font-size:16px;letter-spacing:.08em}.family-brand small{margin-top:4px;color:var(--muted);font-size:11px;white-space:nowrap}
.header-badges span{white-space:nowrap;background:#fff;color:#5f5f65}

.hero.b-hero{width:min(1500px,calc(100% - 64px));min-height:690px;margin:24px auto 52px;padding:0;grid-template-columns:minmax(480px,.98fr) minmax(0,1.02fr);grid-template-rows:1fr auto;gap:18px;border:0;border-radius:0;background:transparent;box-shadow:none}
.hero.b-hero::before{display:none}
.b-hero .hero-copy{align-self:stretch;max-width:none;padding:48px clamp(38px,4vw,66px);display:flex;flex-direction:column;justify-content:center;overflow:hidden;border-radius:34px;background:var(--wash)}
.b-hero .hero-copy::after{position:absolute;right:-72px;bottom:-88px;width:190px;aspect-ratio:1;border:34px solid var(--blue-soft);border-radius:50%;content:"";pointer-events:none}
.b-hero .eyebrow,.b-hero h1,.b-hero .lead,.b-hero .hero-cta{position:relative;z-index:1}
.b-hero .eyebrow{margin-bottom:24px;color:var(--ink);font-size:13px;letter-spacing:.13em}
.b-hero h1{font-size:clamp(36px,3.6vw,48px);font-weight:700;line-height:1.38;letter-spacing:0;line-break:strict;text-wrap:balance}
.b-hero h1>span{margin-bottom:16px;color:var(--ink);font-size:18px;line-height:1.4;letter-spacing:.06em}
.b-hero h1 em{color:var(--blue);font-style:normal}
.b-hero .lead{max-width:34em;margin:27px 0 28px;font-size:17px;line-height:1.85;letter-spacing:.02em}
.b-hero .hero-cta{width:max-content;min-width:0;padding:14px 20px;color:#fff;background:var(--ink);box-shadow:none;white-space:nowrap}
.b-hero .hero-cta:hover{box-shadow:none}
.b-product-grid{position:relative;align-self:stretch;min-height:0;display:grid;grid-template-columns:1.1fr .7fr;grid-template-rows:1fr .7fr;gap:16px}
.b-product{position:relative;overflow:hidden;margin:0;border-radius:32px;background:var(--wash)}
.b-product img{position:absolute;left:50%;top:50%;width:82%;height:82%;object-fit:contain;filter:drop-shadow(0 25px 24px rgba(30,30,30,.1));transform:translate(-50%,-50%);animation:b-float 9s ease-in-out infinite alternate}
.b-product.b-main{grid-row:1/3}.b-product.b-side{background:#e9ecf8}.b-product.b-bottom{background:#f2eee8}.b-product.b-side img{animation-delay:-2.2s}.b-product.b-bottom img{animation-delay:-4s}
.b-spark{position:absolute;width:34px;height:34px;border-radius:50%;background:#ffd85a;animation:b-dot-float 5.8s ease-in-out infinite alternate}.b-spark.b-one{left:5%;top:4%}.b-spark.b-two{right:4%;bottom:4%;background:#ed7261;animation-delay:-2.6s;animation-duration:7.2s}
.b-hero .hero-flow{grid-column:1/-1;border-color:var(--line);background:#fff;box-shadow:none}
.b-hero .hero-flow span{background:var(--blue-soft)}

.simulator{margin-bottom:64px}.preview-card,.control-panel{border-color:var(--line);border-radius:30px}.canvas-shell{background:#eceeea}.control-section{padding:27px}.section-title h2{font-size:16px}.section-title p{font-size:12px}.drop-main{font-size:14px}.drop-sub{font-size:11px}.field-row label,.field-label{font-size:12px}.segmented button{font-size:11px}.save-button{font-size:14px}.canvas-help{font-size:12px}.guide-heading h2{letter-spacing:0}

@keyframes b-float{to{transform:translate(-50%,calc(-50% - 8px)) rotate(-1deg)}}
@keyframes b-dot-float{to{transform:translate3d(0,-13px,0) scale(1.045)}}

@media(min-width:1051px) and (max-width:1180px){.b-hero h1{font-size:40px}}

@media(max-width:1050px){
  .hero.b-hero{grid-template-columns:1fr;min-height:auto}.b-hero .hero-copy{padding:48px 6vw}.b-product-grid{height:540px}.b-hero .hero-flow{grid-column:1}
}

@media(max-width:760px){
  .proposal-bar{min-height:38px;padding:8px 16px;font-size:12px}.proposal-bar span{display:none}
  .site-header{height:76px}.family-brand{gap:9px}.family-brand>img{width:84px}.family-brand>i{height:30px}.family-brand b{font-size:13px}.family-brand small{font-size:9px}.family-brand>.family-logo{height:80px;margin:-4px 0 -4px -10px}
  .header-badges span{font-size:10px;padding:6px 9px}
  .hero.b-hero{width:calc(100% - 24px);padding:0;gap:12px;border-radius:0}.b-hero .hero-copy{padding:36px 22px;border-radius:26px}.b-hero .hero-copy::after{right:-98px;bottom:-104px}
  .b-hero h1{font-size:clamp(30px,8vw,36px);line-height:1.42}.b-hero h1>span{margin-bottom:12px;font-size:14px}.b-hero .lead{font-size:15px;line-height:1.8}.b-hero .hero-cta{width:min(100%,240px)}
  .b-product-grid{height:420px;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.b-product{border-radius:22px}.b-product.b-main{grid-row:1}.b-product.b-bottom{grid-column:1/3}.b-product img{width:76%;height:76%}
  .b-hero .hero-flow{grid-column:1}.section-title h2{font-size:16px}.section-title p{font-size:12px}.drop-sub{font-size:10px}
}

@media(max-width:480px){.header-badges{display:none}}
@media(max-width:430px){
  .family-brand small{display:none}.family-brand>.family-logo{height:70px;margin:-2px 0 -2px -8px}.header-badges span{font-size:9px}.b-product-grid{height:360px}.b-hero h1{font-size:clamp(28px,8.2vw,34px)}
}

@media(prefers-reduced-motion:reduce){.b-product img,.b-spark{animation:none}}
