.visual-hero { display:grid; grid-template-columns:.86fr 1.14fr; gap:64px; align-items:center; min-height:660px; padding-block:80px; }
.visual-hero>* { min-width:0; }
.visual-hero-copy h1 { margin-bottom:26px; }
.visual-hero-copy>p { max-width:560px; color:var(--muted); font-size:18px; }
.visual-hero em,.visual-detail .label,.pricing-head .label { color:#0956b5; }
.visual-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 23px; margin-top:30px; }
.visual-hero .product-shot img,.visual-detail .product-shot img { border:1px solid var(--line); box-shadow:0 16px 35px rgba(8,24,73,.12); }
.visual-flow { padding-block:105px; background:var(--warm); }
.visual-flow-head,.visual-detail-head,.pricing-head { display:grid; grid-template-columns:1fr .58fr; gap:72px; align-items:end; margin-bottom:45px; }
.visual-flow-head h2,.visual-detail-head h2,.pricing-head h2 { margin:0; }
.visual-flow-head p,.visual-detail-head>p,.pricing-head>p { margin:0; color:var(--muted); font-size:17px; }
.flow-list { border-top:1px solid var(--line); }
.flow-list article { display:grid; grid-template-columns:70px 1fr; gap:25px; padding:27px 0; border-bottom:1px solid var(--line); }
.flow-list article>span { color:#0956b5; font-size:12px; font-weight:800; }
.flow-list h3 { margin:0 0 6px; font-size:clamp(24px,2.8vw,36px); }
.flow-list p { max-width:780px; margin:0; color:var(--muted); }
.visual-detail { padding-block:112px; }
.visual-detail-list { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:40px; }
.visual-detail-list>div { display:grid; gap:8px; padding-top:16px; border-top:2px solid var(--visual-accent); }
.visual-detail-list strong { font:700 20px "Manrope",sans-serif; }
.visual-detail-list span { color:var(--muted); font-size:14px; }
.pricing-section { padding-block:112px; background:var(--warm); }
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.price-plan { position:relative; display:flex; flex-direction:column; min-width:0; padding:29px; border:1px solid var(--line); background:var(--paper); }
.price-plan.featured { border:2px solid var(--accent); }
.plan-recommend { position:absolute; top:-15px; right:22px; padding:6px 11px; background:var(--accent); color:var(--ink); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.price-plan h3 { margin:0 0 4px; font-size:26px; }
.plan-sub { min-height:43px; margin:0; color:var(--muted); font-size:14px; }
.price { margin:18px 0 5px; font-size:15px; font-weight:700; }
.price strong { font:800 clamp(45px,4vw,61px)/1 "Manrope",sans-serif; letter-spacing:-.06em; }
.price span { color:var(--muted); font-size:13px; font-weight:500; }
.plan-note { min-height:61px; margin:8px 0 20px; color:var(--muted); font-size:13px; }
.price-plan ul { display:grid; gap:11px; flex:1; margin:0 0 25px; padding:22px 0 0 18px; border-top:1px solid var(--line); }
.price-plan li { padding-left:2px; font-size:14px; }
.price-plan li::marker { color:var(--accent); }
.price-plan .button { width:100%; }
.button-outline { background:transparent; color:var(--action); }
.button-outline:hover { color:var(--paper); }
.plan-includes { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:34px; padding-top:26px; border-top:1px solid var(--line); }
.plan-includes h3 { margin:0 0 8px; font-size:20px; }
.plan-includes p { max-width:530px; margin:0; color:var(--muted); font-size:14px; }
.demo-dialog { width:min(620px,calc(100% - 32px)); max-height:calc(100vh - 30px); padding:36px; overflow:auto; border:1px solid var(--line); border-radius:9px; background:var(--paper); color:var(--ink); box-shadow:0 30px 90px rgba(30,28,25,.24); }
.demo-dialog::backdrop { background:rgba(25,25,23,.45); }
.demo-dialog h2 { margin:0 0 8px; font-size:34px; }
.demo-dialog p { color:var(--muted); }
.dialog-close-form { position:absolute; top:8px; right:12px; }
.dialog-close { width:44px; height:44px; padding:0; border:0; background:transparent; color:var(--muted); font-size:28px; cursor:pointer; }
.demo-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:27px; }
.demo-form label { display:grid; gap:7px; font-size:13px; font-weight:700; }
.demo-form label:last-of-type,.demo-form .button { grid-column:1/-1; }
.demo-form input,.demo-form select { width:100%; min-width:0; height:49px; padding-inline:13px; border:1px solid var(--line); border-radius:5px; background:var(--paper); color:var(--ink); font-size:16px; }
.dialog-success { text-align:center; padding:35px 0 15px; }
@media(max-width:1100px) {
  .visual-hero { grid-template-columns:1fr; min-height:0; gap:45px; }
  .visual-hero-copy,.visual-hero figure { max-width:870px; }
  .visual-flow-head,.visual-detail-head,.pricing-head { grid-template-columns:1fr; gap:18px; }
  .pricing-grid { grid-template-columns:1fr; max-width:650px; }
  .plan-sub,.plan-note { min-height:0; }
}
@media(max-width:720px) {
  .visual-hero { padding-block:60px 78px; }
  .visual-hero h1 { font-size:clamp(40px,10vw,55px); }
  .visual-hero-copy>p { font-size:16px; }
  .visual-actions { align-items:start; flex-direction:column; }
  .visual-flow,.visual-detail,.pricing-section { padding-block:78px; }
  .flow-list article { grid-template-columns:35px 1fr; gap:12px; }
  .visual-detail-list,.plan-includes { grid-template-columns:1fr; }
  .price-plan { padding:25px; }
  .demo-dialog { padding:34px 20px; }
  .demo-form { grid-template-columns:1fr; }
  .demo-form label:last-of-type,.demo-form .button { grid-column:auto; }
}