.models-hero {
  position: relative;
  overflow: hidden;
  padding: 88px 0 80px;
}
.models-hero::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(99, 243, 210, .55), rgba(164, 137, 255, .4), transparent);
  content: "";
}
.models-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(390px, .98fr);
  gap: 54px;
  align-items: center;
}
.models-hero-copy { position: relative; z-index: 1; }
.models-hero h1 {
  max-width: 720px;
  margin: 0;
  color: var(--white);
  font-size: clamp(46px, 6vw, 72px);
  font-weight: 950;
  letter-spacing: -.065em;
  line-height: .99;
}
.models-hero h1 .gradient-text {
  background: linear-gradient(100deg, var(--cyan-soft), var(--lime) 56%, var(--blue));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.models-hero .lead { max-width: 650px; }
.models-proof {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 26px;
  color: var(--muted-strong);
  font-size: 13px;
}
.proof-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--lime); box-shadow: 0 0 15px rgba(199,255,94,.62); }
.models-hero-art { position: relative; display: grid; min-height: 430px; place-items: center; isolation: isolate; }
.orbit { position: absolute; z-index: -1; border: 1px solid rgba(99,243,210,.13); border-radius: 50%; pointer-events: none; }
.orbit-one { width: 410px; height: 410px; }
.orbit-two { width: 320px; height: 320px; border-color: rgba(164,137,255,.12); }
.hero-window {
  position: relative;
  z-index: 1;
  width: min(100%, 410px);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 23px;
  background: #fff8ed;
  box-shadow: 0 34px 90px rgba(0,0,0,.45), 0 0 80px rgba(99,243,210,.10);
  transform: rotate(2deg);
}
.hero-window-top { display:flex; height:35px; align-items:center; justify-content:space-between; border-bottom:1px solid #eadfce; background:#fffdf9; padding:0 12px; color:#9b8e7b; font-size:9px; }
.hero-window-top span:first-child { display:flex; gap:4px; }
.hero-window-top i, .browser-dots i { width:6px; height:6px; border-radius:50%; background:#ead7c5; }
.hero-window-top i:first-child { background:#f4a897; }
.hero-window-top i:nth-child(2) { background:#edcf79; }
.hero-window-top i:nth-child(3) { background:#9ccea0; }
.hero-window-top b { color:#9b8e7b; font-size:12px; }
.hero-window-body { position:relative; min-height:327px; overflow:hidden; padding:17px 23px 16px; color:#332820; }
.hero-window-brand { display:flex; align-items:center; gap:9px; }
.window-logo { display:grid; width:31px; height:31px; place-items:center; border-radius:10px; background:#c8693b; color:#fff9f0; font-family:Georgia,serif; font-weight:800; }
.hero-window-brand strong,.hero-window-brand small { display:block; line-height:1.15; }
.hero-window-brand strong { font-family:Georgia,serif; font-size:14px; }
.hero-window-brand small { margin-top:3px; color:#a37752; font-size:6px; font-weight:800; letter-spacing:.13em; }
.window-menu { margin-left:auto; color:#826d56; font-size:15px; }
.window-kicker { margin-top:34px; color:#a96742; font-size:7px; font-weight:900; letter-spacing:.15em; }
.hero-window-body h2 { max-width:235px; margin:8px 0 7px; font-family:Georgia,serif; font-size:29px; letter-spacing:-.055em; line-height:.99; }
.hero-window-body p { max-width:215px; margin:0; color:#816e5d; font-size:10px; line-height:1.5; }
.window-button { display:inline-flex; margin-top:14px; border-radius:999px; background:#cc7045; color:#fff; padding:8px 12px; font-size:8px; font-weight:800; }
.bread-art { position:absolute; right:18px; bottom:32px; display:grid; width:116px; height:116px; place-items:center; border-radius:50%; background:#f2dfbd; }
.bread-art::before { position:absolute; width:84px; height:84px; border:1px dashed rgba(151,93,54,.35); border-radius:50%; content:""; }
.bread-art span { position:relative; z-index:1; display:grid; width:77px; height:47px; place-items:center; border:2px solid #d7a56a; border-radius:54% 46% 40% 60% / 57% 55% 45% 43%; background:linear-gradient(160deg,#f1c989,#d59550); color:#9e6034; font-family:Georgia,serif; font-size:39px; line-height:1; transform:rotate(-15deg); box-shadow:0 8px 14px rgba(123,81,42,.18); }
.bread-art i { position:absolute; top:23px; right:13px; width:17px; height:17px; border:3px solid #d57a46; border-radius:50%; background:#fff8ed; }
.bread-art small { position:absolute; bottom:7px; color:#976744; font-family:Georgia,serif; font-size:8px; font-style:italic; }
.window-bottom { position:absolute; right:0; bottom:0; left:0; display:flex; justify-content:space-between; border-top:1px solid #ecdeca; padding:9px 16px; color:#876d52; font-size:7px; }
.window-bottom span:first-child { color:#638054; font-weight:800; }
.hero-note { position:absolute; z-index:2; display:flex; align-items:center; gap:9px; border:1px solid rgba(255,255,255,.14); border-radius:14px; background:rgba(11,16,28,.90); padding:10px 13px; box-shadow:0 16px 36px rgba(0,0,0,.3); backdrop-filter:blur(16px); }
.note-top { top:38px; right:-3px; }
.note-bottom { bottom:40px; left:-10px; }
.note-icon { display:grid; width:29px; height:29px; place-items:center; border:1px solid rgba(99,243,210,.4); border-radius:9px; background:rgba(99,243,210,.12); color:var(--cyan); font-size:9px; font-weight:950; }
.note-icon-lime { border-color:rgba(199,255,94,.4); background:rgba(199,255,94,.1); color:var(--lime); }
.hero-note strong,.hero-note small { display:block; }
.hero-note strong { color:var(--white); font-size:10px; }
.hero-note small { margin-top:2px; color:var(--muted); font-size:8px; }
.hero-spark { position:absolute; z-index:2; color:var(--lime); font-size:24px; }
.spark-one { top:89px; left:24px; }
.spark-two { right:32px; bottom:100px; color:var(--purple); font-size:18px; }
.model-intro-strip { border-top:1px solid rgba(195,224,255,.09); border-bottom:1px solid rgba(195,224,255,.09); background:rgba(255,255,255,.025); }
.model-intro-strip .container { display:flex; min-height:72px; align-items:center; justify-content:space-between; gap:20px; }
.strip-label { color:var(--muted-strong); font-size:12px; font-weight:800; }
.strip-tags { display:flex; flex-wrap:wrap; gap:8px; }
.strip-tags span { border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.035); color:var(--muted); padding:6px 11px; font-size:10px; font-weight:800; }
.model-gallery { padding-top:94px; }
.models-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:28px; text-align:left; }
.models-section-head > div { max-width:740px; }
.models-section-head p { max-width:670px; }
.gallery-count { flex:0 0 auto; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.035); color:var(--muted); padding:9px 13px; font-size:11px; }
.gallery-count strong { color:var(--cyan); font-size:14px; }
.model-filters { display:flex; flex-wrap:wrap; gap:9px; margin:30px 0 26px; }
.filter-chip { display:inline-flex; min-height:40px; align-items:center; gap:9px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.04); color:var(--muted-strong); padding:8px 14px; font-size:12px; font-weight:800; cursor:pointer; transition:border-color 180ms ease,background 180ms ease,color 180ms ease,transform 180ms ease; }
.filter-chip:hover { border-color:var(--line-strong); color:var(--white); transform:translateY(-1px); }
.filter-chip.is-active { border-color:rgba(99,243,210,.5); background:rgba(99,243,210,.12); color:var(--cyan-soft); }
.filter-chip span { display:grid; min-width:20px; height:20px; place-items:center; border-radius:50%; background:rgba(255,255,255,.09); color:var(--muted); font-size:9px; }
.models-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.model-card { min-width:0; overflow:hidden; border:1px solid rgba(195,224,255,.13); border-radius:20px; background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025)); box-shadow:0 22px 55px rgba(0,0,0,.18); transition:border-color 200ms ease,transform 200ms ease,box-shadow 200ms ease; }
.model-card:hover { border-color:rgba(99,243,210,.38); box-shadow:0 26px 65px rgba(0,0,0,.27),0 0 40px rgba(99,243,210,.045); transform:translateY(-4px); }
.model-card[hidden] { display:none; }
.model-screenshot { position:relative; display:block; aspect-ratio:16/9; overflow:hidden; background:#e9edf1; }
.model-screenshot img { display:block; width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform 350ms ease; }
.model-card:hover .model-screenshot img,.model-screenshot:focus-visible img { transform:scale(1.025); }
.model-screenshot::after { position:absolute; inset:45% 0 0; background:linear-gradient(transparent,rgba(7,10,18,.6)); content:""; pointer-events:none; }
.model-screenshot-label { position:absolute; z-index:1; right:13px; bottom:12px; border:1px solid rgba(255,255,255,.35); border-radius:999px; background:rgba(7,10,18,.78); color:#fff; padding:6px 10px; font-size:9px; font-weight:900; letter-spacing:.05em; backdrop-filter:blur(8px); }
.model-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:9px; margin-top:14px; }
.model-actions .model-cta { margin-top:0; }
.demo-open { display:inline-flex; align-items:center; gap:7px; border:1px solid rgba(99,243,210,.34); border-radius:999px; background:rgba(99,243,210,.075); color:var(--cyan-soft); padding:8px 11px; font-size:10px; font-weight:900; transition:background 180ms ease,border-color 180ms ease,transform 180ms ease; }
.demo-open:hover,.demo-open:focus-visible { border-color:var(--cyan); background:rgba(99,243,210,.14); transform:translateY(-1px); }
.demo-open span { color:var(--lime); }
.model-card-info { padding:18px 20px 20px; }
.model-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.model-category { color:var(--cyan); font-size:9px; font-weight:950; letter-spacing:.12em; }
.model-number { color:var(--muted); font-size:8px; font-weight:850; letter-spacing:.1em; }
.model-card-info h3 { margin:8px 0 5px; color:var(--white); font-size:19px; font-weight:900; letter-spacing:-.04em; }
.model-card-info p { min-height:45px; margin:0; color:var(--muted); font-size:12px; line-height:1.6; }
.model-cta { display:inline-flex; align-items:center; gap:9px; margin-top:13px; color:var(--cyan-soft); font-size:11px; font-weight:900; }
.model-cta span { transition:transform 180ms ease; }
.model-cta:hover span,.model-cta:focus-visible span { transform:translate(3px,-3px); }
.model-disclaimer { display:flex; gap:10px; margin:22px 0 0; border:1px solid rgba(195,224,255,.1); border-radius:14px; background:rgba(255,255,255,.025); color:var(--muted); padding:13px 15px; font-size:11px; line-height:1.6; }
.model-disclaimer span { color:var(--lime); }
.model-process-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr); gap:60px; align-items:center; }
.model-process-grid h2 { max-width:650px; }
.model-process-grid p { max-width:650px; color:var(--muted-strong); }
.model-process-grid .btn { margin-top:10px; }
.model-process-steps { display:grid; gap:12px; }
.model-process-steps > div { display:flex; align-items:center; gap:15px; border:1px solid var(--line); border-radius:15px; background:rgba(255,255,255,.035); padding:13px 16px; }
.model-process-steps > div > span { display:grid; width:34px; height:34px; flex:0 0 auto; place-items:center; border-radius:11px; background:rgba(99,243,210,.1); color:var(--cyan); font-size:10px; font-weight:950; }
.model-process-steps p { display:grid; gap:3px; margin:0; }
.model-process-steps strong { color:var(--white); font-size:12px; }
.model-process-steps small { color:var(--muted); font-size:10px; }
.model-last-cta { padding-top:20px; }
.model-last-cta .cta-panel { border-color:rgba(99,243,210,.25); }
@media (max-width: 1120px) {
  .models-hero-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .model-process-grid { gap:34px; }
}
@media (max-width: 900px) {
  .models-hero-grid { grid-template-columns:1fr; }
  .models-hero-copy { max-width:760px; }
  .models-hero-art { min-height:390px; }
  .model-process-grid { grid-template-columns:1fr; }
}
@media (max-width: 820px) {
  .models-hero { padding:68px 0 64px; }
  .models-hero-art { width:min(100%,520px); margin:0 auto; }
  .model-intro-strip .container { align-items:flex-start; flex-direction:column; justify-content:center; padding-top:14px; padding-bottom:14px; }
  .models-section-head { align-items:flex-start; flex-direction:column; gap:15px; }
  .model-gallery { padding-top:72px; }
}
@media (max-width: 620px) {
  .models-hero h1 { font-size:43px; }
  .models-hero-art { min-height:340px; }
  .hero-window { width:calc(100% - 28px); }
  .hero-window-body { min-height:292px; padding-inline:17px; }
  .hero-window-body h2 { max-width:205px; font-size:25px; }
  .bread-art { right:10px; width:95px; height:95px; }
  .note-top { top:9px; right:-2px; }
  .note-bottom { bottom:11px; left:0; }
  .models-grid { grid-template-columns:1fr; gap:15px; }
  .model-window { min-height:225px; }
  .demo-bakery-hero,.tire-hero,.shop-hero,.restaurant-hero,.barber-hero,.market-hero,.workshop-hero,.electric-hero { min-height:145px; padding-inline:18px; }
  .model-window h3 { font-size:19px; }
  .models-section-head h2 { font-size:32px; }
  .model-card-info p { min-height:0; }
  .filter-chip { min-height:38px; padding-inline:12px; font-size:11px; }
}
@media (max-width: 380px) {
  .demo-nav { padding-inline:9px; }
  .demo-nav-links { display:none; }
  .demo-nav-cta { margin-left:auto; }
  .tire-art,.shop-display,.plate-art,.barber-art,.market-art,.workshop-art,.electric-art { right:9px; transform:scale(.82); transform-origin:center right; }
  .model-window h3 { font-size:17px; }
  .model-window p { max-width:155px; }
}
@media (prefers-reduced-motion: reduce) {
  .model-card,.filter-chip,.model-cta span { transition:none; }
  .model-card:hover,.filter-chip:hover { transform:none; }
}