/* Public marketing views. Deliberately scoped away from the protected brand and editor. */
#landing{overflow:clip}
.m-mono{font:10px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.09em;text-transform:uppercase}
.m-button{display:inline-flex;align-items:center;justify-content:space-between;gap:48px;min-height:58px;padding:17px 25px;border-radius:999px;font-size:15px;font-weight:500;line-height:1.4;white-space:nowrap;transition:background .25s,color .25s,box-shadow .35s;flex-shrink:0}
.m-button>span{font-size:24px;line-height:1}.m-button--lime{background:#d5f66b;color:#15170f}.m-button--lime:hover{background:#e3ff94;box-shadow:0 5px 28px #d5f66b16}
.m-text-link{display:inline-flex;align-items:center;gap:22px;font-size:14px;font-weight:500;line-height:1.5;padding:9px 0;transition:color .2s}.m-text-link>span{font-size:22px;transition:transform .35s cubic-bezier(.22,.8,.25,1)}.m-text-link:hover>span{transform:translateX(4px)}
#landing .m-hero{padding:50px max(6vw,24px) 28px;min-height:calc(100svh - 116px);max-height:1100px;justify-content:flex-start}
#landing .m-hero .hero-eyebrow{font-size:10px;letter-spacing:.09em}
#landing .m-hero h1{font-size:clamp(65px,8.1vw,128px);font-weight:500;line-height:1.16;letter-spacing:-.07em;margin:clamp(58px,9vh,120px) 0 54px;max-width:1120px}
#landing .m-hero .hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-bottom:55px;max-width:1060px;width:100%}
#landing .m-hero .hero-bottom>p{font-size:18px;line-height:1.9;color:#9c9e96}
.m-hero-actions{display:flex;align-items:center;gap:30px}.m-hero-actions>.m-text-link{color:#c9cbc1}

#landing .m-hero .hero-logo{right:-2%;width:43vw;max-width:700px;top:49%;z-index:0}
/* Illustrative sample pages: static and clearly labelled, never pretending to be an editor. */
.m-profile{position:relative;isolation:isolate;aspect-ratio:1.46;overflow:hidden;font-size:clamp(9px,1vw,14px);container-type:inline-size;color:#242725;background:#b2b6b3;pointer-events:none;user-select:none}
.m-profile-nav{position:absolute;inset:0 0 auto;display:flex;gap:3%;justify-content:space-between;padding:4.5% 5.5%;font-size:2.05cqw;line-height:1.3;z-index:3}.m-profile-nav>span+span{font-size:1.7cqw}
.m-profile-portrait{position:absolute;overflow:hidden}.m-profile-portrait svg{display:block;width:100%;height:100%;object-fit:cover}.m-profile--motion .m-profile-portrait{width:51%;height:100%;left:26%;top:12%;clip-path:ellipse(48% 60% at 50% 60%)}.m-profile--motion .m-profile-portrait svg{width:100%;height:auto;min-height:100%}.m-profile--motion .m-profile-portrait svg>rect{fill:#b2b6b3}.m-profile--motion .m-profile-portrait svg>ellipse{fill:#b2b6b3}.m-profile--motion .m-profile-portrait svg>path:first-of-type{fill:#292a29}
.m-motion-name{position:absolute;left:-3%;bottom:-7%;white-space:nowrap;font-size:15cqw;letter-spacing:-.085em;line-height:1.1;font-weight:500;color:#f5f5f0;z-index:2}.m-motion-orbit{position:absolute;left:-3%;top:41%;padding:3.4% 3.5% 3.4% 7%;border-radius:0 999px 999px 0;background:#292c29;color:#e4e6db;display:flex;align-items:center;gap:1.2cqw;font-size:1.7cqw;line-height:1.3;z-index:2}.m-motion-orbit>span+span{display:grid;place-items:center;border:1px solid #dde0d38a;width:6cqw;height:6cqw;border-radius:50%;font-size:3.5cqw}.m-motion-role{position:absolute;right:4%;top:43%;font-size:2.4cqw;font-weight:500;line-height:1.5;color:#f3f5eb;z-index:2}.m-motion-role>span{display:block;font-size:4cqw;margin-bottom:2cqw;color:#f3f5eb}
.m-profile--index{background:#f6f5ee}.m-profile--index .m-profile-nav{padding-top:4.5%;padding-bottom:4.5%;border-bottom:1px solid #daddd0}.m-profile--index .m-profile-nav>span:first-child{font-weight:600}.m-index-intro{position:absolute;left:6%;top:24%;width:84%}.m-index-intro>span{display:block;font:1.15cqw/1.5 ui-monospace,monospace;letter-spacing:.14em;color:#747b68}.m-index-intro strong{display:block;font-size:8.4cqw;letter-spacing:-.08em;line-height:1.4;margin:2.6% 0 6%;font-weight:500;white-space:nowrap}.m-index-dot{display:inline-block;width:1.35cqw;height:1.35cqw;margin-left:1.3cqw;margin-bottom:4.8cqw;background:#677855;border-radius:50%}.m-index-intro p{font-size:1.7cqw;line-height:1.9;margin:0;letter-spacing:-.025em}.m-profile--index .m-profile-portrait{width:19%;height:29%;right:6%;top:52%;border-radius:1px}.m-index-work{position:absolute;left:6%;bottom:7%;width:60%;font-size:1.4cqw}.m-index-work>span{font:1cqw/1.5 ui-monospace,monospace;color:#808672;letter-spacing:.1em;display:block;margin-bottom:1.5cqw}.m-index-work>div{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #d6d9cd;padding:.8cqw 0}.m-index-work>div>span{font-size:1cqw;color:#8c9380}
.m-style-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px}.m-style-card{min-width:0}.m-style-preview{position:relative;display:block;border-radius:18px;overflow:hidden;background:#252823;border:1px solid #ffffff12;outline-offset:6px}.m-style-preview .m-profile{transition:transform .65s cubic-bezier(.22,.8,.25,1)}.m-style-preview:hover .m-profile{transform:scale(1.025)}.m-card-hover{position:absolute;right:20px;bottom:20px;background:#f1f0e9ed;color:#21271b;font-size:11px;padding:10px 16px;border-radius:999px;opacity:0;transform:translateY(5px);transition:opacity .25s,transform .35s;box-shadow:0 3px 12px #0001;backdrop-filter:blur(8px)}.m-style-preview:hover .m-card-hover,.m-style-preview:focus-visible .m-card-hover{opacity:1;transform:none}.m-style-info{padding:25px 2px;display:flex;align-items:center;justify-content:space-between;gap:15px}.m-style-info .m-mono{font-size:9px;color:#808875;margin:0}.m-style-info h3{font-size:34px;letter-spacing:-.06em;line-height:1.3;margin:5px 0 9px;font-weight:500}.m-style-info h3 a{display:inline-flex;gap:16px;align-items:center}.m-style-info h3 span{font-size:23px;color:#a8ae9b}.m-style-info p{margin:0;font-size:13px;color:#909786}.m-style-pill{border:1px solid #3d4236;color:#9ca68d;font-size:10px;padding:7px 11px;border-radius:30px;white-space:nowrap}.m-footer{padding:50px max(6vw,24px) 26px;display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:45px}.m-footer-brand{font-size:44px;letter-spacing:-.06em;font-weight:500;line-height:1.1}.m-footer>div{display:flex;justify-content:flex-end;gap:38px;color:#9ca490;font-size:12px}.m-footer>div>a:hover{color:#d5f66b}.m-footer>p{grid-column:1/-1;border-top:1px solid #30362a;padding-top:25px;margin:15px 0 0;font:9px ui-monospace,monospace;color:#626d57;display:flex;justify-content:space-between;gap:20px;letter-spacing:.06em}
/* Template library and the real interactive detail preview. */
#templates.m-gallery{padding:75px max(6vw,24px) 95px;max-width:1800px;margin:0 auto}.m-gallery-heading{margin:0 0 65px}.m-gallery-heading>.m-mono{color:#89977a;margin:0 0 30px}.m-gallery-heading h1{font-size:clamp(48px,6vw,88px);line-height:1.2;font-weight:500;letter-spacing:-.065em;margin:0}.m-gallery-heading h1>span{color:#747d68}.m-gallery-sub{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:34px}.m-gallery-sub>p{font-size:16px;line-height:1.9;color:#929e84;margin:0}.m-gallery-count{font-size:50px;font-weight:300;letter-spacing:-.08em;display:flex;align-items:center;gap:17px;line-height:1}.m-gallery-count>span{font-size:10px;letter-spacing:.05em;color:#77836a}.m-gallery-grid .m-style-preview{border-radius:22px}.m-gallery-grid .m-style-info{padding-top:30px}.m-gallery-grid .m-style-info h3{font-size:38px}.m-gallery-note{margin-top:55px;padding-top:30px;border-top:1px solid #30362a;display:flex;align-items:center;gap:24px}.m-gallery-note>span{color:#d9dfcf;font-size:15px}.m-gallery-note>p{font-size:13px;color:#7d8b6e;margin:0;flex:1}.m-gallery-note .m-text-link{color:#c8d8af}
.m-detail{padding:40px max(5vw,22px) 90px;max-width:1800px;margin:0 auto}.m-detail-back{display:inline-flex;align-items:center;gap:12px;color:#89967c;font-size:12px;margin:0 0 38px}.m-detail-back:hover{color:#d5f66b}.m-detail-back>span{font-size:18px}.m-detail-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.m-detail-heading .m-mono{color:#849671;margin:0 0 12px}.m-detail-heading h1{font-size:clamp(54px,6vw,88px);letter-spacing:-.07em;line-height:1.1;font-weight:500;margin:0}.m-detail-heading h1>span{display:block;font-size:22px;font-weight:400;line-height:1.5;letter-spacing:-.04em;color:#9ba58d;margin-top:18px}.m-detail-heading>.m-button{margin-bottom:5px}.m-detail-description{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin:32px 0 38px}.m-detail-description>p{max-width:570px;color:#808e72;font-size:14px;line-height:1.9;margin:0}.m-detail-tags{display:flex;flex-wrap:wrap;gap:8px;flex-shrink:0}.m-detail-tags>span{font-size:10px;border:1px solid #303b27;color:#91a17e;border-radius:30px;padding:6px 11px}.m-detail-preview{border:1px solid #32392a;border-radius:20px;background:#191d15;padding:0 17px 14px;overflow:hidden}.m-detail-toolbar{height:70px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 8px}.m-detail-toolbar>span{font-size:12px;display:flex;align-items:center;gap:9px;color:#aab69c}.m-detail-toolbar i{display:block;width:5px;height:5px;border-radius:50%;background:#d5f66b}.m-detail-toolbar small{font-size:10px;color:#6f7f5e}.m-detail-devices{display:flex;border-radius:999px;background:#0d110a;padding:4px;border:1px solid #2d3922}.m-detail-devices button{padding:7px 20px;border-radius:999px;color:#7f926a;font-size:11px;transition:background .2s,color .2s}.m-detail-devices button.active{background:#3a472a;color:#e7f5d7}.marketing-template-frame{position:relative;width:100%;height:clamp(460px,72svh,850px);overflow:hidden;background:#10120e;border-radius:10px}.marketing-template-frame iframe{position:absolute;top:0;left:0;display:block;transform-origin:top left;border:0;background:#f1f0e9}.marketing-template-frame[data-template-device=mobile]{background:radial-gradient(ellipse at 50% 30%,#303a24,#10120e)}.marketing-template-frame[data-template-device=mobile] iframe{border-radius:22px}.m-detail-hint{font-size:10px;color:#718260;text-align:center;margin:13px 0 0}.m-detail-bottom{display:flex;justify-content:space-between;align-items:center;gap:30px;margin-top:64px;padding:40px 0 0;border-top:1px solid #303b25}.m-detail-bottom h2{font-size:28px;letter-spacing:-.05em;font-weight:500;margin:0 0 8px;line-height:1.5}.m-detail-bottom p{color:#7e906a;font-size:13px;margin:0}
@media(min-width:1700px){}
@media(max-width:1100px){.m-hero-actions{gap:20px}.m-hero-actions>.m-text-link{display:none}.m-detail-description{align-items:flex-start}.m-detail-tags{flex-shrink:1;max-width:260px;justify-content:flex-end}.m-style-info h3{font-size:29px}.m-style-pill{display:none}}
@media(max-width:800px){#landing .m-hero{min-height:calc(88svh - 100px);padding-top:42px}#landing .m-hero h1{font-size:10vw;margin-top:65px;margin-bottom:45px}#landing .m-hero .hero-bottom>p{font-size:15px}.m-button{font-size:13px;gap:32px;min-height:52px;padding:15px 22px}.m-style-grid{gap:22px}.m-style-info p{font-size:11px}.m-detail-heading h1>span{font-size:18px}.m-detail-description{display:block}.m-detail-tags{max-width:none;justify-content:flex-start;margin-top:18px}.m-gallery-count{font-size:40px}.m-gallery-sub>p{font-size:14px}}
@media(max-width:600px){#landing .m-hero{min-height:calc(100svh - 102px);max-height:960px;padding:40px 22px 23px}#landing .m-hero .hero-eyebrow{font-size:7px;gap:8px}#landing .m-hero h1{font-size:11.3vw;margin:75px 0 42px;line-height:1.28}#landing .m-hero .hero-bottom{display:block;margin-bottom:38px}#landing .m-hero .hero-bottom>p{font-size:14px;line-height:1.9}.m-hero-actions{margin-top:28px;display:flex;gap:20px}.m-hero-actions .m-button{font-size:12px;padding:14px 20px;gap:26px;min-height:49px}.m-hero-actions>.m-text-link{display:inline-flex;font-size:10px;gap:7px}.m-hero-actions>.m-text-link>span{font-size:16px}#landing .m-hero .hero-logo{width:92vw;right:-28%;top:44%;max-width:450px}.m-mono{font-size:8px}.m-style-grid{grid-template-columns:1fr;gap:23px}.m-style-preview{border-radius:13px}.m-style-info{padding:18px 0}.m-style-info h3{font-size:29px;margin-top:4px;margin-bottom:6px}.m-style-info .m-mono{font-size:8px;margin:0}.m-style-info p{font-size:12px}.m-style-pill{display:block;font-size:8px;padding:6px 9px}.m-card-hover{opacity:1;transform:none;font-size:9px;padding:7px 12px;right:12px;bottom:12px;background:#f1f0e9e6}.m-footer{padding:38px 22px 25px;gap:32px}.m-footer-brand{font-size:35px}.m-footer>div{gap:18px;font-size:10px}.m-footer>p{display:block;font-size:7px;line-height:1.8;letter-spacing:0;margin-top:0;padding-top:22px}.m-footer>p>span{display:block;margin-top:10px}#templates.m-gallery{padding:45px 22px 65px}.m-gallery-heading{margin-bottom:40px}.m-gallery-heading>.m-mono{font-size:8px;margin-bottom:24px}.m-gallery-heading h1{font-size:49px}.m-gallery-sub{margin-top:25px;gap:20px}.m-gallery-sub>p{font-size:12px}.m-gallery-count{font-size:34px;display:block;text-align:right}.m-gallery-count>span{display:block;font-size:7px;letter-spacing:0;margin-top:10px;white-space:nowrap}.m-gallery-grid .m-style-preview{border-radius:15px}.m-gallery-grid .m-style-info{padding-top:21px}.m-gallery-grid .m-style-info h3{font-size:30px}.m-gallery-note{margin-top:20px;padding-top:27px;display:block}.m-gallery-note>span{font-size:14px}.m-gallery-note>p{font-size:11px;line-height:1.8;margin:9px 0 10px}.m-gallery-note .m-text-link{font-size:12px}.m-detail{padding:30px 18px 55px}.m-detail-back{font-size:11px;margin-bottom:25px}.m-detail-heading{display:block}.m-detail-heading h1{font-size:58px}.m-detail-heading h1>span{font-size:19px;margin-top:14px}.m-detail-heading>.m-button{margin-top:25px;font-size:12px;gap:40px;min-height:49px;padding:14px 21px}.m-detail-description{margin:24px 0}.m-detail-description>p{font-size:12px;line-height:1.9}.m-detail-tags{gap:6px;margin-top:16px}.m-detail-tags>span{font-size:8px;padding:5px 9px}.m-detail-preview{border-radius:14px;padding:0 7px 11px;margin:0 -7px}.m-detail-toolbar{height:61px;padding:0 5px;gap:10px}.m-detail-toolbar>span{font-size:10px;gap:6px}.m-detail-toolbar small{display:none}.m-detail-devices{padding:3px}.m-detail-devices button{font-size:9px;padding:6px 13px}.marketing-template-frame{height:65svh;min-height:430px;max-height:700px;border-radius:8px}.m-detail-hint{font-size:8px;line-height:1.7;padding:0 10px}.m-detail-bottom{display:block;margin-top:38px;padding-top:30px}.m-detail-bottom h2{font-size:25px}.m-detail-bottom p{font-size:11px}.m-detail-bottom>.m-button{margin-top:22px;font-size:12px;gap:50px}}
@media(max-width:360px){#landing .m-hero{padding-left:18px;padding-right:18px}#landing .m-hero h1{font-size:11.2vw;margin-top:60px}.m-hero-actions{gap:12px}.m-hero-actions>.m-text-link{font-size:9px;gap:4px}.m-hero-actions .m-button{font-size:11px;padding:13px 17px;gap:20px}#templates.m-gallery{padding-left:18px;padding-right:18px}.m-gallery-heading h1{font-size:44px}}
@media(prefers-reduced-motion:reduce){.m-style-preview .m-profile,.m-card-hover,.m-text-link>span,.m-button,.m-detail-devices button{transition:none!important}.m-style-preview:hover .m-profile{transform:none}}

/* PC hero composition: quiet copy by the portrait, actions anchored to this screen. */
@media(min-width:721px){
  #landing .m-hero{min-height:calc(100svh - 116px);padding-bottom:160px}
  #landing .m-hero h1{margin-top:clamp(45px,7vh,90px);margin-bottom:0}
  #landing .m-hero .hero-bottom{position:static;display:contents}
  #landing .m-hero .hero-bottom>p{position:absolute;right:6vw;bottom:170px;margin:0;text-align:right;font-size:clamp(19px,1.45vw,25px);line-height:1.9;color:rgb(241 240 233 / .18);z-index:2;max-width:40%}
  #landing .m-hero .m-hero-actions{position:absolute;left:50%;bottom:52px;transform:translateX(-50%);gap:32px;z-index:3}
}
@media(min-width:721px) and (max-height:760px){
  #landing .m-hero{padding-top:30px}
  #landing .m-hero h1{font-size:clamp(62px,min(7.8vw,13svh),100px);margin-top:36px}
  #landing .m-hero .hero-bottom>p{bottom:155px;font-size:19px}
}

/* Round two: a contour portrait and one pair of actions carried into the next scene. */
#landing .m-hero .hero-logo-art{--logo-fill:none;--logo-stroke:#d5e79c;--logo-detail-stroke:#d5e79c;fill:none;stroke-width:12;opacity:.16}
#landing .m-hero .hero-logo-art use{fill:none}
.hero-transition{position:relative;padding:0 24px 35px;z-index:3}
.hero-transition .m-hero-actions{justify-content:center}
@media(min-width:721px){
  #landing .m-hero .hero-bottom>p{font-size:clamp(26px,1.65vw,32px);bottom:115px;line-height:1.75}
  .hero-transition{height:calc(30svh + 112px);margin-top:-110px;padding:0;pointer-events:none}
  .hero-transition .m-hero-actions{position:sticky;top:35svh;width:var(--cta-width,375px);height:var(--cta-height,58px);margin-inline:auto;gap:var(--cta-gap,30px);pointer-events:auto}
  .hero-transition .m-hero-actions>a{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:100%;min-height:0;font-size:var(--cta-font,15px);border-radius:var(--cta-radius,999px);flex-shrink:0;white-space:nowrap}
  .hero-transition .m-hero-actions>.m-button{width:var(--cta-first,207px)}
  .hero-transition .m-hero-actions>.m-text-link{flex:1;min-width:0;padding:17px var(--cta-padding,0px);background:rgb(31 35 28 / var(--cta-tone,0));box-shadow:inset 0 0 0 1px rgb(216 230 194 / calc(var(--cta-tone,0)*.10));color:#d1d7c9}
}
@media(min-width:721px) and (max-height:760px){#landing .m-hero .hero-bottom>p{font-size:25px;bottom:115px;max-width:42%}}
@media(prefers-reduced-motion:reduce){.hero-transition{height:auto;margin-top:0;padding:35px 3vw 50px}.hero-transition .m-hero-actions{position:relative;top:auto}}
@media(min-width:721px){#landing .m-hero .hero-bottom>p{bottom:45px}}
