/* modern SaaS type: Inter for text, Inter Tight for headings, IBM Plex Sans Arabic for Arabic (loaded for real; before, Inter was named but never downloaded) */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Inter+Tight:wght@600;700;800&family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap");
:root{
 --pub-bg:#101416;
 --pub-bg-soft:#14191b;
 --pub-panel:rgba(22,28,30,.78);
 --pub-panel-solid:#171c1e;
 --pub-panel-2:#1d2325;
 --pub-text:#f4f3ee;
 --pub-muted:#a7adae;
 --pub-line:rgba(255,255,255,.12);
 --pub-line-strong:rgba(255,255,255,.2);
 --pub-primary:#f4f3ee;
 --pub-primary-text:#101416;
 --pub-shadow:0 24px 70px rgba(0,0,0,.28);
}

html[data-theme="light"]{
 --pub-bg:#f3f3ef;
 --pub-bg-soft:#ebece8;
 --pub-panel:rgba(255,255,255,.86);
 --pub-panel-solid:#fff;
 --pub-panel-2:#eceeea;
 --pub-text:#151919;
 --pub-muted:#686e6f;
 --pub-line:rgba(15,20,20,.12);
 --pub-line-strong:rgba(15,20,20,.2);
 --pub-primary:#151919;
 --pub-primary-text:#fff;
 --pub-shadow:0 20px 55px rgba(20,25,25,.1);
}

*{box-sizing:border-box}

html{
 scroll-behavior:smooth;
 background:var(--pub-bg);
}

html,body{
 margin:0;
 min-height:100%;
 background:var(--pub-bg);
 color:var(--pub-text);
}

body{
 font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
 -webkit-font-smoothing:antialiased;
}

body,
button,
input{
 font:inherit;
}

a{
 color:inherit;
}

button{
 color:inherit;
}

#mol-public-root{
 min-height:100vh;
 overflow:hidden;
 background:
  radial-gradient(circle at 50% 10%,rgba(255,255,255,.028),transparent 40%),
  var(--pub-bg);
}

.pub-header{
 position:relative;
 z-index:50;
 width:min(1260px,calc(100% - 64px));
 height:76px;
 margin:auto;
 display:grid;
 grid-template-columns:auto 1fr auto;
 align-items:center;
 gap:38px;
 border-bottom:1px solid var(--pub-line);
}

.pub-brand{
 display:inline-flex;
 align-items:center;
 gap:11px;
 text-decoration:none;
 color:var(--pub-text);
 white-space:nowrap;
}

.pub-brand-icon{
 width:30px!important;
 height:30px!important;
 min-width:30px!important;
 max-width:30px!important;
 min-height:30px!important;
 max-height:30px!important;
 position:relative;
 display:block;
 overflow:hidden;
}

.pub-brand-icon img{
 position:absolute;
 inset:0;
 width:30px!important;
 height:30px!important;
 max-width:30px!important;
 max-height:30px!important;
 object-fit:contain!important;
}

/* ACTUAL THEME-CONTRAST LOCK */
.pub-logo-dark,
.pub-logo-light{
 display:none!important;
}

html[data-theme="dark"] .pub-logo-dark{
 display:block!important;
}

html[data-theme="light"] .pub-logo-light{
 display:block!important;
}

.pub-brand strong{
 font-size:15px;
 letter-spacing:.055em;
 font-weight:800;
}

.pub-nav{
 display:flex;
 justify-content:center;
 gap:32px;
}

.pub-nav a,
.pub-signin,
.pub-dashboard-link{
 color:var(--pub-muted);
 text-decoration:none;
 font-size:13px;
 font-weight:500;
 transition:.15s ease;
 white-space:nowrap;
}

.pub-nav a:hover,
.pub-signin:hover,
.pub-dashboard-link:hover{
 color:var(--pub-text);
}

.pub-actions{
 display:flex;
 align-items:center;
 gap:8px;
}

.pub-pop{
 position:relative;
}

.pub-icon-button,
.pub-avatar{
 width:36px;
 height:36px;
 display:grid;
 place-items:center;
 padding:0;
 border:1px solid transparent;
 border-radius:10px;
 background:transparent;
 color:var(--pub-text);
 cursor:pointer;
}

.pub-icon-button:hover,
.pub-avatar:hover{
 background:var(--pub-panel);
 border-color:var(--pub-line);
}

.pub-icon-button svg,
.pub-menu svg,
.pub-primary svg,
.pub-secondary svg{
 width:17px;
 height:17px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.8;
 stroke-linecap:round;
 stroke-linejoin:round;
}

.pub-avatar{
 border-radius:50%;
 background:var(--pub-panel-2);
 border-color:var(--pub-line);
 font-weight:700;
}

.pub-menu{
 position:absolute;
 top:44px;
 right:0;
 min-width:150px;
 padding:6px;
 border:1px solid var(--pub-line);
 border-radius:12px;
 background:var(--pub-panel-solid);
 box-shadow:var(--pub-shadow);
 z-index:200;
}

.pub-menu[hidden]{
 display:none!important;
}

.pub-menu button,
.pub-menu a{
 width:100%;
 min-height:34px;
 padding:7px 9px;
 border:0;
 border-radius:8px;
 background:transparent;
 color:var(--pub-text);
 display:flex;
 align-items:center;
 gap:8px;
 text-decoration:none;
 cursor:pointer;
 text-align:left;
 font-size:12px;
}

.pub-menu button:hover,
.pub-menu a:hover,
.pub-menu button.active{
 background:var(--pub-panel-2);
}

.pub-lang-menu{
 min-width:64px;
}

.pub-lang-menu button{
 justify-content:center;
}

.pub-theme-menu{
 min-width:138px;
}

.pub-profile-email{
 display:block;
 padding:7px 9px 9px;
 color:var(--pub-muted);
 font-size:11px;
 overflow:hidden;
 text-overflow:ellipsis;
}

.pub-primary,
.pub-secondary{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:9px;
 min-height:42px;
 padding:10px 16px;
 border-radius:9px;
 text-decoration:none;
 font-weight:650;
 font-size:13px;
 transition:.16s ease;
}

.pub-primary{
 background:var(--pub-primary);
 color:var(--pub-primary-text);
 border:1px solid var(--pub-primary);
}

.pub-secondary{
 background:rgba(10,14,15,.3);
 color:#f3f3ef;
 border:1px solid rgba(255,255,255,.25);
 backdrop-filter:blur(12px);
}

html[data-theme="light"] .pub-secondary{
 background:rgba(255,255,255,.68);
 color:#171b1b;
 border-color:rgba(15,20,20,.18);
}

.pub-primary:hover,
.pub-secondary:hover{
 transform:translateY(-1px);
}

.pub-primary svg,
.pub-secondary svg{
 width:15px;
 height:15px;
}

.pub-header-cta{
 min-height:38px;
 padding:8px 14px;
}

.pub-large{
 min-height:46px;
 padding:11px 19px;
}

.pub-home{
 width:100%;
}

.pub-eyebrow{
 display:block;
 margin-bottom:12px;
 font-size:10px;
 font-weight:800;
 letter-spacing:.28em;
 text-transform:uppercase;
 color:var(--pub-muted);
}

.pub-hero-final{
 position:relative;
 width:min(1440px,100%);
 min-height:520px;
 margin:0 auto;
 overflow:hidden;
 isolation:isolate;
}

.pub-hero-art{
 position:absolute;
 inset:0;
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center center;
 z-index:-3;
}

.pub-hero-overlay{
 position:absolute;
 inset:0;
 z-index:-2;
 background:
  linear-gradient(
   90deg,
   rgba(10,15,17,.98) 0%,
   rgba(10,15,17,.91) 24%,
   rgba(10,15,17,.47) 48%,
   rgba(10,15,17,.06) 75%
  ),
  linear-gradient(
   180deg,
   rgba(10,15,17,.1) 60%,
   var(--pub-bg) 100%
  );
}

html[data-theme="light"] .pub-hero-overlay{
 background:
  linear-gradient(
   90deg,
   rgba(243,243,239,.98) 0%,
   rgba(243,243,239,.91) 25%,
   rgba(243,243,239,.43) 49%,
   rgba(243,243,239,.05) 76%
  ),
  linear-gradient(
   180deg,
   rgba(243,243,239,.03) 62%,
   var(--pub-bg) 100%
  );
}

.pub-hero-copy{
 width:min(1260px,calc(100% - 64px));
 margin:auto;
 min-height:520px;
 display:flex;
 flex-direction:column;
 justify-content:center;
 align-items:flex-start;
 position:relative;
 z-index:2;
}

.pub-hero-copy h1{
 width:min(610px,52vw);
 margin:0 0 18px;
 font-size:clamp(48px,5.5vw,76px);
 line-height:.98;
 letter-spacing:-.055em;
 color:#f5f4ef;
 text-wrap:balance;
}

.pub-hero-copy>p{
 width:min(540px,48vw);
 margin:0;
 font-size:18px;
 line-height:1.55;
 color:#ced1cd;
}

html[data-theme="light"] .pub-hero-copy h1{
 color:#121616;
}

html[data-theme="light"] .pub-hero-copy>p{
 color:#4e5555;
}

.pub-hero-actions{
 display:flex;
 gap:12px;
 margin-top:28px;
 flex-wrap:wrap;
}

.pub-play{
 width:23px;
 height:23px;
 border:1px solid currentColor;
 border-radius:50%;
 display:grid;
 place-items:center;
 font-size:9px;
 padding-left:1px;
}

.pub-benefits{
 width:min(1260px,calc(100% - 64px));
 margin:0 auto;
 min-height:98px;
 display:grid;
 grid-template-columns:repeat(4,1fr);
 align-items:center;
 border-top:1px solid var(--pub-line);
 border-bottom:1px solid var(--pub-line);
}

.pub-benefits article{
 min-width:0;
 padding:19px 24px;
 display:flex;
 align-items:center;
 gap:15px;
 border-right:1px solid var(--pub-line);
}

.pub-benefits article:first-child{
 padding-left:0;
}

.pub-benefits article:last-child{
 border-right:0;
}

.pub-benefit-icon{
 width:48px;
 height:48px;
 flex:0 0 48px;
 display:grid;
 place-items:center;
 border:1px solid var(--pub-line);
 border-radius:50%;
 background:rgba(255,255,255,.025);
}

.pub-benefit-icon svg,
.pub-step-icon svg,
.pub-access-list svg{
 width:23px;
 height:23px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.7;
 stroke-linecap:round;
 stroke-linejoin:round;
}

.pub-benefits article>div{
 display:grid;
 gap:4px;
}

.pub-benefits strong{
 font-size:14px;
}

.pub-benefits span:last-child{
 color:var(--pub-muted);
 font-size:12px;
}

.pub-section{
 width:min(1260px,calc(100% - 64px));
 margin:auto;
 padding:64px 0 14px;
}

.pub-section-title{
 max-width:760px;
 margin:0 auto 28px;
 text-align:center;
}

.pub-section-title h2{
 margin:0;
 font-size:clamp(34px,4vw,48px);
 letter-spacing:-.045em;
 line-height:1;
}

.pub-section-title p{
 margin:10px auto 0;
 color:var(--pub-muted);
 font-size:15px;
 line-height:1.5;
}

.pub-step-flow{
 display:grid;
 grid-template-columns:1fr 26px 1fr 26px 1fr 26px 1fr 26px 1fr;
 align-items:stretch;
 gap:0;
}

.pub-step{
 position:relative;
 min-height:180px;
 padding:24px 20px 21px;
 border:1px solid var(--pub-line);
 border-radius:10px;
 background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.012));
 display:flex;
 flex-direction:column;
 align-items:center;
 text-align:center;
}

.pub-step-number{
 position:absolute;
 left:13px;
 top:13px;
 min-width:36px;
 height:36px;
 padding:0 9px;
 border-radius:20px;
 display:grid;
 place-items:center;
 background:var(--pub-panel-2);
 color:var(--pub-muted);
 font-size:11px;
}

.pub-step-icon{
 margin:5px 0 12px;
 width:43px;
 height:43px;
 display:grid;
 place-items:center;
}

.pub-step strong{
 font-size:16px;
}

.pub-step p{
 margin:8px 0 0;
 max-width:160px;
 color:var(--pub-muted);
 font-size:12px;
 line-height:1.45;
}

.pub-flow-arrow{
 display:grid;
 place-items:center;
 color:var(--pub-muted);
 font-size:26px;
}

.pub-examples-preview{
 padding-top:58px;
}

.pub-example-grid-final{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:14px;
}

.pub-example-card{
 overflow:hidden;
 border:1px solid var(--pub-line);
 border-radius:10px;
 background:var(--pub-panel);
}

.pub-example-image{
 position:relative;
 aspect-ratio:1.7/1;
 overflow:hidden;
 background:var(--pub-panel-2);
}

.pub-example-image img{
 width:100%;
 height:100%;
 display:block;
 object-fit:cover;
}

.pub-example-copy{
 padding:15px 17px 17px;
}

.pub-example-copy h3{
 margin:0;
 font-size:17px;
}

.pub-example-copy p{
 min-height:38px;
 margin:7px 0 12px;
 color:var(--pub-muted);
 font-size:12px;
 line-height:1.5;
}

.pub-example-copy a{
 display:inline-flex;
 align-items:center;
 gap:6px;
 text-decoration:none;
 font-size:12px;
 font-weight:700;
}

.pub-example-copy a svg{
 width:13px;
 height:13px;
 fill:none;
 stroke:currentColor;
 stroke-width:2;
}

