
/* ORN BUSINESS DEMO PREVIEW R1 */

.demo-shell{
  max-width:1440px;
}

.demo-top{
  min-height:72px;
}

.demo-heading{
  min-width:0;
}

.demo-heading h1{
  margin:4px 0 2px;
  font-size:25px;
  letter-spacing:-.035em;
}

.demo-heading p{
  margin:0;
  color:var(--m);
  font-size:11px;
}

.demo-page{
  display:grid;
  gap:14px;
}

.demo-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(360px,.88fr);
  gap:20px;
  overflow:hidden;
  padding:30px;
  border:1px solid #DDE5E8;
  border-radius:20px;
  background:
    radial-gradient(circle at 88% 18%,rgba(15,124,128,.14),transparent 27%),
    linear-gradient(110deg,#FFFFFF 0 57%,#EFF8F8 100%);
  box-shadow:0 16px 42px rgba(31,37,43,.055);
}

.demo-hero-copy{
  align-self:center;
  max-width:720px;
}

.demo-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(15,124,128,.18);
  background:#EAF6F6;
  color:#0F7176;
  font-size:9px;
  font-weight:850;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.demo-hero h2{
  max-width:690px;
  margin:13px 0 10px;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.045em;
}

.demo-hero-copy > p{
  max-width:680px;
  margin:0;
  color:#66747C;
  font-size:13px;
  line-height:1.6;
}

.demo-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:20px;
}

.demo-micro{
  display:block;
  margin-top:11px;
  color:#88949A;
  font-size:9px;
  line-height:1.45;
}

.demo-selected{
  margin-top:16px;
  max-width:590px;
  padding:12px 14px;
  border:1px solid #BFDCDC;
  border-radius:12px;
  background:#F3FBFB;
}

.demo-selected span,
.demo-selected small{
  display:block;
}

.demo-selected span{
  color:#718087;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.demo-selected strong{
  display:block;
  margin-top:3px;
  color:#163F45;
  font-size:16px;
}

.demo-selected small{
  margin-top:4px;
  color:#738087;
  font-size:9px;
}

.demo-system-card{
  position:relative;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  padding:20px;
  border:1px solid rgba(15,124,128,.16);
  border-radius:17px;
  background:
    linear-gradient(145deg,rgba(15,124,128,.08),rgba(255,255,255,.78));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    0 12px 30px rgba(31,37,43,.05);
}

.demo-system-kicker{
  margin-bottom:12px;
  color:#0F7C80;
  font-size:9px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.demo-system-task,
.demo-system-result{
  padding:12px 14px;
  border-radius:12px;
}

.demo-system-task{
  background:#1F2B31;
  color:#fff;
}

.demo-system-result{
  border:1px solid rgba(15,124,128,.18);
  background:#fff;
  color:#17383C;
}

.demo-system-task small,
.demo-system-result small{
  display:block;
  margin-bottom:4px;
  opacity:.62;
  font-size:8px;
  letter-spacing:.09em;
}

.demo-system-task strong,
.demo-system-result strong{
  font-size:12px;
}

.demo-system-arrow{
  padding:5px 0;
  text-align:center;
  color:#0F7C80;
  font-size:16px;
}

.demo-system-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}

.demo-system-grid > div{
  min-width:0;
  padding:11px 10px;
  border:1px solid #DDE6E8;
  border-radius:11px;
  background:#fff;
}

.demo-system-grid span{
  display:block;
  color:#0F7C80;
  font-size:8px;
  font-weight:900;
}

.demo-system-grid strong{
  display:block;
  margin-top:5px;
  font-size:11px;
}

.demo-system-grid small{
  display:block;
  margin-top:4px;
  color:#7C898F;
  font-size:8px;
  line-height:1.35;
}

.demo-section,
.demo-categories,
.demo-form{
  border:1px solid #E0E6E8;
  border-radius:17px;
  background:#fff;
  box-shadow:0 10px 30px rgba(31,37,43,.04);
}

.demo-section{
  padding:21px;
}

.demo-section-head h2{
  margin:4px 0 0;
  font-size:20px;
  letter-spacing:-.025em;
}

.demo-section-head.compact h2{
  max-width:720px;
}

.demo-steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
  margin-top:16px;
}

.demo-steps article{
  position:relative;
  min-width:0;
  padding:15px;
  border:1px solid #E4E9EB;
  border-radius:13px;
  background:#FAFBFB;
}

