/* Experience-Hydron sections ported + scoped to .exp-embed, Hydron colours */
.exp-embed{--navy-950:#16344c;--navy-900:#213A52;--navy-800:#2E5470;--navy-600:#2E6E93;--ink-600:#4C6070;--ink-400:#7C8FA0;--purple:#6C63C7;--purple-deep:#3A3480;--ice-50:#F3F7FA;--ice-100:#E7EFF4;--cream:#FBF8F2;--white:#FFFFFF;--line:#DFE6EB;--line-soft:#EAEFF2;--ok:#2E7D5B;--serif:'Playfair Display',Georgia,serif;--sans:'Manrope','Segoe UI',sans-serif;--container:1240px;--radius-s:10px;--radius-m:16px;--radius-l:26px;--ease:cubic-bezier(.22,.61,.36,1);position:relative;} 
.exp-embed *,.exp-embed *::before,.exp-embed *::after{box-sizing:border-box;}
.exp-embed{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){.exp-embed{scroll-behavior:auto;}
.exp-embed *,.exp-embed *::before,.exp-embed *::after{animation-duration:.001ms !important; transition-duration:.001ms !important;}}
.exp-embed{
  margin:0;
  font-family:var(--sans);
  color:var(--navy-900);
  background:var(--white);
  -webkit-font-smoothing:antialiased;
  line-height:1.5;
  overflow-x:hidden;
}
.exp-embed img,.exp-embed svg{display:block; max-width:100%;}
.exp-embed a{color:inherit; text-decoration:none;}
.exp-embed button{font-family:inherit; cursor:pointer;}
.exp-embed h1,.exp-embed h2,.exp-embed h3,.exp-embed h4{font-family:var(--serif); margin:0; font-weight:560; letter-spacing:-0.01em; color:var(--navy-950);}
.exp-embed p{margin:0;}
.exp-embed .wrap{max-width:var(--container); margin:0 auto; padding:0 32px;}
@media (max-width:720px){.exp-embed .wrap{padding:0 20px;}}
.exp-embed .eyebrow{
  font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--purple-deep);
}
.exp-embed .eyebrow.on-dark{color:#C9B8FF;}
.exp-embed .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 26px; border-radius:100px; font-weight:600; font-size:15px;
  border:1px solid transparent; transition:transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease);
  white-space:nowrap; min-height:44px;
}
.exp-embed .btn-primary{background:var(--navy-950); color:var(--white);}
.exp-embed .btn-primary:hover{background:var(--purple-deep); transform:translateY(-1px);}
.exp-embed .btn-ghost{background:transparent; color:var(--navy-950); border-color:var(--navy-900);}
.exp-embed .btn-ghost:hover{background:var(--navy-950); color:var(--white);}
.exp-embed .btn-ghost.on-dark{color:var(--white); border-color:rgba(255,255,255,.45);}
.exp-embed .btn-ghost.on-dark:hover{background:var(--white); color:var(--navy-950);}
.exp-embed .btn-purple{background:var(--purple); color:var(--white);}
.exp-embed .btn-purple:hover{background:var(--purple-deep); transform:translateY(-1px);}
.exp-embed .btn-sm{padding:11px 18px; font-size:13.5px;}
.exp-embed .btn-block{width:100%;}
.exp-embed .btn[disabled]{opacity:.45; cursor:not-allowed; transform:none;}
.exp-embed .arrow{transition:transform .25s var(--ease); display:inline-block;}
.exp-embed .link-arrow{display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:14.5px; color:var(--navy-950); border-bottom:1px solid var(--line);}
.exp-embed .link-arrow:hover .arrow{transform:translateX(4px);}
.exp-embed .section{padding:96px 0;background:linear-gradient(180deg,var(--porcelain) 0%,var(--mist) 22%,var(--mist) 78%,var(--porcelain) 100%);}
@media (max-width:860px){.exp-embed .section{padding:64px 0;}}
.exp-embed .section.tight{padding:72px 0;}
.exp-embed .section-head{max-width:640px; margin-bottom:48px;}
.exp-embed .section-head.center{margin-left:auto; margin-right:auto; text-align:center;}
.exp-embed .section-head h2{font-size:clamp(28px,3.6vw,42px); line-height:1.12; margin-top:14px;}
.exp-embed .section-head p{margin-top:16px; color:var(--ink-600); font-size:16.5px; line-height:1.6;}
.exp-embed .bg-ice{background:var(--ice-50);}
.exp-embed .bg-navy{background:var(--navy-950); color:var(--white);}
.exp-embed .bg-navy h2,.exp-embed .bg-navy h3,.exp-embed .bg-navy h4{color:var(--white);}
.exp-embed .bg-cream{background:var(--cream);}
.exp-embed .announce{
  background:var(--navy-950); color:var(--white); font-size:13.5px;
  padding:10px 20px; text-align:center; position:relative; z-index:60;
}
.exp-embed .announce .wrap{display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; padding:0 16px;}
.exp-embed .announce b{font-weight:600;}
.exp-embed .announce a{font-weight:700; color:#D9CBFF; border-bottom:1px solid rgba(217,203,255,.5); white-space:nowrap;}
.exp-embed .announce a:hover{color:var(--white);}
.exp-embed .nav{
  position:sticky; top:0; z-index:59; background:rgba(255,255,255,.9); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft);
}
.exp-embed .nav .wrap{display:flex; align-items:center; justify-content:space-between; height:76px; gap:24px;}
.exp-embed .logo{font-family:var(--serif); font-size:22px; font-weight:620; letter-spacing:-0.01em; color:var(--navy-950); display:flex; align-items:center; gap:8px;}
.exp-embed .logo .dot{width:8px; height:8px; border-radius:50%; background:var(--purple);}
.exp-embed .navlinks{display:flex; align-items:center; gap:36px; font-size:14.5px; font-weight:600; color:var(--navy-800);}
.exp-embed .navlinks a{padding:4px 0; border-bottom:2px solid transparent;}
.exp-embed .navlinks a:hover{border-color:var(--purple);}
.exp-embed .nav-cta{display:flex; align-items:center; gap:14px;}
@media (max-width:900px){.exp-embed .navlinks{display:none;}}
.exp-embed .hero{
  background:linear-gradient(180deg, var(--ice-50) 0%, var(--white) 78%);
  padding:72px 0 40px;
  position:relative;
}
.exp-embed .hero .wrap{display:grid; grid-template-columns:1.02fr 1fr; gap:56px; align-items:center;}
@media (max-width:960px){.exp-embed .hero .wrap{grid-template-columns:1fr; gap:36px;}}
.exp-embed .hero-copy h1{font-size:clamp(38px,5.4vw,64px); line-height:1.04; margin-top:18px;}
.exp-embed .hero-copy .sub{font-family:var(--serif); font-size:clamp(19px,2vw,23px); color:var(--navy-800); margin-top:20px; font-weight:450;}
.exp-embed .hero-copy .support{margin-top:18px; color:var(--ink-600); font-size:16px; max-width:480px; line-height:1.65;}
.exp-embed .hero-ctas{display:flex; gap:14px; margin-top:32px; flex-wrap:wrap;}
.exp-embed .hero-reassure{display:flex; align-items:center; gap:9px; margin-top:22px; font-size:13.5px; color:var(--ink-600);}
.exp-embed .hero-reassure svg{flex:none;}
@media (max-width:960px){.exp-embed .hero-ctas{order:2;}
.exp-embed .hero-media{order:1;}
.exp-embed .hero-reassure{order:3;}}
.exp-embed .hero-media{position:relative; display:flex; justify-content:center; align-items:center;}
.exp-embed .hero-media .glow{
  position:absolute; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle, rgba(108,79,209,.16), rgba(108,79,209,0) 70%);
  filter:blur(2px);
}
.exp-embed .device-stage{position:relative; z-index:2; width:100%; max-width:400px;}
.exp-embed .device-frame{
  background:linear-gradient(160deg, var(--white), var(--ice-100));
  border:1px solid var(--line); border-radius:var(--radius-l);
  display:flex; align-items:center; justify-content:center;
  aspect-ratio:1/1.08; overflow:hidden; position:relative;
  box-shadow:0 30px 60px -30px rgba(11,42,67,.25);
}
.exp-embed .device-frame.small{aspect-ratio:1/1;}
.exp-embed .device-frame svg{width:70%; height:70%;}
.exp-embed .proof{background:var(--navy-950); padding:34px 0;}
.exp-embed .proof .wrap{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.exp-embed .proof-item{flex:1 1 0; min-width:130px; text-align:center; color:var(--white); border-left:1px solid rgba(255,255,255,.14); padding:0 12px;}
.exp-embed .proof-item:first-child{border-left:none;}
.exp-embed .proof-num{font-family:var(--serif); font-size:clamp(24px,2.6vw,32px); font-weight:560;}
.exp-embed .proof-label{font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.7); margin-top:6px; font-weight:600;}
@media (max-width:640px){.exp-embed .proof .wrap{display:grid; grid-template-columns:1fr 1fr; gap:24px 0;}
.exp-embed .proof-item{border-left:none; border-top:1px solid rgba(255,255,255,.14); padding-top:18px;}
.exp-embed .proof-item:nth-child(1),.exp-embed .proof-item:nth-child(2){border-top:none; padding-top:0;}}
.exp-embed .micro-row{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:40px;}
@media (max-width:760px){.exp-embed .micro-row{grid-template-columns:1fr; gap:14px;}}
.exp-embed .micro-card{
  border:1px solid var(--line); border-radius:var(--radius-m); padding:28px;
  background:var(--white); transition:border-color .25s var(--ease), transform .25s var(--ease);
}
.exp-embed .micro-card:hover{border-color:var(--purple); transform:translateY(-3px);}
.exp-embed .micro-card .num{font-family:var(--serif); font-size:14px; color:var(--purple-deep); font-weight:700;}
.exp-embed .micro-card h4{font-size:22px; margin-top:10px;}
.exp-embed .micro-card p{margin-top:8px; color:var(--ink-600); font-size:14.5px; line-height:1.6;}
.exp-embed .product-row{
  display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;
  padding:56px 0; border-top:1px solid var(--line-soft);
}
.exp-embed .product-row:last-child{border-bottom:1px solid var(--line-soft);}
.exp-embed .product-row.reverse .p-media{order:2;}
.exp-embed .product-row.reverse .p-info{order:1;}
@media (max-width:900px){.exp-embed .product-row{grid-template-columns:1fr; gap:28px; padding:40px 0;}
.exp-embed .product-row.reverse .p-media{order:1;}
.exp-embed .product-row.reverse .p-info{order:2;}}
.exp-embed .p-media{position:relative;}
.exp-embed .p-media .device-frame{cursor:pointer; transition:transform .35s var(--ease), box-shadow .35s var(--ease);}
.exp-embed .p-media:hover .device-frame{transform:scale(1.012); box-shadow:0 40px 70px -30px rgba(11,42,67,.32);}
.exp-embed .p-badge{
  position:absolute; top:18px; left:18px; background:var(--white); border:1px solid var(--line);
  border-radius:100px; padding:6px 14px; font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--navy-800);
}
.exp-embed .p-info .model-name{font-size:clamp(28px,3vw,36px); margin-top:10px;}
.exp-embed .p-info .position {
    font-family: var(--serif);
    font-size: 22px;
    color: var(--ocean);
    margin-top: 8px;
    font-weight: 800;
}