.pub-access-section{
 width:min(1260px,calc(100% - 64px));
 margin:14px auto 0;
 min-height:410px;
 display:grid;
 grid-template-columns:minmax(0,1.3fr) minmax(340px,.7fr);
 align-items:center;
 gap:40px;
 position:relative;
 overflow:hidden;
}

.pub-access-art{
 align-self:stretch;
 min-height:400px;
 position:relative;
 overflow:hidden;
}

.pub-access-art:after{
 content:"";
 position:absolute;
 inset:0;
 pointer-events:none;
 background:linear-gradient(90deg,transparent 68%,var(--pub-bg) 100%);
}

.pub-access-art img{
 width:100%;
 height:100%;
 min-height:400px;
 display:block;
 object-fit:cover;
 object-position:center;
}

.pub-access-copy{
 position:relative;
 z-index:2;
 padding:34px 0;
}

.pub-access-copy h2{
 margin:0;
 font-size:clamp(36px,4vw,48px);
 line-height:1;
 letter-spacing:-.045em;
}

.pub-access-copy>p{
 margin:13px 0 18px;
 color:var(--pub-muted);
 line-height:1.5;
 font-size:15px;
}

.pub-access-list{
 margin:0 0 22px;
 padding:15px 17px;
 border:1px solid var(--pub-line);
 border-radius:10px;
 background:var(--pub-panel);
 display:grid;
 gap:9px;
}

.pub-access-list>span{
 display:flex;
 align-items:center;
 gap:9px;
 font-size:12px;
}

.pub-access-list i{
 width:20px;
 height:20px;
 flex:0 0 20px;
 display:grid;
 place-items:center;
 border:1px solid var(--pub-line-strong);
 border-radius:50%;
}

.pub-access-list i svg{
 width:12px;
 height:12px;
}

.pub-final-cta{
 width:min(1260px,calc(100% - 64px));
 margin:0 auto;
 padding:40px 0 48px;
 text-align:center;
 border-top:1px solid var(--pub-line);
}

.pub-final-cta h2{
 margin:0;
 font-size:34px;
 letter-spacing:-.04em;
}

.pub-final-cta p{
 margin:8px 0 17px;
 color:var(--pub-muted);
}

.pub-footer{
 width:min(1260px,calc(100% - 64px));
 margin:auto;
 padding:35px 0 48px;
 display:grid;
 grid-template-columns:2fr repeat(4,1fr);
 gap:34px;
 border-top:1px solid var(--pub-line);
}

.pub-footer-main p{
 max-width:260px;
 margin:10px 0 0;
 color:var(--pub-muted);
 font-size:11px;
 line-height:1.5;
}

.pub-footer>div:not(.pub-footer-main){
 display:grid;
 align-content:start;
 gap:7px;
}

.pub-footer strong{
 font-size:11px;
}

.pub-footer a{
 color:var(--pub-muted);
 text-decoration:none;
 font-size:10px;
}

.pub-simple-page{
 width:min(1260px,calc(100% - 64px));
 margin:auto;
 padding:72px 0 90px;
}

.pub-simple-head{
 max-width:760px;
 margin-bottom:34px;
}

.pub-simple-head h1{
 margin:0;
 font-size:clamp(42px,5vw,66px);
 line-height:1;
 letter-spacing:-.05em;
}

.pub-simple-head p{
 max-width:630px;
 margin:14px 0 0;
 color:var(--pub-muted);
 line-height:1.6;
}

.pub-price-simple{
 max-width:700px;
 padding:26px;
 border:1px solid var(--pub-line);
 border-radius:14px;
 background:var(--pub-panel);
}

/* RTL */

[dir="rtl"] .pub-header,
[dir="rtl"] .pub-hero-copy,
[dir="rtl"] .pub-footer,
[dir="rtl"] .pub-access-copy{
 direction:rtl;
}

[dir="rtl"] .pub-menu{
 right:auto;
 left:0;
}

[dir="rtl"] .pub-step-number{
 left:auto;
 right:13px;
}

/* TABLET */

@media(max-width:1024px){

 .pub-header,
 .pub-benefits,
 .pub-section,
 .pub-access-section,
 .pub-final-cta,
 .pub-footer,
 .pub-simple-page{
  width:min(100% - 40px,960px);
 }

 .pub-header{
  gap:20px;
 }

 .pub-nav{
  gap:18px;
 }

 .pub-hero-copy{
  width:min(100% - 40px,960px);
 }

 .pub-hero-copy h1{
  width:min(560px,60vw);
  font-size:58px;
 }

 .pub-hero-copy>p{
  width:min(500px,55vw);
 }

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

 .pub-benefits article:nth-child(2){
  border-right:0;
 }

 .pub-benefits article:first-child{
  padding-left:20px;
 }

 .pub-step-flow{
  grid-template-columns:repeat(5,1fr);
  gap:10px;
 }

 .pub-flow-arrow{
  display:none;
 }

 .pub-step{
  padding-left:14px;
  padding-right:14px;
 }

 .pub-access-section{
  grid-template-columns:1.15fr .85fr;
  gap:25px;
 }
}

/* 768 */

@media(max-width:800px){

 .pub-header{
  grid-template-columns:auto auto;
  justify-content:space-between;
 }

 .pub-nav{
  display:none;
 }

 .pub-dashboard-link,
 .pub-signin{
  display:none;
 }

 .pub-hero-final{
  min-height:690px;
 }

 .pub-hero-art{
  height:58%;
  top:auto;
  bottom:0;
  object-position:66% center;
 }

 .pub-hero-overlay{
  background:
   linear-gradient(180deg,var(--pub-bg) 0%,var(--pub-bg) 39%,rgba(16,20,22,.5) 65%,rgba(16,20,22,.12) 100%);
 }

 html[data-theme="light"] .pub-hero-overlay{
  background:
   linear-gradient(180deg,var(--pub-bg) 0%,var(--pub-bg) 39%,rgba(243,243,239,.45) 65%,rgba(243,243,239,.06) 100%);
 }

 .pub-hero-copy{
  min-height:390px;
  justify-content:flex-start;
  padding-top:62px;
 }

 .pub-hero-copy h1{
  width:min(650px,100%);
  font-size:56px;
 }

 .pub-hero-copy>p{
  width:min(590px,100%);
 }

 .pub-benefits{
  grid-template-columns:1fr 1fr;
 }

 .pub-step-flow{
  grid-template-columns:1fr 1fr;
 }

 .pub-example-grid-final{
  grid-template-columns:1fr;
 }

 .pub-example-image{
  aspect-ratio:2/1;
 }

 .pub-access-section{
  grid-template-columns:1fr;
  gap:0;
 }

 .pub-access-art{
  min-height:360px;
 }

 .pub-access-art img{
  min-height:360px;
 }

 .pub-access-art:after{
  background:linear-gradient(180deg,transparent 65%,var(--pub-bg) 100%);
 }

 .pub-access-copy{
  margin-top:-50px;
  padding:0 20px 45px;
 }

 .pub-footer{
  grid-template-columns:1.5fr 1fr 1fr;
 }

 .pub-footer>div:nth-child(4),
 .pub-footer>div:nth-child(5){
  margin-top:18px;
 }
}

/* MOBILE */

@media(max-width:520px){

 .pub-header,
 .pub-benefits,
 .pub-section,
 .pub-access-section,
 .pub-final-cta,
 .pub-footer,
 .pub-simple-page{
  width:calc(100% - 28px);
 }

 .pub-header{
  height:68px;
 }

 .pub-brand-icon,
 .pub-brand-icon img{
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  max-width:27px!important;
 }

 .pub-brand strong{
  font-size:13px;
 }

 .pub-actions{
  gap:4px;
 }

 .pub-icon-button,
 .pub-avatar{
  width:34px;
  height:34px;
 }

 .pub-header-cta{
  display:none;
 }

 .pub-hero-final{
  min-height:650px;
 }

 .pub-hero-copy{
  width:calc(100% - 28px);
  min-height:360px;
  padding-top:52px;
 }

 .pub-hero-copy h1{
  font-size:45px;
  line-height:1;
 }

 .pub-hero-copy>p{
  font-size:15px;
  line-height:1.5;
 }

 .pub-hero-actions{
  width:100%;
 }

 .pub-hero-actions a{
  flex:1;
  min-width:135px;
 }

 .pub-hero-art{
  height:48%;
  object-position:63% center;
 }

 .pub-benefits{
  grid-template-columns:1fr 1fr;
 }

 .pub-benefits article{
  min-height:94px;
  padding:15px 8px;
  gap:10px;
  border-bottom:1px solid var(--pub-line);
 }

 .pub-benefits article:first-child{
  padding-left:8px;
 }

 .pub-benefit-icon{
  width:40px;
  height:40px;
  flex-basis:40px;
 }

 .pub-benefit-icon svg{
  width:19px;
  height:19px;
 }

 .pub-benefits strong{
  font-size:12px;
 }

 .pub-benefits span:last-child{
  font-size:10px;
 }

 .pub-section{
  padding-top:48px;
 }

 .pub-section-title h2{
  font-size:37px;
 }

 .pub-section-title p{
  font-size:13px;
 }

 .pub-step-flow{
  grid-template-columns:1fr;
  gap:9px;
 }

 .pub-step{
  min-height:138px;
 }

 .pub-example-image{
  aspect-ratio:1.55/1;
 }

 .pub-access-art,
 .pub-access-art img{
  min-height:290px;
 }

 .pub-access-copy{
  padding-left:4px;
  padding-right:4px;
 }

 .pub-final-cta h2{
  font-size:30px;
 }

 .pub-footer{
  grid-template-columns:1fr 1fr;
  gap:25px 18px;
 }

 .pub-footer-main{
  grid-column:1/-1;
 }

 .pub-simple-page{
  padding-top:55px;
 }

 .pub-simple-head h1{
  font-size:45px;
 }
}


/* =========================================================
   MOLANSIA HOME FINAL POLISH V2
   ========================================================= */

body[data-page="home"] .pub-header{
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  z-index:100;
  background:transparent;
  border-bottom-color:rgba(255,255,255,.10);
}

body[data-page="home"] .pub-hero-final{
  margin-top:0;
  min-height:600px;
}

body[data-page="home"] .pub-hero-copy{
  min-height:600px;
  padding-top:76px;
}

body[data-page="home"] .pub-nav a,
body[data-page="home"] .pub-signin,
body[data-page="home"] .pub-dashboard-link{
  color:rgba(245,244,239,.76);
}

body[data-page="home"] .pub-nav a:hover,
body[data-page="home"] .pub-signin:hover,
body[data-page="home"] .pub-dashboard-link:hover{
  color:#f5f4ef;
}

body[data-page="home"] .pub-brand{
  color:#f5f4ef;
}

/* homepage hero is dark artwork => force white official logo */
body[data-page="home"] .pub-logo-dark{
  display:block!important;
}

body[data-page="home"] .pub-logo-light{
  display:none!important;
}

body[data-page="home"] .pub-icon-button{
  color:#f5f4ef;
}

/* Arabic: keep same physical composition as English */
html[dir="rtl"] body[data-page="home"] .pub-hero-final{
  direction:ltr;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
  direction:rtl;
  text-align:right;
  align-items:flex-start;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
  direction:rtl;
  justify-content:flex-start;
}

/* lower image stays LEFT, Creator Access stays RIGHT */
html[dir="rtl"] body[data-page="home"] .pub-access-section{
  direction:ltr;
}

html[dir="rtl"] body[data-page="home"] .pub-access-copy{
  direction:rtl;
  text-align:right;
}

html[dir="rtl"] body[data-page="home"] .pub-access-list{
  direction:rtl;
}

@media(max-width:800px){

  body[data-page="home"] .pub-header{
    width:calc(100% - 40px);
  }

  body[data-page="home"] .pub-hero-final{
    min-height:720px;
  }

  body[data-page="home"] .pub-hero-copy{
    min-height:410px;
    padding-top:118px;
  }
}

@media(max-width:520px){

  body[data-page="home"] .pub-header{
    width:calc(100% - 28px);
  }

  body[data-page="home"] .pub-hero-final{
    min-height:680px;
  }

  body[data-page="home"] .pub-hero-copy{
    min-height:385px;
    padding-top:108px;
  }
}


/* =========================================================
   MOLANSIA AR HERO + HEADER CONTRAST FIX V2
   ========================================================= */

/* HERO TITLE — one more size */
.pub-hero-copy h1{
  font-size:clamp(54px,6vw,84px)!important;
}

/* ---------------------------------------------------------
   ARABIC HERO
   Keep text on the physically clearer LEFT side
   while the Arabic text itself remains RTL.
   --------------------------------------------------------- */