.demo-steps article > span{
  display:block;
  margin-bottom:15px;
  color:#0F7C80;
  font-size:10px;
  font-weight:900;
}

.demo-steps strong{
  display:block;
  font-size:12px;
}

.demo-steps p{
  margin:6px 0 0;
  color:#748087;
  font-size:10px;
  line-height:1.5;
}

.demo-content-grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(380px,.75fr);
  gap:14px;
  align-items:start;
}

.demo-categories{
  padding:21px;
}

.demo-category-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin-top:16px;
}

.demo-category-grid article{
  display:grid;
  grid-template-columns:35px minmax(0,1fr);
  gap:10px;
  align-items:start;
  min-width:0;
  padding:13px;
  border:1px solid #E3E8EA;
  border-radius:12px;
  background:#FBFCFC;
}

.demo-category-grid article > span{
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  border-radius:10px;
  background:#EAF6F6;
  color:#0F7C80;
  font-weight:900;
}

.demo-category-grid strong{
  display:block;
  font-size:11px;
}

.demo-category-grid p{
  margin:4px 0 0;
  color:#78858C;
  font-size:9px;
  line-height:1.45;
}

.demo-note{
  margin-top:11px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #E7ECEE;
  background:#F7F9FA;
  color:#758188;
  font-size:9px;
  line-height:1.45;
}

.demo-form{
  padding:21px;
}

.demo-form-head h2{
  margin:4px 0 5px;
  font-size:20px;
}

.demo-form-head p{
  margin:0 0 15px;
  color:#748087;
  font-size:10px;
  line-height:1.5;
}

.demo-form label{
  display:block;
  margin-top:10px;
}

.demo-form label > span{
  display:block;
  margin-bottom:5px;
  color:#46545B;
  font-size:9px;
  font-weight:800;
}

.demo-form input,
.demo-form textarea{
  width:100%;
  border:1px solid #DDE3E6;
  border-radius:10px;
  background:#fff;
  padding:10px 11px;
  color:#1F252B;
  font:inherit;
  font-size:11px;
  outline:none;
}

.demo-form input:focus,
.demo-form textarea:focus{
  border-color:#8FC4C6;
  box-shadow:0 0 0 3px rgba(15,124,128,.07);
}

.demo-form textarea{
  resize:vertical;
}

.demo-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.demo-submit{
  width:100%;
  margin-top:14px;
}

.demo-preview-notice{
  margin-top:11px;
  padding:11px 12px;
  border:1px solid #BFDCDC;
  border-radius:11px;
  background:#F1FAFA;
}

.demo-preview-notice strong,
.demo-preview-notice span{
  display:block;
}

.demo-preview-notice strong{
  color:#0F6E73;
  font-size:10px;
}

.demo-preview-notice span{
  margin-top:4px;
  color:#66767D;
  font-size:9px;
  line-height:1.45;
}

@media(max-width:1100px){

  .demo-hero{
    grid-template-columns:1fr;
  }

  .demo-system-card{
    max-width:none;
  }

  .demo-content-grid{
    grid-template-columns:1fr;
  }

}

@media(max-width:800px){

  .demo-steps{
    grid-template-columns:repeat(2,1fr);
  }

}

@media(max-width:650px){

  .demo-shell{
    padding:8px;
  }

  .demo-hero{
    padding:20px 17px;
  }

  .demo-hero h2{
    font-size:27px;
  }

  .demo-system-grid{
    grid-template-columns:1fr;
  }

  .demo-steps,
  .demo-category-grid,
  .demo-form-row{
    grid-template-columns:1fr;
  }

  .demo-top{
    align-items:flex-start;
  }

}

/* END ORN BUSINESS DEMO PREVIEW R1 */
/* ORN DEMO SELECTED PRODUCT CARD R1 BEGIN */

.demo-selected{
  display:grid;
  grid-template-columns:118px minmax(0,1fr);
  gap:16px;
  align-items:center;
  max-width:680px;
  padding:14px;
}

.demo-selected.hidden{
  display:none!important;
}

.demo-selected-media{
  width:118px;
  height:104px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid #DCE5E7;
  border-radius:12px;
  background:#FFFFFF;
}

.demo-selected-media img{
  width:100%;
  height:100%;
  padding:7px;
  object-fit:contain;
  object-position:center;
}

.demo-selected-fallback{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:#0F7C80;
  font-size:15px;
  font-weight:900;
  letter-spacing:.04em;
  background:
    radial-gradient(circle at 50% 50%,rgba(15,124,128,.10),transparent 62%),
    #F7FBFB;
}

