:root{--green:#22c55e;--teal:#007d70;--ink:#111d26;--muted:#5d7180;--line:#dce5e7;--paper:#fffefa;--page:#f5f8f5;--shadow:0 12px 32px rgba(32,70,55,.08)}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--page);padding:22px 3vw 30px;min-height:100vh}.page-shell{position:relative;isolation:isolate;overflow:hidden;width:min(1440px,100%);min-height:560px;margin:0 auto;border:1px solid #edf0ec;border-radius:13px;background:var(--paper);box-shadow:var(--shadow)}.page-shell:before{content:"";position:absolute;z-index:-1;inset:auto -3% -22% -3%;height:36%;background:radial-gradient(ellipse at 100% 100%,rgba(64,213,170,.24),transparent 52%),radial-gradient(ellipse at 0 100%,rgba(161,235,163,.2),transparent 42%);pointer-events:none}.page-header{display:flex;align-items:center;justify-content:space-between;padding:18px clamp(22px,6vw,82px);position:relative;z-index:2}.brand{display:inline-flex;align-items:center;gap:8px;color:#101d25;text-decoration:none;font-size:34px;font-weight:700;letter-spacing:-.06em}.brand img{display:block;width:48px;height:48px;object-fit:contain}.top-links{display:flex;align-items:center;gap:30px}.top-links a{color:#12212a;text-decoration:none;font-size:12px;font-weight:500}.top-links a:hover{text-decoration:underline}.top-links .cta-link{display:inline-flex;align-items:center;justify-content:center;padding:9px 17px;border:1px solid #dcefe1;border-radius:999px;background:#f1faf1;color:#078d51;font-weight:600;text-decoration:none}.top-links .cta-link:hover{background:#e8f7ec}.page-footer{position:absolute;z-index:2;bottom:18px;left:0;right:0;display:flex;justify-content:center;align-items:center;gap:26px;color:#617582;font-size:10px}.page-footer strong{color:var(--ink)}.page-footer a{color:inherit;text-decoration:none}.page-footer a:hover{text-decoration:underline}
/* Home */
.home-shell{min-height:min(650px,calc(100vh - 44px));display:flex;flex-direction:column}.home-shell:after{content:"↗";position:absolute;z-index:-1;right:3%;top:16%;color:rgba(36,190,128,.105);font:700 clamp(300px,42vw,560px)/.9 Arial,sans-serif;transform:rotate(-2deg);pointer-events:none}.home-main{display:grid;place-items:center;flex:1;padding:24px 20px 50px;text-align:center}.home-copy{position:relative;z-index:1;width:min(650px,100%)}.eyebrow{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:16px;color:#00a64e;font-size:12px;font-weight:700;letter-spacing:.15em;text-transform:uppercase}.eyebrow:after{content:"";width:22px;height:1px;background:#18bb68}.home-copy h1{max-width:19ch;margin:0 auto 12px;font-size:clamp(36px,4.1vw,46px);line-height:1.12;letter-spacing:-.045em}.accent{color:#14ad59}.home-copy .lead{max-width:48ch;margin:0 auto 26px;color:var(--muted);font-size:15px;line-height:1.6}.waitlist-form{width:min(448px,100%);margin:0 auto}.form-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field{position:relative}.field input,.field textarea{display:block;width:100%;border:1px solid #d8e2e4;border-radius:9px;background:rgba(255,255,255,.9);padding:12px 13px 12px 36px;color:var(--ink);font:inherit;font-size:12px;outline:none;box-shadow:0 2px 5px rgba(22,55,46,.025)}.field input{height:42px}.field textarea{min-height:76px;resize:vertical}.field input:focus,.field textarea:focus{border-color:#19ad70;box-shadow:0 0 0 3px rgba(25,173,112,.1)}.field .field-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:#183241;pointer-events:none}.field.message-field .field-icon{top:14px;transform:none}.primary-button{width:100%;min-height:44px;border:0;border-radius:999px;background:linear-gradient(105deg,#18b849,#008d78);color:#fff;font:600 14px Inter,Arial,sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:filter .2s}.primary-button:hover{filter:brightness(.96)}.primary-button:disabled{opacity:.7;cursor:wait}.form-submit{grid-column:1/-1;margin-top:2px}.fineprint{margin-top:14px;color:var(--muted);font-size:11px}.form-message{display:none;margin-top:10px;color:#a52a38;font-size:12px}.form-message.visible{display:block}.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.38);border-top-color:#fff;border-radius:50%;display:none;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
/* About */
.about-shell,.contact-shell{min-height:min(720px,calc(100vh - 44px))}.about-layout{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(32px,6vw,86px);padding:18px clamp(26px,7vw,92px) 64px}.about-copy .eyebrow,.contact-copy .eyebrow{justify-content:flex-start;margin-bottom:10px;font-size:10px}.about-copy h1,.contact-copy h1{margin-bottom:12px;font-size:clamp(30px,3vw,38px);line-height:1.16;letter-spacing:-.045em}.about-copy .lead,.contact-copy .lead{max-width:53ch;color:var(--muted);font-size:13px;line-height:1.65}.about-art{position:relative;min-height:300px;overflow:hidden;border-radius:10px;background:linear-gradient(145deg,#228d7e 0%,#a9dfd0 57%,#d7eee2 100%);box-shadow:0 8px 20px rgba(24,92,72,.1)}.about-art:before{content:"";position:absolute;left:-6%;right:-5%;bottom:-1%;height:42%;background:linear-gradient(120deg,#e8f1db,#b2d7bd);clip-path:polygon(0 20%,100% 0,100% 100%,0 100%)}.about-art:after{content:"";position:absolute;right:9%;bottom:0;width:52%;height:84%;border-radius:48% 10% 0 0;background:linear-gradient(105deg,#eff3df 0 15%,#08785e 16% 100%);box-shadow:-10px 0 24px rgba(255,255,255,.25);clip-path:polygon(0 17%,100% 0,100% 100%,0 100%,0 34%,22% 34%,22% 100%,78% 100%,78% 16%)}.art-caption{position:absolute;z-index:1;left:24px;top:24px;color:white;font-size:14px;font-weight:600;line-height:1.5}.art-caption:after{content:"";display:block;width:20px;height:1px;margin-top:14px;background:#86e0a2}.about-values{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:25px}.value-item{font-size:11px;font-weight:700;color:var(--ink)}.value-icon{width:27px;height:27px;margin-bottom:8px;border-radius:50%;display:grid;place-items:center;background:#e8f7ec;color:#00966e;font-size:13px}.value-item p{margin-top:5px;color:var(--muted);font-size:10px;font-weight:400;line-height:1.55}
/* Contact */
.contact-layout{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:clamp(36px,8vw,110px);padding:20px clamp(26px,7vw,92px) 66px}.contact-details{display:grid;gap:16px;margin-top:24px}.contact-item{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:center;font-size:12px}.contact-icon{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#e9f7ee;color:#008c6b;font-size:13px}.contact-item strong{display:block;margin-bottom:3px;color:var(--ink);font-size:11px}.contact-item span,.contact-item a{color:var(--muted);font-size:10px;text-decoration:none}.contact-item a:hover{text-decoration:underline}.contact-form{padding:14px;border:1px solid #e0e8e9;border-radius:10px;background:rgba(255,255,255,.7)}.contact-form .form-fields{grid-template-columns:1fr;gap:10px}.contact-form .field input,.contact-form .field textarea{font-size:11px;border-color:#e4e9ea;background:#fff}.contact-form .form-submit{grid-column:auto;margin-top:0;min-height:42px;font-size:12px}
/* Waitlist success dialog */
.overlay{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:18px;background:rgba(10,28,23,.55);opacity:0;pointer-events:none;transition:opacity .2s}.overlay.active{opacity:1;pointer-events:auto}.modal{width:min(420px,100%);padding:28px;border:1px solid var(--line);border-radius:16px;background:#fff;text-align:center;box-shadow:var(--shadow);transform:translateY(8px);transition:transform .2s}.overlay.active .modal{transform:translateY(0)}.ok{width:52px;height:52px;display:grid;place-items:center;margin:0 auto 12px;border-radius:50%;background:#07966b;color:white;font-size:24px}.modal h2{margin-bottom:8px;font-size:28px}.modal p{margin-bottom:16px;color:var(--muted);font-size:13px}.position{display:inline-block;margin-bottom:15px;padding:8px 17px;border:1px solid #c4e8d2;border-radius:10px;background:#eaf8ef;color:#0d7546;font-size:27px;font-weight:800}.close{border:1px solid var(--line);border-radius:9px;padding:9px 14px;background:#f4fbf7;color:#245b42;font:600 13px Inter,Arial,sans-serif;cursor:pointer}
@media(max-width:760px){body{padding:10px}.page-shell{min-height:calc(100vh - 20px)}.home-shell{min-height:calc(100vh - 20px)}.page-header{padding:12px 16px}.brand{gap:5px;font-size:27px}.brand img{width:39px;height:39px}.top-links{gap:12px}.top-links a{font-size:11px}.top-links .cta-link{padding:8px 11px}.home-main{padding:22px 18px 45px}.home-shell:after{right:-7%;top:22%;font-size:360px}.home-copy h1{font-size:clamp(32px,8vw,42px)}.home-copy .lead{font-size:14px}.about-layout,.contact-layout{grid-template-columns:1fr;gap:22px;padding:12px 22px 68px}.about-art{min-height:240px;grid-row:1}.about-copy{grid-row:2}.contact-layout{gap:22px}.contact-form{max-width:none}.page-footer{bottom:13px;gap:16px;font-size:9px}}
@media(max-width:480px){.top-links{gap:9px}.top-links a{font-size:10px}.top-links .cta-link{padding:7px 9px}.form-fields{grid-template-columns:1fr}.home-copy h1{font-size:32px}.about-values{gap:8px}.about-art{min-height:210px}.contact-layout{padding-left:18px;padding-right:18px}}

/* Full-viewport canvas on every route */
html,body{width:100%;min-height:100%;margin:0}
body{width:100vw;height:100vh;min-height:100vh;padding:0;overflow-x:hidden}
.page-shell{width:100vw;height:100vh;min-height:100vh;max-width:none;margin:0;border:0;border-radius:0;box-shadow:none}
.home-shell,.about-shell,.contact-shell{width:100vw;height:100vh;min-height:100vh;margin:0}
.page-shell{overflow-x:hidden;overflow-y:auto}

/* Dynamic viewport sizing with a legacy viewport fallback */
html{height:100%}
body{height:100vh;height:100svh;min-height:100vh;min-height:100svh}
.page-shell,.home-shell,.about-shell,.contact-shell{height:100vh;height:100svh;min-height:100vh;min-height:100svh}

/* Use the supplied brand mark as the hero watermark */
.home-shell:after{content:"";width:min(44vw,560px);height:min(76vh,620px);top:12%;right:2%;color:transparent;font-size:0;background:url("Tlogo.png") center/contain no-repeat;opacity:.06;transform:none;mix-blend-mode:multiply}
.waitlist-form .field input{height:56px}
@media(max-width:760px){.home-shell:after{width:48vw;height:56vh;top:24%;right:-10%;opacity:.035}}

/* Complete supplied moni logo wordmark */
.brand{gap:0;line-height:0}
.brand img{width:150px;height:60px;object-fit:cover;object-position:center;mix-blend-mode:multiply}
@media(max-width:760px){.brand img{width:126px;height:50px}}

/* Keep Home on a single viewport with its footer at the bottom */
body{overflow:hidden}
.home-shell{height:100vh;height:100svh;min-height:100vh;min-height:100svh;overflow:hidden}
.home-main{flex:1 1 0;min-height:0;padding:0 20px}
.page-header{flex:0 0 auto}
.home-shell .page-footer{bottom:18px}

/* Home uses the supplied full-canvas background artwork */
.home-shell{background:#f7faf6 url("bgimages/homebg.png") center center/cover no-repeat}
.home-shell:before,.home-shell:after{display:none}
@media(max-width:760px){.home-shell{background-position:right center}}

/* Desktop page content follows the reference's vertical proportions */
@media(min-width:761px){
    .about-layout{align-items:start;padding-top:clamp(30px,5vh,64px)}
    .about-art{height:62svh;min-height:220px;max-height:620px}
    .about-copy .lead{line-height:1.75}
    .about-values{margin-top:clamp(25px,3vh,42px)}
    .contact-layout{padding-top:clamp(36px,10svh,92px)}
    .contact-form{padding:clamp(10px,1.5svh,18px)}
    .contact-form .form-fields{gap:clamp(8px,1.3svh,14px)}
    .contact-form .field input{height:clamp(30px,7.8svh,58px)}
    .contact-form .field textarea{height:clamp(52px,13svh,112px);min-height:clamp(52px,13svh,112px)}
    .contact-form .form-submit{min-height:clamp(30px,7svh,54px)}
}
@media(min-width:761px){.about-layout{grid-template-columns:.9fr 1.1fr}}

/* Contain the ambient glow inside the viewport; it must not create page scroll */
.page-shell:before{bottom:0;height:36%}
@media(min-width:761px){.about-shell,.contact-shell{overflow:hidden}}
@media(max-width:760px){.about-shell,.contact-shell{overflow-x:hidden;overflow-y:auto}}

/* Supplied About page artwork */
.about-art{background:none}
.about-art:before,.about-art:after{display:none}
.about-image{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
@media(max-width:760px){.about-art{height:38svh;min-height:210px;max-height:320px}}

/* Square About artwork and more readable About/Contact content */
@media(min-width:761px){.about-art{width:min(100%,62svh);height:auto;aspect-ratio:1/1;min-height:0;max-height:none;justify-self:center}}
.about-copy h1,.contact-copy h1{font-size:clamp(34px,3.4vw,48px)}
.about-copy .lead,.contact-copy .lead{font-size:clamp(15px,1.15vw,17px);line-height:1.7}
.about-copy .eyebrow,.contact-copy .eyebrow{font-size:11px}
.value-item{font-size:13px}.value-item p{font-size:12px;line-height:1.6}
.contact-item strong{font-size:13px}.contact-item span,.contact-item a{font-size:12px}
.contact-form .field input,.contact-form .field textarea{font-size:13px}.contact-form .form-submit{font-size:14px}
@media(max-width:760px){.about-art{width:min(100%,38svh);height:auto;aspect-ratio:1/1;min-height:0;max-height:none;justify-self:center}}

/* Match About page copy width and vertical rhythm to its reference */
@media(min-width:761px){
    .about-layout{padding-top:7vh}
    .about-copy .lead{max-width:44ch;font-size:clamp(14px,1.35vw,20px);line-height:1.7}
    .about-values{margin-top:clamp(32px,5vh,48px)}
    .value-item{font-size:15px}
    .value-item p{font-size:13px;line-height:1.6}
}

/* Slightly larger square About image */
@media(min-width:761px){.about-art{width:min(100%,66svh)}}
@media(max-width:760px){.about-art{width:min(100%,42svh)}}

/* Larger About feature labels and icons; supporting copy keeps its existing size. */
.value-item{font-size:clamp(14px,1.2vw,17px)}
.value-icon{width:36px;height:36px;font-size:17px;margin-bottom:10px}


/* Restore the About description to its original size. */
.about-copy .lead{font-size:13px}


/* Equal-width About text and image columns on desktop. */
@media(min-width:761px){.about-layout{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Lower the About feature row slightly. */
@media(min-width:761px){.about-values{margin-top:clamp(42px,6vh,58px)}}


/* Enlarge the About feature icons. */
.value-icon{width:42px;height:42px;font-size:20px}


/* Enlarge the symbols inside the About feature icon circles. */
.value-icon{font-size:25px}


/* Increase space above the About values row. */
@media(min-width:761px){.about-values{margin-top:clamp(52px,7vh,68px)}}
@media(max-width:760px){.about-values{margin-top:34px}}


/* Supplied full-viewport background for the Contact page. */
.contact-shell{background-color:var(--paper);background-image:url('bgimages/contactbg.png');background-position:center;background-size:cover;background-repeat:no-repeat}


/* Narrow the Contact form on desktop while keeping it aligned to the right. */
@media(min-width:761px){.contact-form{width:min(100%,640px);justify-self:end}}


/* More breathing room inside the narrower desktop Contact form. */
@media(min-width:761px){.contact-form{width:min(100%,560px);padding:20px;justify-self:end}}


/* Enlarge Contact page details and their icons for readability. */
.contact-details{gap:20px}
.contact-item{grid-template-columns:36px 1fr;gap:12px;font-size:15px}
.contact-icon{width:36px;height:36px;font-size:16px}
.contact-item strong{font-size:16px}
.contact-item span,.contact-item a{font-size:14px}


/* Larger green icons for Contact details. */
.contact-item{grid-template-columns:44px 1fr}
.contact-icon{width:44px;height:44px;font-size:20px;color:#00a65a;background:#e5f8eb}


/* Keep the icon glyph green despite the general Contact span color. */
.contact-item .contact-icon{color:#00a65a}


/* Increase the Contact icon circle size. */
.contact-item{grid-template-columns:52px 1fr}
.contact-icon{width:52px;height:52px}


/* Enlarge the symbols inside the Contact icon circles. */
.contact-item .contact-icon{font-size:26px}


/* Consistent sizing for the Contact line icons. */
.contact-icon svg{display:block;flex:0 0 auto}


/* Mobile-only hamburger navigation for all public pages. */
.menu-toggle{display:none}
@media(max-width:760px){
  .page-header{position:relative}
  .menu-toggle{position:relative;z-index:22;display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;border:1px solid rgba(255,255,255,.75);border-radius:15px;background:#e8f4ff;box-shadow:0 5px 14px rgba(15,44,78,.12);cursor:pointer}
  .menu-toggle span{position:absolute;width:22px;height:2px;border-radius:2px;background:#142130;transition:transform .18s ease,opacity .18s ease}
  .menu-toggle span:nth-child(1){transform:translateY(-7px)}
  .menu-toggle span:nth-child(3){transform:translateY(7px)}
  .page-header.menu-open .menu-toggle span:nth-child(1){transform:rotate(45deg)}
  .page-header.menu-open .menu-toggle span:nth-child(2){opacity:0}
  .page-header.menu-open .menu-toggle span:nth-child(3){transform:rotate(-45deg)}
  .top-links{position:absolute;z-index:21;top:calc(100% + 10px);right:16px;display:none;flex-direction:column;align-items:stretch;gap:0;width:min(250px,calc(100vw - 32px));padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:#191a30;box-shadow:0 16px 36px rgba(11,19,42,.28)}
  .page-header.menu-open .top-links{display:flex}
  .top-links a{display:block;padding:13px 14px;border-radius:10px;color:#fff;font-size:15px;font-weight:600;text-decoration:none}
  .top-links a:hover{background:rgba(255,255,255,.07);text-decoration:none}
  .top-links .cta-link{display:block;margin-top:8px;padding:14px;border:0;border-top:1px solid rgba(255,255,255,.12);border-radius:0;background:transparent;color:#fff}
  .top-links .cta-link:hover{background:rgba(255,255,255,.07)}
}