html[dir="rtl"] body[data-page="home"] .pub-hero-final{
  direction:ltr!important;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-start!important;

  /* force physical LEFT placement */
  margin-left:0!important;
  margin-right:auto!important;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-copy h1,
html[dir="rtl"] body[data-page="home"] .pub-hero-copy>p{
  margin-left:0!important;
  margin-right:0!important;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
  direction:rtl!important;
  justify-content:flex-start!important;
  align-self:flex-start!important;
}

/* ---------------------------------------------------------
   ARABIC CREATOR ACCESS
   Keep physical image/text sides exactly like EN.
   --------------------------------------------------------- */

html[dir="rtl"] body[data-page="home"] .pub-access-section{
  direction:ltr!important;
}

html[dir="rtl"] body[data-page="home"] .pub-access-copy{
  direction:rtl!important;
  text-align:right!important;
}

html[dir="rtl"] body[data-page="home"] .pub-access-list{
  direction:rtl!important;
}

/* ---------------------------------------------------------
   PROFILE ICON
   --------------------------------------------------------- */

.pub-avatar{
  font-size:0!important;
}

.pub-avatar svg{
  width:18px!important;
  height:18px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

/* ---------------------------------------------------------
   TRANSPARENT HOME HEADER — DARK MODE
   --------------------------------------------------------- */

html[data-theme="dark"] body[data-page="home"] .pub-header,
html[data-theme="dark"] body[data-page="home"] .pub-brand,
html[data-theme="dark"] body[data-page="home"] .pub-brand strong,
html[data-theme="dark"] body[data-page="home"] .pub-nav a,
html[data-theme="dark"] body[data-page="home"] .pub-signin,
html[data-theme="dark"] body[data-page="home"] .pub-dashboard-link,
html[data-theme="dark"] body[data-page="home"] .pub-icon-button,
html[data-theme="dark"] body[data-page="home"] .pub-avatar{
  color:#f5f4ef!important;
}

/* dark theme => WHITE official symbol */
html[data-theme="dark"] body[data-page="home"] .pub-logo-dark{
  display:block!important;
}

html[data-theme="dark"] body[data-page="home"] .pub-logo-light{
  display:none!important;
}

/* ---------------------------------------------------------
   TRANSPARENT HOME HEADER — LIGHT MODE
   --------------------------------------------------------- */

html[data-theme="light"] body[data-page="home"] .pub-header,
html[data-theme="light"] body[data-page="home"] .pub-brand,
html[data-theme="light"] body[data-page="home"] .pub-brand strong,
html[data-theme="light"] body[data-page="home"] .pub-nav a,
html[data-theme="light"] body[data-page="home"] .pub-signin,
html[data-theme="light"] body[data-page="home"] .pub-dashboard-link,
html[data-theme="light"] body[data-page="home"] .pub-icon-button,
html[data-theme="light"] body[data-page="home"] .pub-avatar{
  color:#111515!important;
}

/* light theme => DARK official symbol */
html[data-theme="light"] body[data-page="home"] .pub-logo-dark{
  display:none!important;
}

html[data-theme="light"] body[data-page="home"] .pub-logo-light{
  display:block!important;
}

/* Make utility icons readable on bright hero area */
html[data-theme="light"] body[data-page="home"] .pub-icon-button,
html[data-theme="light"] body[data-page="home"] .pub-avatar{
  background:rgba(255,255,255,.68)!important;
  border-color:rgba(20,24,24,.12)!important;
  backdrop-filter:blur(10px);
}

html[data-theme="dark"] body[data-page="home"] .pub-icon-button,
html[data-theme="dark"] body[data-page="home"] .pub-avatar{
  background:rgba(8,12,13,.24)!important;
  border-color:rgba(255,255,255,.08)!important;
  backdrop-filter:blur(10px);
}

/* Header text gets subtle readability support without adding a bar */
body[data-page="home"] .pub-brand strong,
body[data-page="home"] .pub-nav a,
body[data-page="home"] .pub-signin,
body[data-page="home"] .pub-dashboard-link{
  text-shadow:0 1px 12px rgba(0,0,0,.16);
}

/* ---------------------------------------------------------
   TABLET
   --------------------------------------------------------- */

@media(max-width:1024px){
  .pub-hero-copy h1{
    font-size:64px!important;
  }
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:520px){
  .pub-hero-copy h1{
    font-size:48px!important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
    text-align:right!important;
    align-items:flex-start!important;
  }
}


/* =========================================================
   ARABIC HEADER/HERO — NO PHYSICAL FLIP
   ========================================================= */

/* Header keeps English/French physical order */
html[dir="rtl"] body[data-page="home"] .pub-header{
  direction:ltr!important;
}

/* Brand stays on LEFT */
html[dir="rtl"] body[data-page="home"] .pub-brand{
  direction:ltr!important;
}

/* Center nav keeps same order and same physical location */
html[dir="rtl"] body[data-page="home"] .pub-nav{
  direction:ltr!important;
}

/* Utility/profile controls stay on RIGHT */
html[dir="rtl"] body[data-page="home"] .pub-actions{
  direction:ltr!important;
}

/* Menu content itself can remain readable */
html[dir="rtl"] body[data-page="home"] .pub-menu{
  direction:rtl!important;
  text-align:right;
}

/* ---------------------------------------------------------
   HERO:
   physical composition identical to EN/FR
   --------------------------------------------------------- */

html[dir="rtl"] body[data-page="home"] .pub-hero-final{
  direction:ltr!important;
}

/* Text block stays physically on LEFT */
html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
  direction:rtl!important;
  text-align:right!important;
  align-items:flex-start!important;

  margin-left:auto!important;
  margin-right:auto!important;
}

/* Force same left-side content box behavior as English */
html[dir="rtl"] body[data-page="home"] .pub-hero-copy h1{
  width:min(610px,52vw)!important;
  align-self:flex-start!important;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-copy>p{
  width:min(540px,48vw)!important;
  align-self:flex-start!important;
}

/* CTA group stays in same physical LEFT area */
html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
  direction:ltr!important;
  justify-content:flex-start!important;
  align-self:flex-start!important;
}

/* Buttons can still show Arabic correctly */
html[dir="rtl"] body[data-page="home"] .pub-hero-actions a{
  direction:rtl!important;
}

/* ---------------------------------------------------------
   MOBILE/TABLET:
   keep same physical ordering as EN/FR
   --------------------------------------------------------- */

@media(max-width:800px){

  html[dir="rtl"] body[data-page="home"] .pub-header{
    direction:ltr!important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
    direction:rtl!important;
    text-align:right!important;
    align-items:flex-start!important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy h1,
  html[dir="rtl"] body[data-page="home"] .pub-hero-copy>p{
    width:min(100%,650px)!important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
    direction:ltr!important;
    justify-content:flex-start!important;
  }
}

@media(max-width:520px){

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
    width:100%;
  }
}

/* MOLANSIA_AR_HERO_LEFT_LOCK_START */

/* =========================================================
   AR HOMEPAGE HERO:
   keep same PHYSICAL layout as EN/FR
   - text block stays on LEFT
   - buttons stay under text on LEFT
   - Arabic text remains RTL
   ========================================================= */

html[dir="rtl"] body[data-page="home"] .pub-hero-final{
  direction:ltr !important;
  position:relative !important;
}

html[dir="rtl"] body[data-page="home"] .pub-hero-inner,
html[dir="rtl"] body[data-page="home"] .pub-hero-overlay,
html[dir="rtl"] body[data-page="home"] .pub-hero-content{
  direction:ltr !important;
}

/* ---------- DESKTOP / LARGE TABLET ---------- */
@media (min-width: 901px){

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
    direction:rtl !important;
    text-align:right !important;

    position:absolute !important;
    left:clamp(28px,4vw,56px) !important;
    right:auto !important;
    top:50% !important;
    transform:translateY(-50%) !important;

    width:min(620px,44vw) !important;
    max-width:min(620px,44vw) !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:center !important;

    margin:0 !important;
    z-index:3 !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy > *{
    direction:rtl !important;
    text-align:right !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy h1{
    width:100% !important;
    max-width:100% !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy > p{
    width:100% !important;
    max-width:100% !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
    direction:ltr !important;
    display:flex !important;
    flex-direction:row !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:14px !important;

    width:auto !important;
    margin:0 !important;
    align-self:flex-start !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions a,
  html[dir="rtl"] body[data-page="home"] .pub-hero-actions button{
    direction:rtl !important;
    text-align:center !important;
  }
}

/* ---------- MOBILE / SMALL TABLET ---------- */
@media (max-width: 900px){

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy{
    direction:rtl !important;
    text-align:right !important;

    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    transform:none !important;

    width:min(100%,680px) !important;
    max-width:min(100%,680px) !important;

    margin-left:0 !important;
    margin-right:auto !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-copy > *{
    direction:rtl !important;
    text-align:right !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions{
    direction:ltr !important;
    display:flex !important;
    flex-direction:row !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:12px !important;

    width:auto !important;
    margin:0 !important;
    align-self:flex-start !important;
    flex-wrap:wrap !important;
  }

  html[dir="rtl"] body[data-page="home"] .pub-hero-actions a,
  html[dir="rtl"] body[data-page="home"] .pub-hero-actions button{
    direction:rtl !important;
    text-align:center !important;
  }
}

/* MOLANSIA_AR_HERO_LEFT_LOCK_END */



/* MOLANSIA_EXAMPLES_FINAL_START */

/* =========================================================
   EXAMPLES FINAL
   Uses ONLY global Homepage color tokens.
   ========================================================= */

.examples-final{
 width:min(1260px,calc(100% - 64px));
 margin:0 auto;
 padding:48px 0 0;
}

/* HERO */

.ex-hero{
 min-height:420px;
 display:grid;
 grid-template-columns:minmax(0,.82fr) minmax(520px,1.18fr);
 align-items:center;
 gap:54px;
 padding:26px 0 48px;
 border-bottom:1px solid var(--pub-line);
}

.ex-hero-copy h1{
 margin:0;
 max-width:620px;
 font-size:clamp(48px,5.1vw,72px);
 line-height:.98;
 letter-spacing:-.055em;
 text-wrap:balance;
}

.ex-hero-copy>p{
 max-width:610px;
 margin:20px 0 0;
 color:var(--pub-muted);
 font-size:17px;
 line-height:1.65;
}

.ex-hero-actions{
 display:flex;
 flex-wrap:wrap;
 gap:11px;
 margin-top:27px;
}

.ex-hero-visual{
 position:relative;
 min-height:340px;
 overflow:hidden;
 border:1px solid var(--pub-line);
 border-radius:16px;
 background:var(--pub-panel);
 box-shadow:var(--pub-shadow);
}

.ex-hero-visual:after{
 content:"";
 position:absolute;
 inset:0;
 background:
  linear-gradient(
   90deg,
   var(--pub-bg) 0%,
   transparent 18%,
   transparent 100%
  );
 pointer-events:none;
 opacity:.4;
}

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

/* MAIN 3 CARDS */

.ex-showcase-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:14px;
 padding:42px 0;
}

.ex-showcase-card{
 min-width:0;
 display:flex;
 flex-direction:column;
 overflow:hidden;
 border:1px solid var(--pub-line);
 border-radius:14px;
 background:var(--pub-panel);
 box-shadow:0 12px 34px rgba(0,0,0,.08);
}

.ex-card-head{
 min-height:116px;
 padding:20px;
 display:flex;
 gap:14px;
 align-items:flex-start;
}

.ex-card-icon{
 width:43px;
 height:43px;
 flex:0 0 43px;
 display:grid;
 place-items:center;
 border:1px solid var(--pub-line);
 border-radius:10px;
 background:var(--pub-panel-2);
}

.ex-card-icon svg{
 width:21px;
 height:21px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.7;
}

.ex-card-head h2{
 margin:1px 0 5px;
 font-size:20px;
 line-height:1.15;
 letter-spacing:-.025em;
}

.ex-card-head p{
 margin:0;
 color:var(--pub-muted);
 font-size:12px;
 line-height:1.5;
}

.ex-card-media{
 position:relative;
 aspect-ratio:1.18/1;
 overflow:hidden;
 background:var(--pub-panel-2);
 border-top:1px solid var(--pub-line);
 border-bottom:1px solid var(--pub-line);
}

.ex-card-media img{
 width:100%;
 height:100%;
 display:block;
 object-fit:cover;
 object-position:center;
 transition:transform .35s ease;
}

.ex-showcase-card:hover .ex-card-media img{
 transform:scale(1.018);
}

.ex-card-list{
 margin:0;
 padding:16px 20px 8px;
 list-style:none;
 display:grid;
 gap:8px;
}

.ex-card-list li{
 display:flex;
 align-items:center;
 gap:8px;
 color:var(--pub-muted);
 font-size:11px;
}

.ex-card-list svg{
 width:13px;
 height:13px;
 fill:none;
 stroke:currentColor;
 stroke-width:2;
}

.ex-card-cta{
 margin:auto 12px 12px;
 min-height:42px;
 padding:10px 14px;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:7px;
 border-radius:8px;
 text-decoration:none;
 background:var(--pub-primary);
 color:var(--pub-primary-text);
 font-weight:700;
 font-size:12px;
}

.ex-card-cta svg{
 width:14px;
 height:14px;
 fill:none;
 stroke:currentColor;
 stroke-width:2;
}

/* IDEA -> LAUNCH */

.ex-flow-section{
 padding:34px 0 54px;
 border-top:1px solid var(--pub-line);
}

.ex-flow{
 display:grid;
 grid-template-columns:1fr 28px 1fr 28px 1fr 28px 1fr 28px 1fr;
 gap:0;
 align-items:stretch;
 margin-top:28px;
}

.ex-flow-item{
 min-width:0;
 min-height:180px;
 padding:14px;
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 border:1px solid var(--pub-line);
 border-radius:11px;
 background:var(--pub-panel);
}

.ex-flow-icon{
 width:38px;
 height:38px;
 display:grid;
 place-items:center;
 margin-bottom:14px;
 border:1px solid var(--pub-line);
 border-radius:9px;
 background:var(--pub-panel-2);
}

.ex-flow-icon svg{
 width:19px;
 height:19px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.7;
}

.ex-flow-image{
 width:100%;
 height:85px;
 margin-bottom:14px;
 overflow:hidden;
 border-radius:8px;
 background:var(--pub-panel-2);
}

.ex-flow-image img{
 width:100%;
 height:100%;
 object-fit:cover;
 display:block;
}

.ex-flow-item strong{
 font-size:13px;
}

.ex-flow-item p{
 margin:6px 0 0;
 color:var(--pub-muted);
 font-size:10px;
 line-height:1.45;
}

.ex-flow-arrow{
 display:grid;
 place-items:center;
 color:var(--pub-muted);
 font-size:25px;
}

/* FINAL CTA */

.ex-final{
 min-height:310px;
 display:grid;
 grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);
 align-items:center;
 gap:40px;
 overflow:hidden;
 border-top:1px solid var(--pub-line);
}

.ex-final-copy{
 padding:46px 0;
 position:relative;
 z-index:2;
}

.ex-final-copy h2{
 margin:0;
 max-width:600px;
 font-size:clamp(36px,4.2vw,56px);
 line-height:1;
 letter-spacing:-.045em;
}

.ex-final-copy>p{
 max-width:560px;
 margin:15px 0 22px;
 color:var(--pub-muted);
 font-size:14px;
 line-height:1.6;
}

.ex-final-art{
 align-self:stretch;
 min-height:310px;
 position:relative;
 overflow:hidden;
}

.ex-final-art:before{
 content:"";
 position:absolute;
 inset:0;
 z-index:1;
 background:linear-gradient(
  90deg,
  var(--pub-bg) 0%,
  transparent 38%,
  transparent 100%
 );
 pointer-events:none;
}

.ex-final-art img{
 width:100%;
 height:100%;
 min-height:310px;
 display:block;
 object-fit:cover;
 object-position:center;
}

/* =========================================================
   ARABIC
   RTL text but no unnecessary visual destruction.
   ========================================================= */

html[dir="rtl"] .examples-final{
 direction:rtl;
}

html[dir="rtl"] .ex-hero-copy,
html[dir="rtl"] .ex-card-head,
html[dir="rtl"] .ex-card-list,
html[dir="rtl"] .ex-final-copy,
html[dir="rtl"] .ex-flow-item{
 text-align:right;
}

html[dir="rtl"] .ex-card-list li{
 flex-direction:row;
}

html[dir="rtl"] .ex-hero-actions{
 justify-content:flex-start;
}

html[dir="rtl"] .ex-card-cta svg{
 transform:scaleX(-1);
}

html[dir="rtl"] .ex-flow-arrow{
 transform:scaleX(-1);
}

/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1024px){

 .examples-final{
  width:min(100% - 40px,960px);
 }

 .ex-hero{
  grid-template-columns:1fr 1fr;
  gap:30px;
 }

 .ex-hero-copy h1{
  font-size:54px;
 }

 .ex-showcase-grid{
  gap:10px;
 }

 .ex-card-head{
  padding:15px;
 }

 .ex-card-list{
  padding-left:15px;
  padding-right:15px;
 }

 .ex-flow{
  grid-template-columns:repeat(5,1fr);
  gap:9px;
 }

 .ex-flow-arrow{
  display:none;
 }

 .ex-final{
  gap:24px;
 }
}

/* =========================================================
   768
   ========================================================= */

@media(max-width:800px){

 .ex-hero{
  grid-template-columns:1fr;
  padding-top:38px;
 }

 .ex-hero-copy{
  max-width:690px;
 }

 .ex-hero-copy h1{
  font-size:55px;
 }

 .ex-hero-visual{
  min-height:390px;
 }

 .ex-hero-visual:after{
  display:none;
 }

 .ex-showcase-grid{
  grid-template-columns:1fr;
 }

 .ex-showcase-card{
  display:grid;
  grid-template-columns:1fr 1.2fr;
 }

 .ex-card-head{
  grid-column:1;
 }

 .ex-card-media{
  grid-column:2;
  grid-row:1 / span 3;
  height:100%;
  aspect-ratio:auto;
 }

 .ex-card-list{
  grid-column:1;
 }

 .ex-card-cta{
  grid-column:1;
 }

 .ex-flow{
  grid-template-columns:1fr 1fr;
 }

 .ex-final{
  grid-template-columns:1fr;
 }

 .ex-final-art{
  min-height:350px;
 }

 .ex-final-art:before{
  background:linear-gradient(
   180deg,
   var(--pub-bg) 0%,
   transparent 30%
  );
 }
}

/* =========================================================
   MOBILE 390
   ========================================================= */

@media(max-width:520px){

 .examples-final{
  width:calc(100% - 28px);
 }

 .ex-hero{
  gap:24px;
  padding-top:30px;
 }

 .ex-hero-copy h1{
  font-size:43px;
 }

 .ex-hero-copy>p{
  font-size:15px;
 }

 .ex-hero-actions{
  width:100%;
 }

 .ex-hero-actions a{
  flex:1;
  min-width:130px;
 }

 .ex-hero-visual{
  min-height:260px;
 }

 .ex-showcase-grid{
  padding-top:28px;
 }

 .ex-showcase-card{
  display:flex;
 }

 .ex-card-head{
  min-height:auto;
 }

 .ex-card-media{
  width:100%;
  aspect-ratio:1.25/1;
  height:auto;
 }

 .ex-flow{
  grid-template-columns:1fr;
 }

 .ex-flow-item{
  min-height:140px;
 }

 .ex-final-copy h2{
  font-size:40px;
 }

 .ex-final-art,
 .ex-final-art img{
  min-height:260px;
 }
}

/* MOLANSIA_EXAMPLES_FINAL_END */

/* MOLANSIA_HERO_BODY_FINAL_SIZE_START */

/* Homepage hero descriptive text only */
body[data-page="home"] .pub-hero-copy > p{
  font-size:clamp(18px,1.25vw,22px)!important;
  line-height:1.65!important;
  max-width:38ch!important;
}

/* Arabic readability */
html[dir="rtl"] body[data-page="home"] .pub-hero-copy > p{
  font-size:clamp(19px,1.35vw,23px)!important;
  line-height:1.75!important;
  max-width:36ch!important;
}

@media(max-width:800px){
 body[data-page="home"] .pub-hero-copy > p{
  font-size:17px!important;
 }

 html[dir="rtl"] body[data-page="home"] .pub-hero-copy > p{
  font-size:18px!important;
 }
}

/* MOLANSIA_HERO_BODY_FINAL_SIZE_END */

/* MOLANSIA_EXAMPLES_5STEP_FINAL_START */

.ex-flow-section .pub-section-title{
  max-width:820px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}

.ex-flow{
  width:100%!important;
  max-width:1180px!important;

  margin:30px auto 0!important;

  display:grid!important;

  grid-template-columns:
    minmax(0,1fr)
    24px
    minmax(0,1fr)
    24px
    minmax(0,1fr)
    24px
    minmax(0,1fr)
    24px
    minmax(0,1fr)!important;

  gap:0!important;
  align-items:stretch!important;
}

.ex-flow-item{
  min-width:0!important;
  min-height:205px!important;

  padding:12px!important;

  border:1px solid var(--pub-line)!important;
  border-radius:11px!important;

  background:var(--pub-panel)!important;
}

.ex-flow-image{
  width:100%!important;
  height:105px!important;

  margin-bottom:13px!important;

  overflow:hidden!important;

  border-radius:8px!important;

  background:var(--pub-panel-2)!important;
}

.ex-flow-image img{
  width:100%!important;
  height:100%!important;

  object-fit:cover!important;
  object-position:center!important;

  display:block!important;
}

.ex-flow-item strong{
  font-size:13px!important;
  line-height:1.3!important;
}

.ex-flow-item p{
  margin:6px 0 0!important;

  color:var(--pub-muted)!important;

  font-size:10.5px!important;
  line-height:1.45!important;
}

.ex-flow-arrow{
  width:24px!important;

  display:grid!important;
  place-items:center!important;

  color:var(--pub-muted)!important;

  font-size:22px!important;
}

html[dir="rtl"] body[data-page="examples"] .ex-flow{
  direction:rtl!important;
}

html[dir="rtl"] body[data-page="examples"] .ex-flow-item{
  direction:rtl!important;
  text-align:right!important;
}

html[dir="rtl"] body[data-page="examples"] .ex-flow-arrow{
  transform:scaleX(-1)!important;
}

@media(max-width:1100px){

  .ex-flow{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:8px!important;
  }

  .ex-flow-arrow{
    display:none!important;
  }
}

@media(max-width:800px){

  .ex-flow{
    max-width:680px!important;

    grid-template-columns:repeat(2,minmax(0,1fr))!important;

    gap:12px!important;
  }

  .ex-flow-image{
    height:120px!important;
  }
}

@media(max-width:520px){

  .ex-flow{
    width:100%!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  .ex-flow-item{
    min-height:0!important;
  }

  .ex-flow-image{
    height:auto!important;
    aspect-ratio:1.75/1!important;
  }

  .ex-flow-item strong{
    font-size:14px!important;
  }

  .ex-flow-item p{
    font-size:11.5px!important;
  }
}

/* MOLANSIA_EXAMPLES_5STEP_FINAL_END */

/* MOLANSIA_OFFICIAL_BRAND_ASSETS_START */

:root{
  --molansia-brand-icon-dark-bg:
    url("/images/brand/0 molansia-icon-for-black-bg.svg");

  --molansia-brand-icon-light-bg:
    url("/images/brand/0 molansia-icon-for-withe-bg.svg");

  --molansia-brand-mark-dark-bg:
    url("/images/brand/0 molansia-mark-withe.svg");

  --molansia-brand-mark-light-bg:
    url("/images/brand/0 molansia-mark-Dark.svg");
}

/* MOLANSIA_OFFICIAL_BRAND_ASSETS_END */

/* MOLANSIA_PUBLIC_BODY_TEXT_SIZE_START */

/* =========================================================
   PUBLIC / FRONT PAGES ONLY
   Increase normal text only.
   Headings remain unchanged.
   ========================================================= */

/* Main paragraph / descriptive copy */
body:not([data-page="dashboard"])
     :where(
       main p,
       section p,
       article p,
       .description,
       .subtitle,
       .supporting-copy,
       .pub-muted,
       .pub-body,
       .pub-copy
     ){
  font-size:16px!important;
  line-height:1.65!important;
}

/* Smaller supporting/meta copy */
body:not([data-page="dashboard"])
     :where(
       .meta,
       .eyebrow-copy,
       .small-copy,
       small
     ){
  font-size:13px!important;
  line-height:1.5!important;
}

/* Cards: keep normal readable body text */
body:not([data-page="dashboard"])
     :where(
       .pub-card p,
       .ex-card-head p,
       .ex-flow-item p,
       .pricing-card p,
       .faq-answer,
       .footer-copy
     ){
  font-size:14px!important;
  line-height:1.55!important;
}

/* Public navigation/footer text gets a slight bump only */
body:not([data-page="dashboard"])
     :where(
       .pub-nav a,
       .pub-footer a,
       .pub-footer p
     ){
  font-size:14px!important;
}

/* Buttons remain controlled and not oversized */
body:not([data-page="dashboard"])
     :where(
       .pub-primary,
       .pub-secondary,
       .ex-card-cta
     ){
  font-size:14px!important;
}

/* Explicitly preserve headings */
body:not([data-page="dashboard"])
     :where(h1,h2,h3,h4,h5,h6){
  font-size:revert-layer;
}

/* Arabic normal text benefits from a small bump */
html[dir="rtl"] body:not([data-page="dashboard"])
     :where(
       main p,
       section p,
       article p,
       .description,
       .subtitle,
       .supporting-copy,
       .pub-muted,
       .pub-body,
       .pub-copy
     ){
  font-size:17px!important;
  line-height:1.75!important;
}

/* Mobile */
@media(max-width:520px){

  body:not([data-page="dashboard"])
       :where(
         main p,
         section p,
         article p,
         .description,
         .subtitle,
         .supporting-copy,
         .pub-muted,
         .pub-body,
         .pub-copy
       ){
    font-size:15px!important;
  }

  html[dir="rtl"] body:not([data-page="dashboard"])
       :where(
         main p,
         section p,
         article p,
         .description,
         .subtitle,
         .supporting-copy,
         .pub-muted,
         .pub-body,
         .pub-copy
       ){
    font-size:16px!important;
  }
}

/* MOLANSIA_PUBLIC_BODY_TEXT_SIZE_END */

/* MOLANSIA_PRICING_FINAL_UX_START */

/* =========================================================
   GLOBAL PUBLIC NORMAL TEXT
   Includes header + footer.
   Titles remain untouched.
   ========================================================= */

.pub-header .pub-nav a,
.pub-header .pub-actions a,
.pub-header button{
  font-size:14px!important;
}

.pub-footer,
.pub-footer a,
.pub-footer p,
.pub-footer li{
  font-size:14px!important;
  line-height:1.55!important;
}

body[data-page="home"] main p,
body[data-page="examples"] main p,
body[data-page="pricing"] main p,
body[data-page="how-it-works"] main p{
  font-size:16px;
  line-height:1.65;
}

html[dir="rtl"] body[data-page="home"] main p,
html[dir="rtl"] body[data-page="examples"] main p,
html[dir="rtl"] body[data-page="pricing"] main p,
html[dir="rtl"] body[data-page="how-it-works"] main p{
  font-size:17px;
  line-height:1.75;
}


/* =========================================================
   PRICING PAGE
   ========================================================= */

.pricing-final{
  width:min(1260px,calc(100% - 64px));
  margin:0 auto;
  padding:34px 0 0;
}

.pricing-main-final{
  min-height:650px;

  display:grid;
  grid-template-columns:minmax(520px,.95fr) minmax(500px,1.05fr);

  align-items:stretch;

  gap:34px;

  border-bottom:1px solid var(--pub-line);
}

.pricing-main-copy{
  padding:22px 0 48px;
  position:relative;
  z-index:3;
}

.pricing-main-copy h1{
  margin:0;
  max-width:650px;

  font-size:clamp(48px,5vw,70px);
  line-height:.98;

  letter-spacing:-.05em;
}

.pricing-lead{
  max-width:600px;

  margin:17px 0 22px;

  color:var(--pub-muted);

  font-size:17px!important;
  line-height:1.6!important;
}


/* Creator card */

.pricing-access-card{
  max-width:690px;

  padding:20px;

  border:1px solid var(--pub-line);
  border-radius:14px;

  background:var(--pub-panel);

  box-shadow:0 20px 50px rgba(0,0,0,.10);
}

.pricing-access-head{
  display:flex;
  align-items:center;

  gap:13px;

  margin-bottom:18px;
}

.pricing-access-logo{
  width:52px;
  height:52px;

  display:grid;
  place-items:center;

  flex:0 0 52px;

  border:1px solid var(--pub-line);
  border-radius:10px;

  background:var(--pub-panel-2);
}

.pricing-access-logo svg{
  width:27px;
  height:27px;

  fill:none;
  stroke:currentColor;
}

.pricing-access-head h2{
  margin:0;

  font-size:20px;
}

.pricing-access-head p{
  margin:3px 0 0;

  color:var(--pub-muted);

  font-size:14px!important;
}


/* workflow */

.pricing-workflow{
  display:grid;

  grid-template-columns:
   1fr 22px
   1fr 22px
   1fr 22px
   1fr 22px
   1fr;

  align-items:center;

  gap:0;

  padding:4px 0 17px;

  border-bottom:1px solid var(--pub-line);
}

.pricing-step{
  min-width:0;

  display:flex;
  flex-direction:column;

  align-items:center;
  justify-content:center;

  gap:8px;

  min-height:78px;

  padding:9px 6px;

  border:1px solid var(--pub-line);
  border-radius:9px;

  background:var(--pub-panel-2);

  text-align:center;
}

.pricing-step-icon svg{
  width:22px;
  height:22px;

  fill:none;
  stroke:currentColor;
}

.pricing-step strong{
  font-size:12px;
}

.pricing-arrow{
  display:grid;
  place-items:center;

  color:var(--pub-muted);
}


/* benefits */

.pricing-benefits{
  list-style:none;

  margin:16px 0 0;
  padding:0 4px 15px;

  display:grid;
  grid-template-columns:1fr 1fr;

  gap:10px 24px;

  border-bottom:1px solid var(--pub-line);
}

.pricing-benefits li{
  display:flex;
  align-items:center;

  gap:9px;

  font-size:14px;
}

.pricing-benefits svg{
  width:16px;
  height:16px;

  flex:0 0 16px;

  fill:none;
  stroke:currentColor;

  stroke-width:2;
}


/* access note */

.pricing-access-note{
  display:flex;
  align-items:flex-start;

  gap:12px;

  padding:15px 4px;
}

.pricing-access-note>span{
  width:28px;
  height:28px;

  display:grid;
  place-items:center;
}

.pricing-access-note svg{
  width:20px;
  height:20px;

  fill:none;
  stroke:currentColor;
}

.pricing-access-note strong{
  font-size:14px;
}

.pricing-access-note p{
  margin:3px 0 0;

  color:var(--pub-muted);

  font-size:13px!important;
}

.pricing-start{
  width:100%;

  min-height:48px;

  display:flex;

  align-items:center;
  justify-content:center;

  gap:8px;
}


/* =========================================================
   RIGHT-SIDE VISUAL ONLY
   ========================================================= */

.pricing-main-visual{
  min-height:650px;

  position:relative;

  overflow:hidden;

  isolation:isolate;
}

.pricing-main-visual img{
  position:absolute;

  inset:0;

  width:100%;
  height:100%;

  display:block;

  object-fit:cover;
  object-position:center;
}

.pricing-main-visual::before{
  content:"";

  position:absolute;

  inset:0;

  z-index:1;

  pointer-events:none;

  background:
    linear-gradient(
      90deg,
      var(--pub-bg) 0%,
      color-mix(in srgb,var(--pub-bg) 74%,transparent) 15%,
      color-mix(in srgb,var(--pub-bg) 20%,transparent) 42%,
      transparent 68%
    ),
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--pub-bg) 18%,transparent) 0%,
      transparent 20%,
      transparent 78%,
      color-mix(in srgb,var(--pub-bg) 62%,transparent) 100%
    );
}


/* =========================================================
   FAQ — no image
   ========================================================= */

.pricing-faq{
  margin-top:12px;

  padding:28px 22px;

  border:1px solid var(--pub-line);
  border-radius:13px;

  background:var(--pub-panel);
  background-image:none!important;
}

.pricing-faq-head h2{
  margin:0;

  font-size:32px;
}

.pricing-faq-head p{
  margin:5px 0 0;

  color:var(--pub-muted);

  font-size:15px!important;
}

.pricing-faq-grid{
  display:grid;

  grid-template-columns:1fr 1fr;

  gap:7px 18px;

  margin-top:17px;
}

.pricing-faq-item{
  border:1px solid var(--pub-line);

  border-radius:8px;

  background:var(--pub-panel-2);
}

.pricing-faq-item summary{
  min-height:42px;

  padding:10px 14px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:16px;

  cursor:pointer;

  list-style:none;

  font-size:14px;
}

.pricing-faq-item summary::-webkit-details-marker{
  display:none;
}

.pricing-faq-plus{
  font-size:20px;

  color:var(--pub-muted);
}

.pricing-faq-answer{
  padding:0 14px 14px;

  color:var(--pub-muted);

  font-size:14px;
  line-height:1.6;
}


/* =========================================================
   FINAL CTA — no image
   ========================================================= */

.pricing-final-cta{
  margin:12px 0 10px;

  min-height:110px;

  padding:22px 28px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:30px;

  border:1px solid var(--pub-line);
  border-radius:14px;

  background:var(--pub-panel);
  background-image:none!important;
}

.pricing-final-cta h2{
  margin:0;

  font-size:32px;
}

.pricing-final-cta p{
  margin:5px 0 0;

  color:var(--pub-muted);

  font-size:15px!important;
}


/* =========================================================
   RTL
   Keep the same physical visual composition.
   Text stays RTL.
   ========================================================= */

html[dir="rtl"] body[data-page="pricing"] .pricing-main-final{
  direction:ltr;
}

html[dir="rtl"] body[data-page="pricing"] .pricing-main-copy{
  direction:rtl;
  text-align:right;
}

html[dir="rtl"] body[data-page="pricing"] .pricing-access-card{
  direction:rtl;
}

html[dir="rtl"] body[data-page="pricing"] .pricing-workflow{
  direction:rtl;
}

html[dir="rtl"] body[data-page="pricing"] .pricing-arrow{
  transform:scaleX(-1);
}

html[dir="rtl"] body[data-page="pricing"] .pricing-final-cta{
  direction:rtl;
}


/* =========================================================
   1024
   ========================================================= */

@media(max-width:1050px){

  .pricing-final{
    width:calc(100% - 40px);
  }

  .pricing-main-final{
    grid-template-columns:1fr 1fr;
    gap:22px;
  }

  .pricing-main-copy h1{
    font-size:55px;
  }

  .pricing-main-visual{
    min-height:580px;
  }

}


/* =========================================================
   768
   ========================================================= */

@media(max-width:800px){

  .pricing-main-final{
    grid-template-columns:1fr;

    gap:0;
  }

  .pricing-main-copy{
    padding-bottom:28px;
  }

  .pricing-main-visual{
    min-height:420px;
  }

  .pricing-main-visual::before{
    background:
      linear-gradient(
        180deg,
        var(--pub-bg) 0%,
        color-mix(in srgb,var(--pub-bg) 38%,transparent) 18%,
        transparent 48%,
        color-mix(in srgb,var(--pub-bg) 45%,transparent) 100%
      );
  }

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

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:520px){

  .pricing-final{
    width:calc(100% - 28px);
  }

  .pricing-main-copy h1{
    font-size:42px;
  }

  .pricing-lead{
    font-size:16px!important;
  }

  .pricing-workflow{
    grid-template-columns:1fr 1fr;

    gap:8px;
  }

  .pricing-arrow{
    display:none;
  }

  .pricing-step:last-of-type{
    grid-column:1 / -1;
  }

  .pricing-benefits{
    grid-template-columns:1fr;
  }

  .pricing-main-visual{
    min-height:290px;
  }

  .pricing-faq{
    padding:20px 14px;
  }

  .pricing-faq-head h2{
    font-size:27px;
  }

  .pricing-final-cta{
    flex-direction:column;

    align-items:stretch;

    padding:20px;
  }

  .pricing-final-cta h2{
    font-size:29px;
  }

  .pricing-final-cta .pub-primary{
    width:100%;

    justify-content:center;
  }

}

/* MOLANSIA_PRICING_FINAL_UX_END */

/* MOLANSIA_CONTACT_BACKGROUND_FINAL_START */

/* =========================================================
   CONTACT MAIN AREA ONLY
   Real image background + real HTML above it
   ========================================================= */

body[data-page="contact"] main{
  position:relative;
  isolation:isolate;

  overflow:hidden;

  background:
    var(--pub-bg) !important;

  background-image:none !important;
}


/* actual Contact image */
body[data-page="contact"] main::before{
  content:"";

  position:absolute;
  inset:0;

  z-index:-2;

  pointer-events:none;

  background-image:
    url("/images/molansia-v1/11 contact molansia optimized.webp");

  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;

  opacity:1;
}


/* DARK MODE neutral overlay */
body[data-page="contact"] main::after{
  content:"";

  position:absolute;
  inset:0;

  z-index:-1;

  pointer-events:none;

  background:
    linear-gradient(
      90deg,
      rgba(8,11,13,.96) 0%,
      rgba(8,11,13,.91) 28%,
      rgba(8,11,13,.76) 52%,
      rgba(8,11,13,.64) 74%,
      rgba(8,11,13,.72) 100%
    ),
    linear-gradient(
      180deg,
      rgba(8,11,13,.74) 0%,
      rgba(8,11,13,.32) 36%,
      rgba(8,11,13,.46) 70%,
      rgba(8,11,13,.90) 100%
    );
}


/* =========================================================
   LIGHT MODE
   Keep photo, but neutralize it strongly
   ========================================================= */

html[data-theme="light"] body[data-page="contact"] main::after,
html.light body[data-page="contact"] main::after{
  background:
    linear-gradient(
      90deg,
      rgba(246,245,242,.97) 0%,
      rgba(246,245,242,.93) 30%,
      rgba(246,245,242,.80) 56%,
      rgba(246,245,242,.69) 76%,
      rgba(246,245,242,.75) 100%
    ),
    linear-gradient(
      180deg,
      rgba(246,245,242,.80) 0%,
      rgba(246,245,242,.40) 38%,
      rgba(246,245,242,.54) 72%,
      rgba(246,245,242,.94) 100%
    );
}


/* =========================================================
   CONTACT REAL UI
   Ensure content stays above the visual
   ========================================================= */

body[data-page="contact"] main > *,
body[data-page="contact"] main section,
body[data-page="contact"] main form{
  position:relative;
  z-index:2;
}


/* =========================================================
   FORM + SUPPORT TOPICS
   Keep Homepage neutral surfaces
   No photo colors transferred to UI
   ========================================================= */

body[data-page="contact"] form,
body[data-page="contact"] .contact-form,
body[data-page="contact"] .support-card,
body[data-page="contact"] .support-topic,
body[data-page="contact"] .contact-card,
body[data-page="contact"] .contact-panel{
  background:
    color-mix(
      in srgb,
      var(--pub-panel) 94%,
      transparent
    ) !important;

  border-color:var(--pub-line) !important;

  box-shadow:
    0 18px 55px rgba(0,0,0,.16);
}


/* Inputs stay real neutral UI */
body[data-page="contact"] :is(
  input,
  textarea,
  select
){
  background:var(--pub-panel-2) !important;
  color:var(--pub-text) !important;
  border-color:var(--pub-line) !important;
}


/* =========================================================
   NORMAL TEXT READABILITY
   Titles remain controlled by existing typography
   ========================================================= */

body[data-page="contact"] main p,
body[data-page="contact"] main label,
body[data-page="contact"] main li,
body[data-page="contact"] main .description,
body[data-page="contact"] main .supporting-copy{
  color:var(--pub-muted);
}

body[data-page="contact"] main p{
  font-size:16px;
  line-height:1.65;
}

html[dir="rtl"] body[data-page="contact"] main p{
  font-size:17px;
  line-height:1.75;
}


/* =========================================================
   IMPORTANT:
   HEADER NEVER GETS CONTACT IMAGE
   ========================================================= */

body[data-page="contact"] .pub-header{
  background-image:none !important;
}


/* =========================================================
   FOOTER NEVER GETS CONTACT IMAGE
   Normal shared MOLANSIA footer
   ========================================================= */

body[data-page="contact"] .pub-footer,
body[data-page="contact"] footer{
  position:relative;
  z-index:5;

  background:var(--pub-bg) !important;
  background-image:none !important;
}


/* =========================================================
   Do not allow reference image to render accidentally
   ========================================================= */

body[data-page="contact"] img[src*="CONTACT_FINAL_UX"]{
  display:none !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1024px){

  body[data-page="contact"] main::before{
    background-position:58% center;
  }

  body[data-page="contact"] main::after{
    background:
      linear-gradient(
        90deg,
        rgba(8,11,13,.96) 0%,
        rgba(8,11,13,.86) 48%,
        rgba(8,11,13,.67) 100%
      ),
      linear-gradient(
        180deg,
        rgba(8,11,13,.56),
        rgba(8,11,13,.76)
      );
  }

  html[data-theme="light"] body[data-page="contact"] main::after,
  html.light body[data-page="contact"] main::after{
    background:
      linear-gradient(
        90deg,
        rgba(246,245,242,.97) 0%,
        rgba(246,245,242,.89) 50%,
        rgba(246,245,242,.72) 100%
      ),
      linear-gradient(
        180deg,
        rgba(246,245,242,.62),
        rgba(246,245,242,.87)
      );
  }

}


/* =========================================================
   MOBILE
   Image remains supportive, readability wins
   ========================================================= */

@media(max-width:520px){

  body[data-page="contact"] main::before{
    background-position:68% center;
  }

  body[data-page="contact"] main::after{
    background:
      linear-gradient(
        180deg,
        rgba(8,11,13,.95) 0%,
        rgba(8,11,13,.87) 46%,
        rgba(8,11,13,.93) 100%
      );
  }

  html[data-theme="light"] body[data-page="contact"] main::after,
  html.light body[data-page="contact"] main::after{
    background:
      linear-gradient(
        180deg,
        rgba(246,245,242,.96) 0%,
        rgba(246,245,242,.88) 48%,
        rgba(246,245,242,.95) 100%
      );
  }

}

/* MOLANSIA_CONTACT_BACKGROUND_FINAL_END */

/* MOLANSIA_CONTACT_REAL_PAGE_START */

.contact-final{
  width:min(1260px,calc(100% - 64px));
  margin:0 auto;
  padding:34px 0 0;
}

.contact-main{
  position:relative;
  overflow:hidden;
  isolation:isolate;

  min-height:720px;

  padding:58px;

  border:1px solid var(--pub-line);
  border-radius:18px;
}

.contact-main::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;

  background:
    url("/images/molansia-v1/11 contact molansia optimized.webp")
    center/cover no-repeat;
}