.demo-selected-body{
  min-width:0;
}

.demo-selected-kicker{
  display:block;
  color:#0F7C80!important;
  font-size:9px!important;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.demo-selected-body strong{
  display:block;
  margin-top:6px;
  color:#1F252B;
  font-size:15px;
  line-height:1.35;
}

.demo-selected-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}

.demo-selected-meta span{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:5px 8px;
  border-radius:999px;
  background:#FFFFFF;
  border:1px solid #D9E4E6;
  color:#536169;
  font-size:9px;
  font-weight:800;
}

.demo-selected-meta span#selectedProductPlatform{
  color:#0F7176;
  border-color:#C4DFE0;
  background:#EAF6F6;
}

.demo-selected-body small{
  display:block;
  margin-top:8px;
  color:#748087;
  font-size:9px;
  line-height:1.45;
}

@media(max-width:650px){
  .demo-selected{
    grid-template-columns:82px minmax(0,1fr);
    gap:11px;
  }

  .demo-selected-media{
    width:82px;
    height:82px;
  }

  .demo-selected-body strong{
    font-size:13px;
  }
}

/* ORN DEMO SELECTED PRODUCT CARD R1 END */
/* ORN BUSINESS DEMO LANDING R2 BEGIN */

.demo-page{
  gap:16px;
}

.demo-hero-r2{
  grid-template-columns:minmax(0,1.05fr) minmax(390px,.78fr);
  gap:24px;
  align-items:start;
  padding:32px;
  background:
    radial-gradient(circle at 8% 8%,rgba(15,124,128,.08),transparent 26%),
    radial-gradient(circle at 92% 14%,rgba(15,124,128,.15),transparent 30%),
    linear-gradient(116deg,#FFFFFF 0 57%,#EEF8F8 100%);
}

.demo-hero-r2 .demo-hero-copy{
  max-width:none;
  align-self:start;
  padding-top:3px;
}

.demo-hero-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,300px);
  gap:18px;
  align-items:start;
}

.demo-hero-intro-copy{
  min-width:0;
}

.demo-hero-visual{
  width:100%;
  aspect-ratio:4/3;
  overflow:hidden;
  border:1px solid #D6E1E3;
  border-radius:15px;
  background:#E9EFF0;
  box-shadow:0 14px 34px rgba(31,37,43,.10);
}

.demo-hero-visual img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.demo-hero-r2 h2{
  max-width:720px;
  font-size:40px;
  line-height:1.04;
}

.demo-lead{
  max-width:680px!important;
  font-size:14px!important;
  line-height:1.65!important;
}

.demo-benefits{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  max-width:680px;
  margin-top:18px;
}

.demo-benefits span{
  min-height:38px;
  display:flex;
  align-items:center;
  padding:9px 11px;
  border:1px solid #DCE7E8;
  border-radius:11px;
  background:rgba(255,255,255,.78);
  color:#415158;
  font-size:10px;
  font-weight:800;
}

.demo-hero-r2 .demo-selected{
  max-width:680px;
  margin-top:15px;
  border-color:#B7D9DB;
  background:rgba(255,255,255,.9);
  box-shadow:0 12px 30px rgba(31,37,43,.055);
}

.demo-hero-r2 .demo-selected-media{
  width:132px;
  height:118px;
}

.demo-creative-strip{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  gap:10px;
  align-items:center;
  max-width:680px;
  margin-top:15px;
  padding:13px;
  border-radius:14px;
  background:#1F2B31;
  color:#fff;
}

.demo-creative-strip > div{
  min-width:0;
}

.demo-creative-strip small,
.demo-creative-strip strong,
.demo-creative-strip span{
  display:block;
}

.demo-creative-strip small{
  color:#68C6C8;
  font-size:8px;
  font-weight:900;
}

.demo-creative-strip strong{
  margin-top:4px;
  font-size:11px;
}

.demo-creative-strip span{
  margin-top:3px;
  color:#AEBABD;
  font-size:8px;
  line-height:1.35;
}

.demo-creative-strip b{
  color:#69C5C8;
  font-size:15px;
}

.demo-form-hero{
  position:sticky;
  top:16px;
  padding:22px;
  border-color:#CFE1E3;
  box-shadow:0 18px 48px rgba(31,37,43,.085);
}

.demo-form-hero .demo-form-head h2{
  font-size:24px;
}

.demo-form-hero .demo-form-head p{
  font-size:10px;
}