.exp-embed .eyebrow {
    display: none;
} 

.exp-embed .dlg-head .tagline {
   font-family: var(--serif);
    font-size: 18px;
    color: var(--ocean);
    margin-top: 8px;
}

.exp-embed .p-info .desc{margin-top:14px; color:var(--ink-600); font-size:15.5px; line-height:1.65; max-width:440px;}
.exp-embed .p-metrics{display:flex; gap:26px; margin-top:26px; flex-wrap:wrap;}
.exp-embed .p-metric b{display:block; font-family:var(--serif); font-size:24px; color:var(--navy-950);}
.exp-embed .p-metric span{display:block; font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-400); margin-top:4px; font-weight:600;}
.exp-embed .p-features{margin-top:22px; display:flex; flex-wrap:wrap; gap:8px;}
.exp-embed .p-chip{border:1px solid var(--line); background:var(--ice-50); border-radius:100px; padding:7px 14px; font-size:12.5px; color:var(--navy-800); font-weight:600;}
.exp-embed .p-ctas{display:flex; gap:14px; margin-top:28px; flex-wrap:wrap;}
.exp-embed .p-pending-tag{display:inline-flex; align-items:center; gap:8px; background:var(--ice-100); border:1px solid var(--line); padding:8px 14px; border-radius:100px; font-size:12.5px; color:var(--ink-600); font-weight:600; margin-top:26px;}
.exp-embed .compare-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:var(--radius-m); background:var(--white);}
.exp-embed table.compare{width:100%; border-collapse:collapse; min-width:640px;}
.exp-embed table.compare th,.exp-embed table.compare td{padding:16px 20px; text-align:left; font-size:14.5px; border-bottom:1px solid var(--line-soft);}
.exp-embed table.compare th{font-family:var(--serif); font-size:16px; font-weight:560; background:var(--ice-50); position:sticky; top:0;}
.exp-embed table.compare td.row-label{font-weight:700; color:var(--navy-800); background:var(--ice-50); white-space:nowrap;}
.exp-embed table.compare tr:last-child td{border-bottom:none;}
.exp-embed table.compare td.pending{color:var(--ink-400); font-style:italic;}
.exp-embed .help-box{
  background:var(--navy-950); color:var(--white); border-radius:var(--radius-l);
  padding:56px; display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
}
.exp-embed .help-box h3{font-size:clamp(24px,2.6vw,30px); max-width:520px; color:var(--white);}
.exp-embed .help-box p{color:rgba(255,255,255,.72); margin-top:12px; max-width:480px; font-size:15px; line-height:1.6;}
.exp-embed .mid-hook{background:var(--navy-950); color:var(--white); text-align:center; padding:110px 0;}
.exp-embed .mid-hook .small{color:rgba(255,255,255,.65); font-size:14.5px;}
.exp-embed .mid-hook h2{color:var(--white); font-size:clamp(30px,5vw,52px); margin:18px auto 0; max-width:760px; line-height:1.15;}
.exp-embed .mid-hook .support{color:rgba(255,255,255,.72); margin:18px auto 0; max-width:440px; font-size:16px;}
.exp-embed .mid-hook .btn{margin-top:34px;}
.exp-embed .process-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:44px;}
@media (max-width:840px){.exp-embed .process-grid{grid-template-columns:1fr; gap:18px;}}
.exp-embed .process-card{border:1px solid var(--line); border-radius:var(--radius-m); padding:30px; position:relative; background:var(--white);}
.exp-embed .process-card .step-num{font-family:var(--serif); font-size:15px; color:var(--purple-deep); font-weight:700;}
.exp-embed .process-card h4{margin-top:14px; font-size:21px;}
.exp-embed .process-card p{margin-top:10px; color:var(--ink-600); font-size:14.5px; line-height:1.6;}
.exp-embed .process-then{text-align:center; margin-top:48px;}
.exp-embed .process-then .then-h{font-family:var(--serif); font-size:26px;}
.exp-embed .process-then p{color:var(--ink-600); margin-top:10px; font-size:14.5px;}
.exp-embed .process-then .btn{margin-top:24px;}
.exp-embed .exp-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:44px;}
@media (max-width:900px){.exp-embed .exp-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.exp-embed .exp-grid{grid-template-columns:1fr;}}
.exp-embed .exp-card{border-radius:var(--radius-m); overflow:hidden; border:1px solid var(--line); background:var(--white);}
.exp-embed .exp-card .thumb{aspect-ratio:4/3; background:linear-gradient(150deg,var(--ice-100),var(--ice-50)); display:flex; align-items:center; justify-content:center;}
.exp-embed .exp-card .body{padding:20px;}
.exp-embed .exp-card h4{font-size:17px;}
.exp-embed .exp-card p{margin-top:6px; color:var(--ink-600); font-size:13.5px; line-height:1.55;}
.exp-embed .science-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-m); overflow:hidden; margin-top:44px;}
@media (max-width:760px){.exp-embed .science-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.exp-embed .science-grid{grid-template-columns:1fr;}}
.exp-embed .science-cell{background:var(--white); padding:28px; }
.exp-embed .science-cell .tag{font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--purple-deep);}
.exp-embed .science-cell h4{margin-top:10px; font-size:18px;}
.exp-embed .science-cell p{margin-top:8px; color:var(--ink-600); font-size:14px; line-height:1.55;}
.exp-embed .testi-scroll{display:flex; gap:20px; overflow-x:auto; padding:8px 0 20px; margin-top:36px; scroll-snap-type:x mandatory;}
.exp-embed .testi-card{
  flex:0 0 320px; scroll-snap-align:start; border:1px solid var(--line); border-radius:var(--radius-m);
  padding:26px; background:var(--white); display:flex; flex-direction:column; justify-content:space-between;
}
.exp-embed .testi-card q{font-family:var(--serif); font-size:16.5px; line-height:1.5; color:var(--navy-900); font-style:italic;}
.exp-embed .testi-meta{display:flex; align-items:center; gap:10px; margin-top:18px;}
.exp-embed .testi-avatar{width:36px; height:36px; border-radius:50%; background:var(--purple); color:var(--white); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex:none;}
.exp-embed .testi-meta .name{font-weight:700; font-size:14px;}
.exp-embed .testi-meta .loc{font-size:12.5px; color:var(--ink-400);}
.exp-embed .form-shell{background:var(--ice-50); border:1px solid var(--line); border-radius:var(--radius-l); padding:44px; max-width:640px; margin:0 auto;}
@media (max-width:640px){.exp-embed .form-shell{padding:26px;}}
.exp-embed .form-steps{display:flex; gap:8px; margin-bottom:28px;}
.exp-embed .form-steps .dot{flex:1; height:4px; border-radius:4px; background:var(--line);}
.exp-embed .form-steps .dot.active{background:var(--purple);}
.exp-embed .form-steps .dot.done{background:var(--navy-800);}
.exp-embed .field{margin-bottom:18px;}
.exp-embed .field label{display:block; font-size:13px; font-weight:700; color:var(--navy-800); margin-bottom:8px;}
.exp-embed .field input,.exp-embed .field select{
  width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:var(--radius-s);
  font-family:inherit; font-size:15px; background:var(--white); transition:border-color .2s;
}
.exp-embed .field input:focus,.exp-embed .field select:focus{outline:none; border-color:var(--purple);}
.exp-embed .field-row{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
@media (max-width:480px){.exp-embed .field-row{grid-template-columns:1fr;}}
.exp-embed .choice-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:10px;}
.exp-embed .choice{
  border:1px solid var(--line); border-radius:var(--radius-s); padding:13px 14px; font-size:14px; font-weight:600;
  background:var(--white); text-align:left; transition:border-color .2s, background .2s;
}
.exp-embed .choice.selected{border-color:var(--purple); background:#F3EEFF; color:var(--purple-deep);}
.exp-embed .choice small{display:block; font-weight:500; color:var(--ink-400); margin-top:2px; font-size:12px;}
.exp-embed .model-picked{display:flex; align-items:center; gap:14px; background:var(--white); border:1px solid var(--purple); border-radius:var(--radius-s); padding:14px; margin-bottom:18px;}
.exp-embed .model-picked .mini-frame{width:52px; height:52px; border-radius:10px; background:var(--ice-100); display:flex; align-items:center; justify-content:center; flex:none;}
.exp-embed .model-picked .mini-frame svg{width:60%;}
.exp-embed .model-picked b{display:block; font-size:15px;}
.exp-embed .model-picked .change{margin-left:auto; font-size:13px; font-weight:700; color:var(--purple-deep); border-bottom:1px solid currentColor;}
.exp-embed .consent{display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--ink-600); margin:20px 0;}
.exp-embed .consent input{margin-top:3px;}
.exp-embed .form-actions{display:flex; gap:12px; margin-top:24px;}
.exp-embed .form-reassure{display:flex; align-items:center; gap:8px; margin-top:16px; font-size:13px; color:var(--ink-600); justify-content:center;}
.exp-embed .success-box{text-align:center; padding:20px 0;}
.exp-embed .success-steps{display:flex; justify-content:center; gap:28px; margin-top:28px; flex-wrap:wrap;}
.exp-embed .success-steps div{text-align:center;}
.exp-embed .success-steps .n{font-family:var(--serif); font-size:22px; color:var(--purple-deep);}
.exp-embed .success-steps .l{font-size:12.5px; color:var(--ink-600); margin-top:4px; max-width:110px;}
.exp-embed .err-msg{color:#B4453C; font-size:12.5px; margin-top:6px; display:none;}
.exp-embed .field.has-error input,.exp-embed .field.has-error select{border-color:#B4453C;}
.exp-embed .field.has-error .err-msg{display:block;}
.exp-embed .faq-item{border-bottom:1px solid var(--line);}
.exp-embed .faq-q{display:flex; align-items:center; justify-content:space-between; padding:22px 0; font-weight:600; font-size:16.5px; width:100%; background:none; border:none; text-align:left; color:var(--navy-950);}
.exp-embed .faq-q .plus{font-size:22px; font-weight:400; transition:transform .25s var(--ease); flex:none; margin-left:20px; color:var(--purple-deep);}
.exp-embed .faq-item.open .plus{transform:rotate(45deg);}
.exp-embed .faq-a{max-height:0; overflow:hidden; transition:max-height .35s var(--ease);}
.exp-embed .faq-a p{padding:0 0 22px; color:var(--ink-600); font-size:15px; line-height:1.6; max-width:640px;}
.exp-embed .final-cta{text-align:center; padding:100px 0;}
.exp-embed .final-cta .eyebrow{white-space:pre-line; line-height:1.6;}
.exp-embed .final-cta h2{font-size:clamp(30px,4.5vw,48px); max-width:700px; margin:18px auto 0;}
.exp-embed .final-cta p{margin:16px auto 0; max-width:460px; color:var(--ink-600);}
.exp-embed .final-ctas{display:flex; gap:14px; justify-content:center; margin-top:32px; flex-wrap:wrap;}
.exp-embed footer{background:var(--navy-950); color:rgba(255,255,255,.75); padding:64px 0 32px; font-size:14px;}
.exp-embed .foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px;}
@media (max-width:760px){.exp-embed .foot-grid{grid-template-columns:1fr; gap:32px;}}
.exp-embed footer .flogo{font-family:var(--serif); font-size:22px; color:var(--white); margin-bottom:14px;}
.exp-embed footer h5{color:var(--white); font-size:13px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:16px;}
.exp-embed footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:10px;}
.exp-embed footer a:hover{color:var(--white);}
.exp-embed .foot-bottom{border-top:1px solid rgba(255,255,255,.14); margin-top:48px; padding-top:24px; font-size:12.5px; color:rgba(255,255,255,.5); line-height:1.6;}
.exp-embed .sticky-demo{
  position:fixed; right:28px; bottom:28px; z-index:70;
  display:flex; align-items:center; gap:12px; background:var(--navy-950); color:var(--white);
  padding:14px 20px 14px 16px; border-radius:100px; box-shadow:0 20px 40px -14px rgba(11,42,67,.5);
  transform:translateY(140%); opacity:0; transition:transform .4s var(--ease), opacity .4s var(--ease);
  border:1px solid rgba(255,255,255,.1);
}
.exp-embed .sticky-demo.visible{transform:translateY(0); opacity:1;}
.exp-embed .sticky-demo .dot-live{width:8px; height:8px; border-radius:50%; background:#4ADE80; box-shadow:0 0 0 0 rgba(74,222,128,.6); animation:pulse-live 2s infinite;}
@keyframes pulse-live{
  0%{box-shadow:0 0 0 0 rgba(74,222,128,.5);}
  70%{box-shadow:0 0 0 8px rgba(74,222,128,0);}
  100%{box-shadow:0 0 0 0 rgba(74,222,128,0);}
}
.exp-embed .sticky-demo .txt{font-size:13.5px; font-weight:700;}
.exp-embed .sticky-demo .txt small{display:block; font-weight:500; color:rgba(255,255,255,.6); font-size:11px;}
.exp-embed .sticky-demo .close-x{background:rgba(255,255,255,.12); border-radius:50%; width:22px; height:22px; display:flex; align-items:center; justify-content:center; font-size:13px; flex:none;}
.exp-embed .sticky-mini{
  position:fixed; right:28px; bottom:28px; z-index:70; width:52px; height:52px; border-radius:50%;
  background:var(--navy-950); display:none; align-items:center; justify-content:center; box-shadow:0 14px 30px -10px rgba(11,42,67,.5);
}
.exp-embed .sticky-mini.show{display:flex;}
@media (max-width:720px){.exp-embed .sticky-demo{left:16px; right:16px; bottom:16px; border-radius:16px; justify-content:space-between;}
.exp-embed .sticky-mini{right:16px; bottom:16px;}}
.exp-embed .overlay{
  position:fixed; inset:0; background:rgba(7,27,44,.55); backdrop-filter:blur(4px); z-index:100;
  opacity:0; pointer-events:none; transition:opacity .3s var(--ease);
  display:flex; align-items:center; justify-content:center; padding:24px;
}
.exp-embed .overlay.open{opacity:1; pointer-events:auto;}
.exp-embed .dialog{
  width:min(1300px, 90vw); height:min(86vh, 880px); background:var(--white); border-radius:24px;
  display:grid; grid-template-columns:44% 56%; overflow:hidden;
  transform:scale(.97); opacity:0; transition:transform .32s var(--ease), opacity .32s var(--ease);
  box-shadow:0 60px 100px -30px rgba(0,0,0,.4);
}
.exp-embed .overlay.open .dialog{transform:scale(1); opacity:1;}
.exp-embed .dialog-close{
  position:absolute; top:20px; right:20px; z-index:5; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.9); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; font-size:18px;
}
.exp-embed .dlg-media{background:var(--ice-50); position:relative; display:flex; flex-direction:column; padding:40px;}
.exp-embed .dlg-hero-frame{flex:1; display:flex; align-items:center; justify-content:center; background:var(--white); border-radius:20px; border:1px solid var(--line); position:relative;}
.exp-embed .dlg-hero-frame svg{width:56%; height:56%;}
.exp-embed .dlg-thumbs{display:flex; gap:10px; margin-top:16px;}
.exp-embed .dlg-thumb{width:56px; height:56px; border-radius:10px; background:var(--white); border:1.5px solid var(--line); display:flex; align-items:center; justify-content:center;}
.exp-embed .dlg-thumb.active{border-color:var(--purple);}
.exp-embed .dlg-thumb svg{width:65%; opacity:.8;}
.exp-embed .dlg-content{padding:40px 44px; overflow-y:auto; display:flex; flex-direction:column;}
.exp-embed .dlg-head .badge{font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--purple-deep);}
.exp-embed .dlg-head h3{font-size:32px; margin-top:8px;}
.exp-embed .dlg-tabs{display:flex; gap:26px; border-bottom:1px solid var(--line); margin-top:26px;}
.exp-embed .dlg-tab{padding:12px 0; font-weight:700; font-size:14px; color:var(--ink-400); border-bottom:2px solid transparent; margin-bottom:-1px; background:none; border-top:none; border-left:none; border-right:none;}
.exp-embed .dlg-tab.active{color:var(--navy-950); border-color:var(--purple);}
.exp-embed .dlg-panels{flex:1; margin-top:24px; position:relative;}
.exp-embed .dlg-panel{display:none; animation:panelIn .3s var(--ease);}
.exp-embed .dlg-panel.active{display:block;}
@keyframes panelIn{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
.exp-embed .ov-metrics{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:6px;}
@media (max-width:560px){.exp-embed .ov-metrics{grid-template-columns:1fr 1fr;}}
.exp-embed .ov-metric{border:1px solid var(--line); border-radius:var(--radius-s); padding:16px;}
.exp-embed .ov-metric b{display:block; font-family:var(--serif); font-size:21px;}
.exp-embed .ov-metric span{display:block; font-size:11px; color:var(--ink-400); text-transform:uppercase; letter-spacing:.06em; margin-top:6px; font-weight:600;}
.exp-embed .dlg-panel .summary{color:var(--ink-600); font-size:15px; line-height:1.65; margin-top:2px; max-width:520px;}
.exp-embed .best-for{margin-top:26px;}
.exp-embed .best-for h5,.exp-embed .why-consider h5{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--navy-800); font-weight:700; margin-bottom:10px;}
.exp-embed .best-for p{color:var(--ink-600); font-size:14.5px;}
.exp-embed .why-consider{margin-top:22px;}
.exp-embed .why-consider ul{margin:0; padding-left:18px; color:var(--ink-600); font-size:14.5px; line-height:1.7;}
.exp-embed .spec-group{margin-bottom:22px;}
.exp-embed .spec-group h5{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--purple-deep); font-weight:700; margin-bottom:10px;}
.exp-embed .spec-row{display:flex; justify-content:space-between; gap:20px; padding:11px 0; border-bottom:1px solid var(--line-soft); font-size:14.5px;}
.exp-embed .spec-row span:first-child{color:var(--ink-600);}
.exp-embed .spec-row span:last-child{font-weight:600; text-align:right;}
.exp-embed .feat-list{display:flex; flex-direction:column; gap:18px;}
.exp-embed .feat-item{display:flex; gap:14px;}
.exp-embed .feat-icon{width:38px; height:38px; border-radius:10px; background:var(--ice-50); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; flex:none;}
.exp-embed .feat-icon svg{width:19px; height:19px;}
.exp-embed .feat-item h5{font-size:15px; margin-bottom:3px;}
.exp-embed .feat-item p{font-size:13.5px; color:var(--ink-600); line-height:1.55;}
.exp-embed .gal-main{aspect-ratio:16/10; border-radius:var(--radius-s); background:var(--ice-50); border:1px solid var(--line); display:flex; align-items:center; justify-content:center; position:relative;}
.exp-embed .gal-main svg{width:38%;}
.exp-embed .gal-label{position:absolute; bottom:14px; left:14px; background:var(--white); border:1px solid var(--line); font-size:11.5px; font-weight:700; padding:5px 10px; border-radius:100px; color:var(--navy-800);}
.exp-embed .gal-nav{position:absolute; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%; background:var(--white); border:1px solid var(--line); display:flex; align-items:center; justify-content:center;}
.exp-embed .gal-nav.prev{left:12px;}
.exp-embed .gal-nav.next{right:12px;}
.exp-embed .gal-thumbs{display:flex; gap:8px; margin-top:12px; flex-wrap:wrap;}
.exp-embed .gal-thumbs .dlg-thumb{width:48px; height:48px;}
.exp-embed .dlg-cta{border-top:1px solid var(--line); margin-top:auto; padding-top:24px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;}
.exp-embed .dlg-cta .txt b{display:block; font-size:15.5px;}
.exp-embed .dlg-cta .txt span{font-size:13px; color:var(--ink-600);}
@media (max-width:860px){.exp-embed .dialog{display:block; width:100vw; height:100vh; height:100svh; border-radius:0; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.exp-embed .dlg-media{padding:20px; padding-top:60px;}
.exp-embed .dlg-hero-frame{aspect-ratio:1.4/1;}
.exp-embed .dlg-content{padding:22px; overflow-y:visible;}
.exp-embed .overlay{padding:0;}
.exp-embed .dlg-tabs{position:sticky; top:0; background:var(--white); z-index:3; overflow-x:auto;}}
.exp-embed .drawer-overlay{position:fixed; inset:0; background:rgba(7,27,44,.5); z-index:100; opacity:0; pointer-events:none; transition:opacity .3s var(--ease);}
.exp-embed .drawer-overlay.open{opacity:1; pointer-events:auto;}
.exp-embed .drawer{
  position:fixed; top:0; right:0; height:100%; width:min(440px,100vw); background:var(--white); z-index:101;
  transform:translateX(100%); transition:transform .35s var(--ease); overflow-y:auto; padding:36px;
  box-shadow:-30px 0 60px -30px rgba(0,0,0,.3);
}
.exp-embed .drawer.open{transform:translateX(0);}
.exp-embed .drawer-close{width:36px; height:36px; border-radius:50%; border:1px solid var(--line); display:flex; align-items:center; justify-content:center; margin-bottom:24px; font-size:17px;}
.exp-embed a:focus-visible,.exp-embed button:focus-visible,.exp-embed input:focus-visible,.exp-embed select:focus-visible{outline:2px solid var(--purple); outline-offset:2px;}

/* ===== Hydron integration overrides ===== */
/* eyebrow + number accents in Hydron colours */
.exp-embed .eyebrow{ color: var(--ocean, #2E6E93) !important; }
.exp-embed .micro-card .num{ color: var(--purple, #6C63C7) !important; }

/* water-ripple background behind the product range */
.exp-embed #range{ position:relative; overflow:hidden; isolation:isolate; }
.exp-embed #range > .water-bg-canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; pointer-events:none; }
.exp-embed #range > .water-bg-veil{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(237,244,250,.30) 0%, rgba(247,244,238,.14) 48%, rgba(247,244,238,.34) 100%); }
.exp-embed #range > .wrap{ position:relative; z-index:2; }

/* gradient device media (Hydron tint) */
.exp-embed .device-frame{ background:linear-gradient(150deg, var(--ice-100), var(--ice-50)); border-radius:20px; padding:14px; }

/* ===== buttons in Hydron indigo ===== */
.exp-embed .btn-primary{ background: var(--purple-deep, #3A3480); }
.exp-embed .btn-primary:hover{ background: var(--purple, #6C63C7); }
.exp-embed .btn-ghost{ border-color: var(--purple-deep, #3A3480); color: var(--purple-deep, #3A3480); }
.exp-embed .btn-ghost:hover{ background: var(--purple-deep, #3A3480); color:#fff; }

/* ===== product media: smaller image + thumbnail slider ===== */
.exp-embed .p-media{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.exp-embed .device-frame{ width:100%; max-width:330px; margin:0 auto; }
.exp-embed .device-frame svg{ width:100%; height:auto; }
.exp-embed .p-thumbs{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; width:100%; max-width:360px; }
.exp-embed .p-thumb{ width:54px; height:54px; flex:none; border:1.5px solid var(--line,#DFE6EB); border-radius:10px; background:#fff; padding:6px; cursor:pointer; transition:border-color .2s ease, transform .2s ease; }
.exp-embed .p-thumb svg{ width:100%; height:100%; }
.exp-embed .p-thumb.active{ border-color: var(--purple, #6C63C7); }
.exp-embed .p-thumb:hover{ transform:translateY(-2px); }

/* ===== product hero wrap so badge sits on the visible device frame ===== */
.exp-embed .p-hero-wrap{position:relative; width:100%; max-width:360px; margin:0 auto;}
.exp-embed .p-hero-wrap .device-frame{width:100%; max-width:none;}
.exp-embed .p-hero-wrap .p-badge{top:14px; left:14px; z-index:3;}

/* real product photo inside device-frame */
.exp-embed .device-frame .p-hero-img{
  width:100%; height:100%;
  max-width:100%; max-height:340px;
  object-fit:contain; display:block;
  border-radius:14px; background:transparent;
}
/* remove gradient bg when a real photo is shown, let it breathe */
.exp-embed .device-frame:has(.p-hero-img){
  background:linear-gradient(160deg, #F7FAFC, #EEF3F8);
  padding:20px;
}

/* thumbnail photos */
.exp-embed .p-thumb img,
.exp-embed .dlg-thumb img{
  width:100%; height:100%; object-fit:contain; display:block; border-radius:6px;
}
.exp-embed .p-thumb{padding:4px;}
.exp-embed .dlg-thumb img{opacity:1;}
.exp-embed .dlg-hero-img{
  width:100%; height:100%; max-height:400px;
  object-fit:contain; display:block;
}
.exp-embed .dlg-hero-frame:has(.dlg-hero-img) svg{display:none;}

/* ===== sticky live-demo mini enquiry modal ===== */
/* backdrop (fades in) */
.exp-embed.sd-modal{
  position:fixed; inset:0; z-index:9998;
  background:rgba(11,26,43,.55); backdrop-filter:blur(4px);
  opacity:0; transition:opacity .3s ease;
  padding:0; /* card is fixed-positioned drawer, no centering */
}
.exp-embed.sd-modal.open{opacity:1;}
.exp-embed.sd-modal[hidden]{display:none;}

/* right-slide drawer */
.sd-modal-card{
  position:fixed; top:0; right:0; height:100%;
  width:min(440px, 100vw);
  background:#fff; border-radius:0;
  padding:56px 34px 34px;
  box-shadow:-20px 0 60px rgba(11,26,43,.25);
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.22,.61,.36,1);
  overflow-y:auto;
}
.exp-embed.sd-modal.open .sd-modal-card{transform:translateX(0);}
@media(max-width:520px){
  .sd-modal-card{width:100vw; padding:56px 22px 24px; }
  .exp-embed .p-thumbs {
    display: flex;
    gap: 0px;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    max-width: 360px;
}
.exp-embed .p-thumb {
    border: none;
    border-radius: 10px;
    background: transparent;
    padding: 6px;
    cursor: pointer;
    transition: border-color .2s ease, transform .2s ease;
}
}
.sd-modal-close{
  position:absolute; top:12px; right:12px; width:34px; height:34px;
  border-radius:50%; background:#F3F6FA; border:none; font-size:15px; cursor:pointer;
  color:#213A52; display:flex; align-items:center; justify-content:center;
}
.sd-modal-close:hover{background:#E4EBF2;}
.sd-modal-card h3{
  font-family:var(--serif, 'Playfair Display', Georgia, serif);
  font-size:22px; font-weight:500; color:#213A52; margin:0 0 6px;
}
.sd-lede{font-size:14px; color:rgba(33,58,82,.68); margin:0 0 18px;}
.sd-field{display:flex; flex-direction:column; gap:6px; margin-bottom:14px;}
.sd-field label{font-size:12px; font-weight:700; letter-spacing:.04em; color:rgba(33,58,82,.68);}
.sd-field input{
  background:#F3F6FA; border:1px solid rgba(33,58,82,.12); border-radius:10px;
  padding:12px 14px; font-size:14.5px; width:100%;
  transition:border-color .2s, box-shadow .2s;
}
.sd-field input:focus{outline:none; border-color:#3A3480; box-shadow:0 0 0 3px rgba(58,52,128,.14); background:#fff;}
.sd-submit{
  width:100%; justify-content:center; margin-top:8px;
  background:#3A3480; color:#fff; border:none; border-radius:100px;
  padding:13px 22px; font-weight:600; font-size:14.5px; cursor:pointer;
  display:inline-flex; align-items:center; gap:8px; justify-content:center;
  transition:background .3s;
}
.sd-submit:hover{background:#6C63C7;}
.sd-submit:disabled{opacity:.7; cursor:wait;}
.sd-ok{margin:14px 0 0; text-align:center; color:#0f7a4b; font-weight:600; font-size:14px;}

/* ===== sticky live-demo when placed as standalone element on landing page
   (class combo .exp-embed.sticky-demo instead of descendant) ===== */
button.sticky-demo.exp-embed{
  position:fixed; right:28px; bottom:28px; z-index:70;
  display:flex; align-items:center; gap:12px; background:#3A3480; color:#fff;
  padding:14px 20px 14px 16px; border-radius:100px;
  box-shadow:0 20px 40px -14px rgba(11,42,67,.5);
  transform:translateY(140%); opacity:0;
  transition:transform .4s cubic-bezier(.22,.61,.36,1), opacity .4s cubic-bezier(.22,.61,.36,1);
  border:1px solid rgba(255,255,255,.1); cursor:pointer;
}
button.sticky-demo.exp-embed.visible{transform:translateY(0); opacity:1;}
button.sticky-demo.exp-embed .dot-live{
  width:8px; height:8px; border-radius:50%; background:#4ADE80;
  box-shadow:0 0 0 0 rgba(74,222,128,.6); animation:pulse-live 2s infinite;
}
button.sticky-demo.exp-embed .txt{font-size:13.5px; font-weight:700; text-align:left;}
button.sticky-demo.exp-embed .txt small{
  display:block; font-weight:500; color:rgba(255,255,255,.6); font-size:11px;
}
button.sticky-demo.exp-embed .close-x{
  background:rgba(255,255,255,.12); border-radius:50%; width:22px; height:22px;
  display:flex; align-items:center; justify-content:center; font-size:13px; flex:none;
}
@media (max-width:720px){
  button.sticky-demo.exp-embed{left:16px; right:16px; bottom:16px; border-radius:16px; justify-content:space-between;}
}

/* ===== image sizes bumped up ===== */
/* product row main image — bigger, roomier */
.exp-embed .p-hero-wrap{max-width:460px;}
.exp-embed .device-frame .p-hero-img{max-height:440px; min-height:340px;}
.exp-embed .p-thumb{width:64px; height:64px;}

/* dialog gallery main image (Gallery tab) — real photo */
.exp-embed .gal-main-img{
  width:100%; height:100%; max-height:460px;
  object-fit:contain; display:block;
}
.exp-embed .gal-main:has(.gal-main-img) svg{display:none;}
.exp-embed .gal-thumbs .dlg-thumb img{width:100%; height:100%; object-fit:contain; border-radius:6px;}

/* dialog top-left hero (Overview tab) — a bit larger */
.exp-embed .dlg-hero-img{max-height:460px; min-height:340px;}

/* ===== mobile scroll polish: canvas doesn't eat touches; sticky sizes down ===== */
.exp-embed .water-bg-canvas, .exp-embed canvas{pointer-events:none;}
button.sticky-demo.exp-embed{touch-action:manipulation;}

@media (max-width:720px){
  /* smaller sticky on mobile, doesn't dominate the viewport */
  button.sticky-demo.exp-embed{
    left:auto; right:14px; bottom:14px;
    padding:11px 14px 11px 12px;
    border-radius:100px;
    justify-content:flex-start;
    font-size:12.5px;
  }
  button.sticky-demo.exp-embed .txt{font-size:12.5px; line-height:1.2;}
  button.sticky-demo.exp-embed .txt small{font-size:10px;}

  /* product row: image + thumbs stay compact */
  .exp-embed .p-hero-wrap{max-width:100%;}
  .exp-embed .device-frame .p-hero-img{max-height:320px; min-height:240px;}
  .exp-embed .p-thumb{width:56px; height:56px;}

  /* dialog goes full-screen on small phones */
  .exp-embed .dialog{width:100vw; height:100vh; border-radius:0;}
}

/* ensure body scroll isn't blocked when modal is closed */
body:not(.sd-open){overflow:auto;}

/* ===== mobile Explore dialog: image + content flow together (single scroll) ===== */
@media (max-width:860px){
  /* image area feels more spacious, not cramped */
  .exp-embed .dlg-hero{padding:18px 18px 6px;}
  .exp-embed .dlg-hero-frame{
    aspect-ratio:auto;
    height:auto; min-height:280px; max-height:400px;
    padding:14px;
  }
  .exp-embed .dlg-hero-img{max-height:360px; min-height:260px;}
  .exp-embed .dlg-thumbs{margin-top:14px; justify-content:center;}
  /* keep tabs sticky as user scrolls past the image */
  .exp-embed .dlg-tabs{position:sticky; top:0; background:var(--white); z-index:3; margin-top:22px; padding:10px 0;}
}

/* ===== product row as a clean white card ===== */
.exp-embed .product-row{
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 40px clamp(24px, 3vw, 44px);
  margin-bottom: 28px;
  gap: 44px;
  box-shadow: 0 20px 46px -30px rgba(11,42,67,.14);
}
/* remove the top/bottom border from the generic rule since card has its own border */
.exp-embed .product-row,
.exp-embed .product-row:last-child{ border-top:none; border-bottom:none; }
/* reverse row: keep symmetric spacing so the second card doesn't hug the edge */
.exp-embed .product-row.reverse{ padding: 40px clamp(24px, 3vw, 44px); }

/* hide the "Countertop · Compact" badge overlay on product row images */
.exp-embed .p-hero-wrap .p-badge,
.exp-embed .p-media .p-badge{ display:none !important; }

/* ===== unified description style (product row + dialog) ===== */
.exp-embed .p-info .desc,
.exp-embed .dlg-panels .panel-summary,
.exp-embed .dlg-panels .panel-content p,
.exp-embed .panel-summary,
.exp-embed .dlg-content p,
.exp-embed .dlg-panels p{
  color: rgb(33, 58, 82);
  font-size: clamp(15px, 1.5vw, 16px);
  line-height: 1.65;
  max-width: 640px;
}

.exp-embed .dlg-content p,
.exp-embed .dlg-panels p{
  color: rgb(33, 58, 82);
  font-size: clamp(15px, 1.5vw, 16px);
  line-height: 1.65;
  max-width: 650px;
}
/* dialog: don't cap headings/small labels with 440px, only body text */
.exp-embed .dlg-panels h4,
.exp-embed .dlg-panels h5,
.exp-embed .dlg-panels .panel-label,
.exp-embed .dlg-panels ul,
.exp-embed .dlg-panels li{ max-width:none; }

/* dialog body list items: same ink colour */
.exp-embed .dlg-panels li{
  color: rgb(33, 58, 82);
  font-size: clamp(14.5px, 1.4vw, 17px);
  line-height:1.6;
}

/* mobile: allow description to fill card width */
@media (max-width:900px){
  .exp-embed .p-info .desc,
  .exp-embed .dlg-panels p{ max-width:none; }
}

/* ===== product row image: no padding/frame, but keep rounded corners on the photo ===== */
.exp-embed .p-media .device-frame,
.exp-embed .p-hero-wrap .device-frame{
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  aspect-ratio: auto;
  overflow: hidden;             /* clip image to the rounded corners */
  border-radius: 22px !important;
}
.exp-embed .p-hero-wrap{
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}
/* the photo fills the frame, edge-to-edge, with rounded corners */
.exp-embed .device-frame .p-hero-img{
  border-radius: 22px;          /* matches the frame */
  background: transparent;
  max-height: 460px;
  width: 100%;
  height: auto;
  /*object-fit: contain;*/
  object-fit: cover;
  display: block;
}
/* keep hover clean */
.exp-embed .p-media:hover .device-frame{transform:none; box-shadow:none;}

/* ===== dialog (Explore) hero image: same clean look as product row ===== */
.exp-embed .dlg-hero-frame{
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 22px !important;
  overflow: hidden !important;
}
.exp-embed .dlg-hero-img{
  border-radius: 22px;
  background: transparent;
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}
/* gallery-tab hero (Gallery tab inside dialog) — same clean look */
.exp-embed .gal-main{
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 22px;
  overflow: hidden;
}
.exp-embed .gal-main-img{
  border-radius: 22px;
  background: transparent;
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

/* remove the "Hero / Technology / ..." floating label from gallery main image */
.exp-embed .gal-label{ display: none !important; }

/* let gallery main image show fully — no forced 16/10 crop */
.exp-embed .gal-main{
  aspect-ratio: auto !important;
  min-height: 340px;
  max-height: 560px;
  height: auto !important;
}
.exp-embed .gal-main-img{
  height: auto !important;
  max-height: 560px !important;
  width: 100%;
  object-fit: contain !important;
}

/* hide the "COUNTERTOP · COMPACT" eyebrow badge inside the dialog header */
.exp-embed #dlg-badge{ display: none !important; }

/* remove feature icons on Features tab */
.exp-embed .feat-icon{ display: none !important; }
.exp-embed .feat-item{ gap: 0 !important; }

/* gallery image: smaller so it fits in one scroll comfortably */
.exp-embed .gal-main,
.exp-embed .gal-main-img{
  max-height: 380px !important;
}
.exp-embed .gal-main{ min-height: 300px !important; }

/* dialog overview hero on desktop: also cap it so the whole dialog isn't dominated by the image */
@media (min-width:861px){
  .exp-embed .dlg-hero-img{ max-height: 400px !important; min-height: 280px !important; }
}

/* features list: use full width, no 440px cap that leaves blank space on the right */
.exp-embed .feat-item,
.exp-embed .feat-item p,
.exp-embed .feat-item h5{
  max-width: none !important;
  width: 100%;
}
.exp-embed .feat-list{ gap: 22px; }

/* sticky Live Demo — temporarily disabled (client asked to hide for now) */
button.sticky-demo.exp-embed,
.exp-embed.sd-modal{ display: none !important; }