.contact-main::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;

  background:
    linear-gradient(
      90deg,
      rgba(8,11,13,.96) 0%,
      rgba(8,11,13,.89) 42%,
      rgba(8,11,13,.66) 72%,
      rgba(8,11,13,.76) 100%
    ),
    linear-gradient(
      180deg,
      rgba(8,11,13,.50),
      rgba(8,11,13,.76)
    );
}

html[data-theme="light"] .contact-main::after,
html.light .contact-main::after{
  background:
    linear-gradient(
      90deg,
      rgba(246,245,242,.97) 0%,
      rgba(246,245,242,.91) 42%,
      rgba(246,245,242,.73) 72%,
      rgba(246,245,242,.80) 100%
    ),
    linear-gradient(
      180deg,
      rgba(246,245,242,.56),
      rgba(246,245,242,.80)
    );
}

.contact-intro{
  max-width:700px;
}

.contact-intro h1{
  margin:0;

  font-size:clamp(50px,5.7vw,76px);
  line-height:.98;

  letter-spacing:-.055em;
}

.contact-intro>p{
  max-width:570px;

  margin:18px 0 0;

  color:var(--pub-muted);

  font-size:17px;
  line-height:1.65;
}

.contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(340px,.95fr);

  gap:18px;

  margin-top:38px;
}