.demo-form-hero textarea{
  min-height:0;
}

.demo-form-foot{
  display:block;
  margin-top:8px;
  color:#909A9F;
  font-size:8px;
  line-height:1.4;
}

.demo-audience-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
  margin-top:16px;
}

.demo-audience-grid article{
  min-width:0;
  padding:16px;
  border:1px solid #E2E8EA;
  border-radius:13px;
  background:#FAFBFB;
}

.demo-audience-grid article > span{
  display:block;
  color:#0F7C80;
  font-size:9px;
  font-weight:900;
}

.demo-audience-grid strong{
  display:block;
  margin-top:12px;
  font-size:12px;
}

.demo-audience-grid p{
  margin:6px 0 0;
  color:#748087;
  font-size:9px;
  line-height:1.5;
}

.demo-steps-five{
  grid-template-columns:repeat(5,minmax(0,1fr));
}

.demo-result-section{
  display:grid;
  grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr);
  gap:20px;
  align-items:center;
  background:
    radial-gradient(circle at 90% 20%,rgba(15,124,128,.10),transparent 30%),
    #FFFFFF;
}

.demo-result-copy h2{
  margin:5px 0 8px;
  font-size:24px;
  line-height:1.15;
  letter-spacing:-.03em;
}

.demo-result-copy p{
  margin:0;
  color:#748087;
  font-size:10px;
  line-height:1.55;
}

.demo-result-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}

.demo-result-grid article{
  padding:14px;
  border:1px solid #DFE7E9;
  border-radius:12px;
  background:#FAFBFB;
}

.demo-result-grid article.accent{
  border-color:#BBDCDD;
  background:#EAF6F6;
}

.demo-result-grid span{
  display:block;
  color:#0F7C80;
  font-size:8px;
  font-weight:900;
}

.demo-result-grid strong{
  display:block;
  margin-top:7px;
  font-size:11px;
}

.demo-result-grid small{
  display:block;
  margin-top:4px;
  color:#77848B;
  font-size:8px;
}

.demo-categories{
  padding:21px;
}

.demo-faq-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:16px;
}

.demo-faq-list details{
  min-width:0;
  border:1px solid #E1E7E9;
  border-radius:12px;
  background:#FAFBFB;
  overflow:hidden;
}

.demo-faq-list summary{
  cursor:pointer;
  list-style:none;
  padding:13px 15px;
  color:#27343A;
  font-size:10px;
  font-weight:850;
  line-height:1.4;
}

.demo-faq-list summary::-webkit-details-marker{
  display:none;
}

.demo-faq-list summary::after{
  content:"+";
  float:right;
  margin-left:12px;
  color:#0F7C80;
  font-size:15px;
}

.demo-faq-list details[open] summary::after{
  content:"–";
}

.demo-faq-list details p{
  margin:0;
  padding:0 15px 14px;
  color:#718087;
  font-size:9px;
  line-height:1.55;
}

.demo-final-cta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:24px 26px;
  border-radius:17px;
  background:
    radial-gradient(circle at 85% 15%,rgba(35,168,171,.28),transparent 35%),
    #1F2B31;
  color:#fff;
  box-shadow:0 14px 34px rgba(31,37,43,.12);
}

.demo-final-cta .eyebrow{
  color:#69C6C9;
}

.demo-final-cta h2{
  margin:5px 0 4px;
  font-size:22px;
}

.demo-final-cta p{
  margin:0;
  color:#B8C2C5;
  font-size:10px;
}

.demo-final-cta .btn{
  flex:0 0 auto;
}

@media(max-width:1180px){
  .demo-hero-r2{
    grid-template-columns:1fr;
  }

  .demo-form-hero{
    position:static;
  }

  .demo-audience-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .demo-steps-five{
    grid-template-columns:repeat(3,1fr);
  }
}

@media(max-width:850px){
  .demo-result-section{
    grid-template-columns:1fr;
  }

  .demo-faq-list{
    grid-template-columns:1fr;
  }

  .demo-steps-five{
    grid-template-columns:repeat(2,1fr);
  }
}