.contact-form,
.contact-support{
  padding:23px;

  border:1px solid var(--pub-line);
  border-radius:13px;

  background:
    color-mix(in srgb,var(--pub-panel) 94%,transparent);

  backdrop-filter:blur(14px);

  box-shadow:0 22px 60px rgba(0,0,0,.14);
}

.contact-form-head h2,
.contact-support-head h2{
  margin:0;

  font-size:25px;
}

.contact-form-head p,
.contact-support-head p{
  margin:6px 0 0;

  color:var(--pub-muted);

  font-size:15px;
  line-height:1.55;
}

.contact-fields{
  display:grid;
  grid-template-columns:1fr 1fr;

  gap:14px;

  margin-top:20px;
}

.contact-fields label{
  display:grid;
  gap:7px;

  color:var(--pub-text);

  font-size:14px;
  font-weight:600;
}

.contact-field-full{
  grid-column:1 / -1;
}

.contact-fields input,
.contact-fields textarea{
  width:100%;

  padding:12px 13px;

  border:1px solid var(--pub-line);
  border-radius:8px;

  background:var(--pub-panel-2);
  color:var(--pub-text);

  outline:none;

  font:inherit;
  font-weight:400;
}

.contact-fields textarea{
  resize:vertical;

  min-height:130px;
}

.contact-fields input:focus,
.contact-fields textarea:focus{
  border-color:color-mix(in srgb,var(--pub-text) 36%,var(--pub-line));
}

.contact-send{
  width:100%;

  min-height:47px;

  display:flex;
  align-items:center;
  justify-content:center;

  gap:8px;

  margin-top:16px;
}

.contact-topics{
  display:grid;
  gap:10px;

  margin-top:20px;
}

.contact-topic{
  display:flex;
  align-items:flex-start;

  gap:12px;

  padding:14px;

  border:1px solid var(--pub-line);
  border-radius:9px;

  background:var(--pub-panel-2);
}

.contact-topic-icon{
  width:38px;
  height:38px;

  flex:0 0 38px;

  display:grid;
  place-items:center;

  border:1px solid var(--pub-line);
  border-radius:8px;
}

.contact-topic-icon svg{
  width:19px;
  height:19px;

  fill:none;
  stroke:currentColor;
}

.contact-topic h3{
  margin:1px 0 0;

  font-size:15px;
}

.contact-topic p{
  margin:5px 0 0;

  color:var(--pub-muted);

  font-size:14px;
  line-height:1.5;
}

.contact-final-cta{
  min-height:120px;

  margin:12px 0 10px;
  padding:24px 28px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:30px;

  border:1px solid var(--pub-line);
  border-radius:14px;

  background:var(--pub-panel);
  background-image:none!important;
}

.contact-final-cta h2{
  margin:0;

  font-size:32px;
}

.contact-final-cta p{
  margin:5px 0 0;

  color:var(--pub-muted);

  font-size:15px;
}


/* Footer remains normal */
body[data-page="contact"] .pub-footer,
body[data-page="contact"] footer{
  background:var(--pub-bg)!important;
  background-image:none!important;
}


/* Arabic physical layout stays consistent */
html[dir="rtl"] .contact-main{
  direction:ltr;
}

html[dir="rtl"] .contact-intro,
html[dir="rtl"] .contact-grid{
  direction:rtl;
  text-align:right;
}


/* tablet */
@media(max-width:900px){

  .contact-main{
    padding:38px;
  }

  .contact-grid{
    grid-template-columns:1fr;
  }
}


/* mobile */
@media(max-width:520px){

  .contact-final{
    width:calc(100% - 28px);
  }

  .contact-main{
    min-height:0;

    padding:28px 18px;
  }

  .contact-intro h1{
    font-size:43px;
  }

  .contact-fields{
    grid-template-columns:1fr;
  }

  .contact-field-full{
    grid-column:auto;
  }

  .contact-form,
  .contact-support{
    padding:17px;
  }

  .contact-final-cta{
    flex-direction:column;
    align-items:stretch;

    padding:20px;
  }

  .contact-final-cta .pub-primary{
    justify-content:center;
  }
}

/* MOLANSIA_CONTACT_REAL_PAGE_END */


/* How it works: supplied six-stage artwork */
.pub-home .pub-how{width:min(1600px,calc(100% - 64px));margin-inline:auto;}
.pub-how .pub-section-title{max-width:1000px;margin-bottom:30px;}
.pub-how .pub-section-title h2{font-size:clamp(28px,3vw,42px);line-height:1.15;}
.pub-how .pub-section-title p{font-size:16px;}
.pub-how .pub-step-flow{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr);gap:0;align-items:stretch;}
.pub-how .pub-step{min-width:0;padding:50px 12px 20px;border-radius:16px;border:1px solid var(--pub-line-strong);background:linear-gradient(150deg,rgba(220,185,132,.045),transparent);}
.pub-how .pub-step-number{left:auto;right:auto;inset-inline-start:12px;top:12px;width:38px;height:38px;background:rgba(220,185,132,.15);color:var(--pub-text);font-size:15px;font-weight:700;}
.pub-how .pub-workflow-image{width:100%;height:clamp(130px,14vw,220px);position:relative;display:block;flex-shrink:0;margin-bottom:16px;}
.pub-how .pub-workflow-image img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;}
.pub-how .pub-step h3{margin:0;font-size:clamp(15px,1.3vw,20px);line-height:1.25;}
.pub-how .pub-step p{max-width:240px;margin:10px 0 0;font-size:14px;line-height:1.5;}
.pub-how .pub-workflow-note{margin-top:10px;font-size:10px;line-height:1.4;color:var(--pub-muted);}
.pub-how .pub-flow-arrow{display:grid;place-items:center;align-self:center;color:#e6bd7d;filter:drop-shadow(0 0 7px rgba(230,189,125,.3));}
.pub-how .pub-flow-arrow svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2.8;}
html[data-theme="light"] .pub-how .pub-flow-arrow{color:#8a5c20;filter:none;}
html[dir="rtl"] .pub-how .pub-flow-arrow svg{transform:scaleX(-1);}
@media(max-width:900px){
 .pub-home .pub-how{width:calc(100% - 32px);}
 .pub-how .pub-step-flow{display:flex;flex-direction:column;align-items:center;gap:8px;}
 .pub-how .pub-step{width:min(100%,420px);padding:50px 22px 22px;}
 .pub-how .pub-workflow-image{height:220px;}
 .pub-how .pub-step h3{font-size:21px;}
 .pub-how .pub-step p{font-size:15px;max-width:320px;}
 .pub-how .pub-flow-arrow svg{transform:rotate(90deg);}
 html[dir="rtl"] .pub-how .pub-flow-arrow svg{transform:rotate(90deg);}
}

/* type: one modern family everywhere on the public pages */
html body,html body button,html body input,html body select,html body textarea{font-family:"Inter","IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif!important}
html body h1,html body h2,html body h3,html body h4{font-family:"Inter Tight","Inter","IBM Plex Sans Arabic",system-ui,sans-serif!important;letter-spacing:-.02em;font-weight:700}
html[dir=rtl] body,html[dir=rtl] body h1,html[dir=rtl] body h2,html[dir=rtl] body h3,html[dir=rtl] body h4{font-family:"IBM Plex Sans Arabic","Inter",system-ui,sans-serif!important;letter-spacing:0}

/* MOLANSIA_REAL_OUTPUTS_START: real outputs on home and /examples, black and white only, images fade into the page */
.pub-how .pub-step{background:var(--pub-panel)}
.pub-how .pub-step-number{background:var(--pub-panel-2);color:var(--pub-text)}
.pub-how .pub-flow-arrow,html[data-theme="light"] .pub-how .pub-flow-arrow{color:var(--pub-muted);filter:none}
.pub-eyebrow{color:var(--pub-muted)!important}

.ro{max-width:1200px;margin:0 auto;padding:96px 24px 40px}
.ro-bento{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:36px}
.ro-tile{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:8px;min-height:250px;padding:24px;border:1px solid var(--pub-line);border-radius:20px;background:var(--pub-panel-solid)}
.ro-tile h3{margin:0;font-size:20px;line-height:1.25;color:var(--pub-text)}
.ro-tile p{margin:0;font-size:14.5px;line-height:1.55;color:var(--pub-muted)}
.ro-tag{font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--pub-muted)}
.ro-product{grid-column:span 4}
.ro-video{grid-column:span 2;grid-row:span 2}
.ro-ads,.ro-whop{grid-column:span 2}
.ro-sales,.ro-molo{grid-column:span 3}
/* the gradient "shadow": pictures melt into the card, like the old hero */
.ro-fade{position:relative}
.ro-fade::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;pointer-events:none;background:linear-gradient(to top,var(--pub-panel-solid) 8%,transparent)}
.ro-prods{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px -24px -24px;padding:0 24px}
.ro-prods img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;border:1px solid var(--pub-line)}
.ro-adrow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:auto -24px -24px;padding:12px 24px 0}
.ro-adrow img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px}
.ro-video video{margin-top:auto;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:14px;border:1px solid var(--pub-line);background:#000}
.ro-pays{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}
.ro-pay{display:grid;place-items:center;width:62px;height:40px;border:1px solid var(--pub-line-strong);border-radius:10px;color:var(--pub-text)}
.ro-pay svg{width:38px;height:22px}
.ro-secure{font-size:12.5px;color:var(--pub-muted)}
.ro-chartbox{margin-top:auto;color:var(--pub-text)}
.ro-chart{display:block;width:100%;height:96px}
.ro-legend{display:flex;gap:14px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--pub-muted);margin-bottom:8px}
.ro-legend span{display:inline-flex;align-items:center;gap:6px}
.ro-legend i{display:inline-block;width:16px;border-top:2px solid var(--pub-text)}
.ro-legend i.dash{border-top:2px dashed var(--pub-muted)}
.ro-legend em{margin-inline-start:auto;font-style:normal;opacity:.7}
.ro-chat{display:grid;gap:8px;margin-top:auto}
.ro-msg{max-width:88%;padding:9px 12px;border-radius:12px;font-size:13.5px;line-height:1.5}
.ro-msg.u{justify-self:end;background:var(--pub-primary);color:var(--pub-primary-text)}
.ro-msg.a{background:var(--pub-panel-2);border:1px solid var(--pub-line);color:var(--pub-text)}
.ro-msg ol{margin:4px 0 0;padding-inline-start:18px;color:var(--pub-muted)}
.ro-more{display:flex;justify-content:center;margin-top:28px}

/* pricing without the hero */
body[data-page="pricing"] .mp-plans h1{font-size:clamp(32px,4.4vw,48px);margin:0 0 10px;color:var(--pub-text)}
body[data-page="pricing"] .mp-plans{color:var(--pub-text)}