@media(max-width:650px){
  .demo-hero-r2{
    padding:20px 17px;
  }

  .demo-hero-r2 h2{
    font-size:29px;
  }

  .demo-hero-intro{
    grid-template-columns:1fr;
    gap:15px;
  }

  .demo-hero-visual{
    max-width:none;
  }

  .demo-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .demo-audience-grid,
  .demo-steps-five{
    grid-template-columns:1fr;
  }

  .demo-creative-strip{
    grid-template-columns:1fr;
  }

  .demo-creative-strip b{
    transform:rotate(90deg);
    justify-self:start;
  }

  .demo-hero-r2 .demo-selected-media{
    width:82px;
    height:82px;
  }

  .demo-result-grid{
    grid-template-columns:1fr;
  }

  .demo-final-cta{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* ORN BUSINESS DEMO LANDING R2 END */

/* ORN BUSINESS DEMO VISUAL READABILITY R4 BEGIN */

/* HERO:
   badge -> title -> lead -> large image -> benefits
   form stays untouched in the right column
*/
.demo-hero-intro{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  align-items:start;
}

.demo-hero-intro-copy{
  max-width:680px;
}

.demo-hero-visual{
  width:100%;
  max-width:680px;
  aspect-ratio:16/9;
  overflow:hidden;
  border:1px solid #D6E1E3;
  border-radius:16px;
  background:#E9EFF0;
  box-shadow:0 14px 34px rgba(31,37,43,.09);
}

.demo-hero-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
}

.demo-benefits{
  max-width:680px;
}

/* Section headings */
.demo-section-head h2{
  font-size:22px;
  line-height:1.18;
}

/* AUDIENCE */
.demo-audience-grid{
  gap:12px;
  margin-top:18px;
}

.demo-audience-grid article{
  padding:18px;
}

.demo-audience-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.demo-audience-icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:11px;
  background:#EAF6F6;
  color:#0F7C80;
}

.demo-audience-icon svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.demo-audience-num{
  color:#0F7C80;
  font-size:10px;
  font-weight:900;
}

.demo-audience-grid strong{
  margin-top:14px;
  font-size:14px;
  line-height:1.3;
}

.demo-audience-grid p{
  margin-top:7px;
  font-size:11px;
  line-height:1.55;
}

/* HOW IT WORKS */
.demo-steps-five{
  gap:12px;
  margin-top:18px;
}

.demo-steps-five article{
  position:relative;
  padding:16px;
}

.demo-steps-five article > span{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  margin-bottom:12px;
  border-radius:50%;
  background:#0F7C80;
  color:#FFFFFF;
  font-size:10px;
  font-weight:900;
  box-shadow:0 5px 14px rgba(15,124,128,.18);
}

.demo-steps-five article > strong{
  display:block;
  font-size:13px;
  line-height:1.3;
}

.demo-steps-five article > p{
  margin-top:7px;
  font-size:10.5px;
  line-height:1.5;
}

/* RESULT */
.demo-result-copy p{
  font-size:12px;
  line-height:1.6;
}

.demo-result-grid span{
  font-size:9px;
}

.demo-result-grid strong{
  font-size:13px;
  line-height:1.35;
}

.demo-result-grid small{
  font-size:10px;
  line-height:1.45;
}

/* CATEGORIES */
.demo-category-grid strong{
  font-size:13px;
  line-height:1.35;
}

.demo-category-grid p{
  font-size:10.5px;
  line-height:1.5;
}

.demo-category-grid article > span{
  width:40px;
  height:40px;
  font-size:16px;
}

.demo-note{
  font-size:10.5px;
  line-height:1.5;
}

/* FAQ */
.demo-faq-list{
  gap:11px;
  margin-top:18px;
}

.demo-faq-list summary{
  padding:16px 17px;
  font-size:13px;
  line-height:1.45;
}

.demo-faq-list summary::after{
  font-size:18px;
}

.demo-faq-list details p{
  padding:0 17px 16px;
  font-size:11.5px;
  line-height:1.6;
}

@media(max-width:1180px){
  .demo-hero-visual{
    max-width:none;
  }
}

@media(max-width:650px){
  .demo-hero-intro{
    gap:15px;
  }

  .demo-hero-visual{
    aspect-ratio:4/3;
    max-width:none;
  }

  .demo-benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .demo-audience-grid{
    grid-template-columns:1fr;
  }

  .demo-audience-grid article{
    padding:16px;
  }

  .demo-steps-five{
    grid-template-columns:1fr;
  }

  .demo-faq-list summary{
    font-size:12.5px;
  }

  .demo-faq-list details p{
    font-size:11px;
  }
}

/* ORN BUSINESS DEMO VISUAL READABILITY R4 END */

/* ORN BUSINESS DEMO LAYOUT R5 BEGIN */

.demo-hero-r2{
  grid-template-columns:minmax(0,1fr) minmax(460px,520px);
  gap:28px;
  align-items:start;
}