/* contact: real sending */
.contact-trap{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.contact-status{min-height:20px;margin:4px 0 10px;font-size:14px;color:var(--pub-muted)}
.contact-status[data-state="ok"]{color:var(--pub-text);font-weight:600}
.contact-status[data-state="error"]{color:var(--pub-text);text-decoration:underline}
.contact-form input,.contact-form textarea{color:var(--pub-text);background:var(--pub-bg-soft);border-color:var(--pub-line-strong)}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--pub-muted)}

@media (max-width:900px){
 .ro-bento{grid-template-columns:1fr 1fr}
 .ro-product,.ro-video,.ro-ads,.ro-whop,.ro-sales,.ro-molo{grid-column:span 2;grid-row:auto}
 .ro-video video{max-width:280px;margin-inline:auto}
}
@media (max-width:560px){
 .ro{padding:64px 16px 24px}
 .ro-tile{padding:20px}
 .ro-prods,.ro-adrow{margin-inline:-20px;padding-inline:20px}
}
/* MOLANSIA_REAL_OUTPUTS_END */

/* MOLANSIA_ACCENT_V2_START: one soft accent (MoLo's periwinkle) on small icons and buttons; green only for savings */
:root{--pub-accent:#8b9bff;--pub-accent-soft:rgba(139,155,255,.14);--pub-accent-line:rgba(139,155,255,.38);--pub-save:#35d08a}
html[data-theme="light"]{--pub-accent:#4f5fd9;--pub-accent-soft:rgba(79,95,217,.09);--pub-accent-line:rgba(79,95,217,.3);--pub-save:#0f8a52}
.pub-eyebrow{color:var(--pub-accent)!important;opacity:.9}
.ro-tag{color:var(--pub-accent)}
.pub-benefit-icon,.pub-benefit-icon svg{color:var(--pub-accent)!important;stroke:var(--pub-accent)!important}
.pub-primary svg,.pub-secondary svg{color:var(--pub-accent)}
.pub-primary{box-shadow:0 0 0 1px var(--pub-accent-line),0 8px 24px -10px var(--pub-accent-line)!important;transition:box-shadow .2s,transform .2s}
.pub-primary:hover{box-shadow:0 0 0 1px var(--pub-accent),0 10px 30px -8px var(--pub-accent-line)!important;transform:translateY(-1px)}
.pub-secondary:hover{border-color:var(--pub-accent-line)!important}
.pub-how .pub-step-number{background:var(--pub-accent-soft);color:var(--pub-accent)}
.pub-how .pub-flow-arrow,html[data-theme="light"] .pub-how .pub-flow-arrow{color:var(--pub-accent)}
.ro-chartbox{color:var(--pub-accent)}
.ro-legend i{border-top-color:var(--pub-accent)}
.contact-topic-icon svg{stroke:var(--pub-accent)}
.mp-card.first{border-color:var(--pub-accent-line)!important}

/* Whop tile: the globe with payments arriving */
.ro-whop{gap:6px}
.ro-globe{position:relative;width:132px;height:112px;margin:8px auto 2px;color:var(--pub-text)}
.ro-globe svg{width:112px;height:112px;display:block;margin:0 auto}
.ro-globe .g-out{fill:var(--pub-accent-soft);stroke:var(--pub-line-strong);stroke-width:1.2}
.ro-globe .g-line{fill:none;stroke:var(--pub-line-strong);stroke-width:.9}
.ro-globe .g-mer{fill:none;stroke:var(--pub-accent-line);stroke-width:1;transform-origin:60px 60px;transform-box:view-box;animation:gTurn 6s linear infinite}
.ro-globe .m2{animation-delay:-2s}.ro-globe .m3{animation-delay:-4s}
@keyframes gTurn{0%{transform:scaleX(1)}50%{transform:scaleX(0)}100%{transform:scaleX(-1)}}
.ro-globe .g-pings circle{fill:var(--pub-accent);transform-box:fill-box;transform-origin:center;animation:gPing 3.2s ease-out infinite}
.ro-globe .p2{animation-delay:.8s!important}.ro-globe .p3{animation-delay:1.6s!important}.ro-globe .p4{animation-delay:2.4s!important}
@keyframes gPing{0%{opacity:0;transform:scale(.4)}12%{opacity:1;transform:scale(1.25)}40%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
.ro-paid{position:absolute;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:99px;background:rgba(53,208,138,.16);color:var(--pub-save);border:1px solid rgba(53,208,138,.35);opacity:0;animation:gPaid 4.8s ease-in-out infinite}
.ro-paid.r1{left:-6px;top:10px}.ro-paid.r2{right:-8px;top:38px;animation-delay:1.6s}.ro-paid.r3{left:6px;bottom:4px;animation-delay:3.2s}
@keyframes gPaid{0%{opacity:0;transform:translateY(6px)}10%,30%{opacity:1;transform:translateY(0)}42%,100%{opacity:0;transform:translateY(-6px)}}
.ro-pays{gap:8px;margin-top:6px}
.ro-pay{width:54px;height:34px;background:#fff;border-color:transparent}
.ro-pay svg{width:34px;height:20px}
.ro-pay.ro-lock{background:transparent;border-color:var(--pub-line-strong)}
.ro-pay[title="Apple Pay"]{color:#000}
.ro-secure{display:flex;align-items:center;gap:6px}

/* MoLo tile: clearly an AI helper, with its own icon */
.ro-molo-head{display:flex;align-items:center;gap:10px;margin-bottom:4px}
.ro-molo-av{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(139,155,255,.18),rgba(192,132,252,.18));border:1px solid rgba(167,139,250,.4)}
.ro-molo-av svg{width:22px;height:22px}
.ro-molo-head b{display:block;font-size:15px;color:var(--pub-text)}
.ro-molo-head small{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--pub-muted)}
.ro-molo-head small i{width:7px;height:7px;border-radius:50%;background:var(--pub-save);box-shadow:0 0 0 3px rgba(53,208,138,.18)}
.ro-row{display:flex;align-items:flex-end;gap:8px}
.ro-mini-av{flex:none;width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:var(--pub-accent-soft);border:1px solid rgba(167,139,250,.3)}
.ro-mini-av svg{width:15px;height:15px}
.ro-row .ro-msg.a{max-width:80%}
.ro-msg.u{background:var(--pub-accent);color:#0b0d1a}
html[data-theme="light"] .ro-msg.u{color:#fff}
.ro-typing{display:inline-flex;gap:4px;padding:12px 14px}
.ro-typing i{width:6px;height:6px;border-radius:50%;background:var(--pub-muted);animation:mTyping 1.2s infinite}
.ro-typing i:nth-child(2){animation-delay:.15s}.ro-typing i:nth-child(3){animation-delay:.3s}
@keyframes mTyping{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-3px)}}

/* Creator access: the path of steps */
.pub-path{border:1px solid var(--pub-line);border-radius:16px;background:var(--pub-panel);padding:18px 18px 8px;margin:6px 0 22px}
.pub-path-head{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--pub-muted);margin-bottom:12px}
.pub-path ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:18px}
.pub-path li{position:relative;display:flex;gap:12px;align-items:flex-start;padding:0 0 14px}
.pub-path li i{position:relative;z-index:1;flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11.5px;font-weight:700;border:1.5px solid var(--pub-line-strong);color:var(--pub-muted);background:var(--pub-panel-solid);transition:all .35s}
.pub-path li i svg{display:none;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.6}
.pub-path li.done i{background:var(--pub-accent);border-color:var(--pub-accent);color:#0b0d1a}
html[data-theme="light"] .pub-path li.done i{color:#fff}
.pub-path li.done i span{display:none}.pub-path li.done i svg{display:block}
.pub-path li.now i{border-color:var(--pub-accent);color:var(--pub-accent);box-shadow:0 0 0 5px var(--pub-accent-soft)}
.pub-path li strong{display:block;font-size:14px;color:var(--pub-text);line-height:1.3}
.pub-path li small{display:block;font-size:12.5px;color:var(--pub-muted);line-height:1.45;margin-top:2px}
.pub-path li.done strong{color:var(--pub-text)}
.pub-path li:not(.done):not(.now) strong{color:var(--pub-muted)}

/* footer: one short row */
.pub-footer.pub-footer-slim{display:flex!important;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;padding:28px 0 32px!important;border-top:1px solid var(--pub-line)}
.pub-footer-slim .pub-footer-brand{display:flex;align-items:center;gap:14px}
.pub-footer-slim .pub-footer-brand p{margin:0;font-size:13.5px;color:var(--pub-muted)}
.pub-footer-links{display:flex;flex-wrap:wrap;gap:6px 22px}
.pub-footer-links a{font-size:14px;color:var(--pub-muted);text-decoration:none}
.pub-footer-links a:hover{color:var(--pub-text)}
.pub-footer-copy{font-size:12.5px;color:var(--pub-muted);width:100%}

/* /examples, compact */
.exc{max-width:1200px;margin:0 auto;padding:0 24px 48px}
.exc-head{text-align:center;padding:120px 0 36px;max-width:720px;margin:0 auto}
.exc-head h1{font-size:clamp(32px,4.6vw,52px);line-height:1.06;margin:10px 0 12px;color:var(--pub-text)}
.exc-head p{color:var(--pub-muted);font-size:17px;margin:0 0 22px}
.exc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.exc-card{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;padding:22px;border:1px solid var(--pub-line);border-radius:20px;background:var(--pub-panel-solid)}
.exc-card header h2{font-size:19px;margin:0 0 4px;color:var(--pub-text)}
.exc-card header p{margin:0;font-size:14px;color:var(--pub-muted)}
.exc-products{grid-column:span 7}
.exc-videos{grid-column:span 5;grid-row:span 2}
.exc-ads{grid-column:span 7}
.exc-editor{grid-column:span 6}
.exc-tpls{grid-column:span 6}
.exc-prods,.exc-adrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:auto -22px -22px;padding:0 22px}
.exc-prods img,.exc-adrow img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px}
.exc-vids{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}
.exc-vids video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:14px;background:#000;border:1px solid var(--pub-line)}
.exc-shot{margin-top:auto;border:1px solid var(--pub-line);border-radius:12px;overflow:hidden}
.exc-shot img{display:block;width:100%}
.exc-tplgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:auto}
.exc-tplgrid img{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:top;border-radius:10px;border:1px solid var(--pub-line)}
.exc-final{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-top:14px;padding:26px 28px;border:1px solid var(--pub-line);border-radius:20px;background:var(--pub-panel-solid)}
.exc-final h2{margin:0;font-size:clamp(20px,2.4vw,28px);color:var(--pub-text)}
.exc .ro-fade::after{background:linear-gradient(to top,var(--pub-panel-solid) 8%,transparent);height:45%}

@media (max-width:900px){
 .exc-grid{grid-template-columns:1fr}
 .exc-products,.exc-videos,.exc-ads,.exc-editor,.exc-tpls{grid-column:auto;grid-row:auto}
 .pub-path ol{grid-template-columns:1fr}
}
@media (max-width:560px){
 .exc{padding:0 16px 32px}
 .exc-head{padding-top:96px}
 .exc-card{padding:18px}
 .exc-prods,.exc-adrow{margin-inline:-18px;padding-inline:18px}
}
@media (prefers-reduced-motion:reduce){.ro-globe *,.ro-paid,.ro-typing i{animation:none!important}.ro-paid.r1{opacity:1}}
/* MOLANSIA_ACCENT_V2_END */
.ro-sales .ro-chart{height:150px}
.exc-vids{flex:1;margin-top:0;min-height:0}
.exc-vids video{height:100%;aspect-ratio:auto;min-height:360px}
.exc-shot{margin-top:0}
.exc-tplgrid img{aspect-ratio:3/4}
.exc-editor{justify-content:flex-start}
@media (max-width:900px){.exc-vids video{aspect-ratio:9/16;height:auto;min-height:0}}
.exc-editor{grid-column:span 7}.exc-tpls{grid-column:span 5}@media (max-width:900px){.exc-editor,.exc-tpls{grid-column:auto}}

/* ads: a fanned hand of cards; each card travels across the fan and passes to the front, forever */
.ro-deck{position:relative;height:230px;margin-top:auto;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.ro-deck img{position:absolute;left:50%;bottom:-28px;width:132px;aspect-ratio:4/5;object-fit:cover;margin-left:-66px;border-radius:12px;border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 40px -14px rgba(0,0,0,.6);transform-origin:50% 140%;animation:deckTurn 12s linear infinite;animation-delay:calc(var(--i) * -2s);will-change:transform}
.ro-deck:hover img{animation-play-state:paused}
@keyframes deckTurn{
 0%{transform:rotate(-33deg) scale(.82);opacity:0;z-index:1}
 8%{opacity:1}
 16.66%{transform:rotate(-22deg) scale(.86);z-index:2}
 33.33%{transform:rotate(-11deg) scale(.93);z-index:3}
 50%{transform:rotate(0deg) scale(1.02);z-index:6}
 66.66%{transform:rotate(11deg) scale(.93);z-index:3}
 83.33%{transform:rotate(22deg) scale(.86);z-index:2}
 92%{opacity:1}
 100%{transform:rotate(33deg) scale(.82);opacity:0;z-index:1}
}
.exc-ads .ro-deck{height:300px}
.exc-ads .ro-deck img{width:170px;margin-left:-85px}
@media (prefers-reduced-motion:reduce){.ro-deck img{animation:none}.ro-deck img:nth-child(1){transform:rotate(-12deg)}.ro-deck img:nth-child(3){transform:rotate(12deg)}}
.ro-pay[title="Google Pay"]{background:#fff}
.ro-deck{height:240px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ro-deck img{bottom:-6px;width:120px;margin-left:-60px;transform-origin:50% 250%}
.exc-ads .ro-deck{height:310px}.exc-ads .ro-deck img{width:160px;margin-left:-80px}
/* home: the deck shows the product covers (2:3): bigger cards that fill the tile, a faster turn (8 s, a card every 1.33 s) */
.ro-ads .ro-deck{flex:1 1 auto;height:auto;min-height:270px;margin-top:6px}
.ro-ads .ro-deck img{width:156px;margin-left:-78px;aspect-ratio:2/3;bottom:8px;transform-origin:50% 230%;animation-duration:8s;animation-delay:calc(var(--i) * -1.3333s)}
@media (max-width:560px){.ro-ads .ro-deck{min-height:240px}.ro-ads .ro-deck img{width:132px;margin-left:-66px}}
.ro-pays{flex-wrap:nowrap;gap:6px}
.ro-pay{flex:1 1 0;min-width:0;width:auto;max-width:58px}
html[data-theme="light"] .ro-pay{border-color:var(--pub-line-strong)}
.ro-secure svg{width:14px;height:14px}
.exc-ads .ro-deck{height:340px}.exc-ads .ro-deck img{width:200px;margin-left:-100px;transform-origin:50% 230%}@media (max-width:560px){.exc-ads .ro-deck{height:260px}.exc-ads .ro-deck img{width:140px;margin-left:-70px}}
.ro-video video{width:100%;max-width:230px;margin:auto auto 0;display:block;border-radius:18px}@media (max-width:900px){.ro-video video{max-width:220px}}
.ro-video video{margin:auto}
/* the 6 steps: each arrow sits IN FRONT of the two cards it joins, in a small round badge */
.pub-how .pub-step{position:relative;z-index:1}
.pub-how .pub-flow-arrow{position:relative;z-index:3;align-self:center;justify-self:center;display:grid;place-items:center;width:34px;height:34px;margin:0 -14px;border-radius:50%;background:var(--pub-bg);border:1px solid var(--pub-accent-line);color:var(--pub-accent)!important;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.pub-how .pub-flow-arrow svg{width:16px;height:16px}
html[data-theme="light"] .pub-how .pub-flow-arrow{background:#fff;box-shadow:0 6px 16px rgba(20,25,25,.12)}
@media (max-width:900px){.pub-how .pub-flow-arrow{margin:-10px auto}}
/* /examples video card: one big video at its real 9:16 shape (never cropped), small posters to switch */
.exc-player{display:grid;gap:10px;justify-items:center;margin-top:auto}
.exc-main{width:100%;max-width:340px;aspect-ratio:9/16;object-fit:contain;border-radius:16px;background:#000;border:1px solid var(--pub-line)}
.exc-pick{display:flex;gap:8px;justify-content:center}
.exc-pick button{width:54px;aspect-ratio:9/16;padding:0;border-radius:9px;overflow:hidden;border:2px solid transparent;background:#000;cursor:pointer;opacity:.6;transition:opacity .2s,border-color .2s}
.exc-pick button.on,.exc-pick button:hover{opacity:1;border-color:var(--pub-accent)}
.exc-pick img,.exc-pick video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}

/* examples page media: a slowly turning 3D carousel of eight cards close together (sales page, PDF pages, mockups, brand kit, ad) (the home page keeps its fan deck: the two pages never look the same) */
.ex-ring{position:relative;height:320px;margin-top:auto;perspective:1100px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.ex-ring-in{position:absolute;left:50%;top:22px;width:168px;height:210px;margin-left:-84px;transform-style:preserve-3d;animation:exRing 24s linear infinite}
.ex-ring img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.16);box-shadow:0 20px 44px -16px rgba(0,0,0,.65);transform:rotateY(calc(var(--i) * 45deg)) translateZ(212px);backface-visibility:hidden}
.ex-ring:hover .ex-ring-in{animation-play-state:paused}
@keyframes exRing{from{transform:rotateX(-6deg) rotateY(0)}to{transform:rotateX(-6deg) rotateY(-360deg)}}
@media (max-width:560px){.ex-ring{height:260px}.ex-ring-in{width:128px;height:160px;margin-left:-64px}.ex-ring img{transform:rotateY(calc(var(--i) * 45deg)) translateZ(162px)}}
@media (prefers-reduced-motion:reduce){.ex-ring-in{animation:none;transform:rotateX(-6deg) rotateY(-18deg)}}

/* /creators: the creator program page */
.crt-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:28px;align-items:center;padding:36px 0 10px}
.crt-hero-text{display:grid;gap:16px;justify-items:start}
.crt-hero-text h1{margin:0;font-size:clamp(30px,4.4vw,52px);line-height:1.05;letter-spacing:-.02em}
.crt-hero-text p{margin:0;color:var(--pub-muted);font-size:17px;line-height:1.6;max-width:56ch}
.crt-ctas{display:flex;gap:10px;flex-wrap:wrap}
.crt-hero-img{width:100%;height:auto;max-height:440px;object-fit:contain}
@media (max-width:900px){.crt-hero{grid-template-columns:1fr;padding-top:20px}.crt-hero-img{max-height:300px}}
.crt-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}
@media (max-width:900px){.crt-steps{grid-template-columns:1fr}}
.crt-steps .exc-card{display:grid;gap:8px;align-content:start}
.crt-steps h2{margin:0;font-size:20px}.crt-steps p{margin:0;color:var(--pub-muted);line-height:1.55}
.crt-n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--pub-accent,#7c6cf2);color:#fff;font-weight:800}
.crt-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:900px){.crt-grid{grid-template-columns:1fr}}
.crt-get{display:grid;gap:12px;align-content:start}
.crt-get ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.crt-get li{display:flex;gap:8px;align-items:flex-start;line-height:1.5}
.crt-get li svg{flex:none;width:18px;height:18px;margin-top:2px;fill:none;stroke:var(--pub-accent,#7c6cf2);stroke-width:2.4}
.crt-get img{width:100%;max-width:360px;justify-self:center;border-radius:18px}
.crt-r{margin:6px 0 0;font-size:18px}.crt-rules li{color:var(--pub-muted)}
/* /creators: the demo videos and "What you get" side by side (the examples page's column spans do not apply here) */
.crt-grid>.exc-card{grid-column:auto!important;grid-row:auto!important}
.crt-grid{align-items:start}
.crt-grid .exc-videos .exc-main{max-height:560px}
.crt-get img{max-width:300px}
/* the creator's picture stands ON the "Get paid" card (its cut-off bottom edge touches the card, it no longer floats) */
.crt-hero{align-items:end;padding-bottom:0}
.crt-hero-text{align-self:center;padding-bottom:18px}
.crt-hero-img{display:block;align-self:end;justify-self:end;margin-bottom:-18px;position:relative;z-index:0}
.crt-steps{position:relative;z-index:1}
/* the two cards side by side always have the same height */
.crt-grid{align-items:stretch!important}
.crt-grid>.exc-card{height:100%;box-sizing:border-box}
@media (max-width:900px){.crt-hero-img{justify-self:center}}
/* the owner's demo recording (creators + examples pages) */
.demo-1{display:grid;gap:14px;margin:18px 0;padding:22px;border:1px solid var(--pub-line,rgba(255,255,255,.1));border-radius:22px;background:var(--pub-panel,rgba(255,255,255,.03))}
.demo-1 header{display:grid;gap:6px}.demo-1 h2{margin:0;font-size:clamp(20px,2.4vw,28px)}.demo-1 p{margin:0;color:var(--pub-muted)}
.demo-1-frame{border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.demo-1-frame video{display:block;width:100%;aspect-ratio:16/9;background:#000}

/* Language picker (search + one line per language: own name bold, English name muted); same design as the dashboard's */
.lp-backdrop{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-start;justify-content:center;padding:max(48px,8vh) 16px 16px;background:rgba(0,0,0,.45);backdrop-filter:blur(2px)}
.lp-dialog{width:100%;max-width:440px;max-height:min(620px,calc(100dvh - 64px));display:flex;flex-direction:column;background:var(--pub-panel-solid);color:var(--pub-text);border:1px solid var(--pub-line);border-radius:14px;box-shadow:var(--pub-shadow);overflow:hidden}
.lp-dialog svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lp-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 14px 6px 18px}
.lp-head h2{margin:0;font-size:17px;font-weight:650;letter-spacing:0}
.lp-close{display:inline-grid;place-items:center;width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:var(--pub-muted);cursor:pointer}
.lp-close:hover,.lp-close:focus-visible{background:var(--pub-panel-2,rgba(127,127,127,.12));color:var(--pub-text)}
.lp-search{display:flex;align-items:center;gap:8px;margin:6px 14px 8px;padding:0 12px;border:1px solid var(--pub-line);border-radius:10px;color:var(--pub-muted)}
.lp-search:focus-within{border-color:var(--pub-line-strong);box-shadow:0 0 0 3px rgba(127,127,127,.18)}
.lp-search input{flex:1;min-width:0;height:40px;border:0;outline:0;background:transparent;color:var(--pub-text);font:inherit;font-size:16px}
.lp-list{overflow-y:auto;overscroll-behavior:contain;padding:2px 6px 8px}
.lp-row{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:9px 12px;border:0;border-radius:9px;background:transparent;color:var(--pub-text);font:inherit;text-align:start;cursor:pointer}
.lp-row.active{background:var(--pub-panel-2,rgba(127,127,127,.12))}
.lp-row:disabled{cursor:default;opacity:.5}
.lp-names{display:flex;flex-direction:column;min-width:0}
.lp-names b{font-weight:600;font-size:15px;line-height:1.3;unicode-bidi:isolate;text-align:start;overflow-wrap:anywhere}
.lp-names small{color:var(--pub-muted);font-size:12.5px;line-height:1.3}
.lp-mark{flex:none;display:inline-flex;align-items:center}
.lp-dot{width:14px;height:14px;border-radius:50%;border:2px solid var(--pub-muted);border-top-color:transparent;animation:lp-spin .8s linear infinite}
@keyframes lp-spin{to{transform:rotate(360deg)}}
.lp-group{margin:10px 12px 4px;font-size:11.5px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--pub-muted)}
.lp-empty{margin:18px 12px;color:var(--pub-muted);text-align:center}
@media (max-width:560px){
 .lp-backdrop{align-items:flex-end;padding:16px 0 0}
 .lp-dialog{max-width:none;max-height:calc(100dvh - 40px);border-radius:16px 16px 0 0;border-bottom:0}
}

/* the affiliate programme in plain numbers (home and /creators) */
.earn-band{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:center;margin:28px 0;padding:26px;border:1px solid var(--pub-line);border-radius:22px;background:var(--pub-panel-solid)}
@media (max-width:860px){.earn-band{grid-template-columns:1fr;padding:20px}}
.earn-copy{display:grid;gap:10px;justify-items:start}.earn-copy h2{margin:0}.earn-copy p{margin:0;color:var(--pub-muted);line-height:1.55}
.earn-copy .earn-pay{color:var(--pub-text);font-weight:600}
.earn-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:420px){.earn-cards{grid-template-columns:1fr}}
.earn-card{display:grid;gap:6px;padding:18px;border:1px solid var(--pub-line);border-radius:16px}
.earn-card span{color:var(--pub-muted)}.earn-card span b{color:var(--pub-text);font-size:18px}
.earn-plan{font-weight:700;color:var(--pub-text)!important}
.earn-pct{font-size:44px;line-height:1;color:var(--pub-accent)}

/* Founders Pass: the menu link stands out a little; the page uses the site's layout (2026-10-28) */
.pub-nav a.pub-nav-hot{color:var(--pub-text);font-weight:700;position:relative}
.pub-nav a.pub-nav-hot::after{content:"";position:absolute;top:2px;inset-inline-end:-8px;width:6px;height:6px;border-radius:50%;background:#35d08a}
.fp{max-width:1080px;margin:0 auto;padding:24px 20px 72px;color:var(--pub-text)}
.fp-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center;padding:20px 0 40px}
@media(max-width:860px){.fp-hero{grid-template-columns:1fr;gap:22px}}
.fp-eyebrow{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#35d08a;margin-bottom:10px}
.fp h1{font-size:clamp(30px,5vw,48px);line-height:1.1;margin:0 0 14px;letter-spacing:-.02em}
.fp-sub{font-size:18px;color:var(--pub-muted);margin:0}
.fp-card{background:var(--pub-panel-solid);border:1px solid var(--pub-line);border-radius:20px;padding:26px;box-shadow:var(--pub-shadow)}
.fp-price{font-size:46px;font-weight:800;line-height:1}.fp-price small{font-size:16px;font-weight:600;color:var(--pub-muted)}
.fp-seats{margin:14px 0 8px;font-weight:700}.fp-seats b{color:#35d08a}
.fp-bar{height:8px;border-radius:99px;background:var(--pub-line);overflow:hidden;margin:0 0 18px}.fp-bar i{display:block;height:100%;width:0;background:#35d08a}
.fp-cta{width:100%;justify-content:center}.fp-cta[aria-disabled=true]{opacity:.5;pointer-events:none}
.fp-note{font-size:13px;color:var(--pub-muted);margin:10px 0 0;text-align:center}
.fp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px;margin:0 0 18px}
.fp h2{font-size:22px;margin:0 0 12px}.fp ul{margin:0;padding-inline-start:20px}.fp li{margin:7px 0;color:var(--pub-muted)}.fp li b{color:var(--pub-text)}
.fp-faq{margin-top:28px}.fp-faq details{border-top:1px solid var(--pub-line);padding:14px 0}.fp-faq summary{cursor:pointer;font-weight:700}.fp-faq p{margin:8px 0 0;color:var(--pub-muted)}