.demo-hero-r2 .demo-hero-copy{
  width:100%;
  max-width:none;
  min-width:0;
}

.demo-hero-intro{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  align-items:start;
}

.demo-hero-intro-copy{
  max-width:none;
}

.demo-hero-r2 h2{
  max-width:760px;
  font-size:36px;
  line-height:1.06;
}

.demo-lead{
  max-width:none !important;
}

.demo-hero-visual,
.demo-benefits,
.demo-hero-r2 .demo-selected{
  max-width:none;
}

.demo-hero-visual{
  width:100%;
  aspect-ratio:16/9;
}

.demo-form-hero{
  width:100%;
  max-width:520px;
  justify-self:end;
}

.demo-creative-strip,
.demo-micro{
  display:none !important;
}

@media(max-width:1180px){
  .demo-hero-r2{
    grid-template-columns:1fr;
    gap:20px;
  }

  .demo-form-hero{
    max-width:none;
    justify-self:stretch;
  }
}

@media(max-width:650px){
  .demo-hero-r2 h2{
    font-size:31px;
  }

  .demo-hero-visual{
    aspect-ratio:4/3;
  }
}

/* ORN BUSINESS DEMO LAYOUT R5 END */

/* ORN BUSINESS DEMO LAYOUT R6 BEGIN */

.demo-hero-r2{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:32px;
  align-items:stretch;
}

.demo-hero-r2 .demo-hero-copy{
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
  height:100%;
  padding-top:0;
}

.demo-hero-intro{
  display:flex;
  flex-direction:column;
  gap:18px;
  width:100%;
  height:100%;
}

.demo-hero-intro-copy{
  width:100%;
  max-width:none;
}

.demo-hero-visual{
  width:100%;
  max-width:none;
  margin-top:auto;
  aspect-ratio:16/9;
}

.demo-form-hero{
  position:static;
  top:auto;
  width:100%;
  max-width:none;
  height:100%;
  margin:0;
  align-self:stretch;
  justify-self:stretch;
}

.demo-benefits{
  display:none !important;
}

@media(max-width:1180px){
  .demo-hero-r2{
    grid-template-columns:1fr;
    align-items:start;
  }

  .demo-form-hero{
    height:auto;
  }

  .demo-hero-visual{
    margin-top:0;
  }
}

/* ORN BUSINESS DEMO LAYOUT R6 END */

/* ORN DEMO SUCCESS NOTICE R1 BEGIN */

.demo-preview-notice{
  margin-top:14px;
  padding:14px 15px;
  border:1px solid #A9D5D6;
  border-left:4px solid #0F7C80;
  border-radius:12px;
  background:#F0FAFA;
}

.demo-preview-notice strong{
  display:block;
  color:#0F6E73;
  font-size:14px;
  font-weight:850;
  line-height:1.35;
}

.demo-preview-notice span{
  display:block;
  margin-top:6px;
  color:#4F6067;
  font-size:12px;
  line-height:1.55;
}

/* ORN DEMO SUCCESS NOTICE R1 END */

/* ORN DEMO LAYOUT + MOTION R7 BEGIN */

/*
  Hero columns must not stretch each other vertically.
  Success/error notice can increase the form height without
  pushing the image down.
*/
.demo-hero-r2{
  align-items:start;
}

.demo-hero-r2 .demo-hero-copy{
  height:auto;
  align-self:start;
}

.demo-hero-intro{
  height:auto;
}

.demo-hero-visual{
  margin-top:30px;
}

.demo-form-hero{
  height:auto;
  align-self:start;
}

/*
  Same restrained lift used across ORN Dashboard:
  card moves by 2px only on devices with a real pointer.
*/
@media (hover:hover) and (pointer:fine){

  .demo-audience-grid article,
  .demo-steps-five article,
  .demo-result-grid article,
  .demo-category-grid article{
    transition:
      transform .18s ease,
      border-color .18s ease,
      box-shadow .18s ease;
    will-change:transform;
  }

  .demo-audience-grid article:hover,
  .demo-steps-five article:hover,
  .demo-result-grid article:hover,
  .demo-category-grid article:hover{
    transform:translateY(-2px);
    border-color:#BFDCDC;
    box-shadow:0 10px 26px rgba(31,37,43,.065);
  }
}

@media(max-width:1180px){
  .demo-hero-visual{
    margin-top:24px;
  }
}

/* ORN DEMO LAYOUT + MOTION R7 END */





