/* Web62 UI fix: shared public skill entry, using the existing MochiPay palette. */
.skill-promo-section{padding:40px 0;text-align:left}
.skill-promo{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:center;padding:32px;border:1px solid #edd8c7;border-radius:18px;background:linear-gradient(110deg,#fff9f3,#fff);color:#25211e;text-align:left;box-shadow:0 8px 28px rgba(52,37,26,.035)}
.skill-promo-copy{min-width:0}.skill-promo-kicker{display:block;margin-bottom:12px;color:#a94712;font-size:11px;font-weight:800;letter-spacing:1.6px;line-height:1.5}
.skill-promo .skill-promo-copy h2{margin:0 0 12px;font-size:26px;line-height:1.25;letter-spacing:-.45px;color:#25211e;text-align:left}
.skill-promo .skill-promo-copy p{margin:0;max-width:700px;font-size:15px;line-height:1.75;color:#68615b}
.skill-promo-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px;flex-shrink:0}
.skill-promo-actions a{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:46px;padding:12px 18px;border:1px solid transparent;border-radius:10px;font-size:14px;font-weight:750;line-height:1.4;text-decoration:none;transition:background .15s,border-color .15s}
.skill-promo .skill-promo-actions a.skill-promo-primary{background:#ff8a3d;color:#fff;text-decoration:none;box-shadow:0 5px 14px rgba(255,138,61,.16)}
.skill-promo .skill-promo-actions a.skill-promo-primary:hover{background:#e9762d;color:#fff}
.skill-promo .skill-promo-actions a.skill-promo-secondary{background:#fff;color:#a94712;border-color:#e6c8af;text-decoration:none}
.skill-promo .skill-promo-actions a.skill-promo-secondary:hover{background:#fff0e3;border-color:#bf713b;color:#81330c}
.skill-promo a:focus-visible,.skill-hero-link:focus-visible{outline:3px solid #b64d0e;outline-offset:4px}
.skill-promo-home{margin-top:30px}.skill-promo-onboarding{margin-top:34px}
.developers-page .skill-hero-entry{margin-top:16px}
.developers-page .skill-hero-entry .skill-hero-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;white-space:nowrap;color:#a94712;font-size:14px;font-weight:750;line-height:1.5;text-decoration:underline;text-underline-offset:4px}
.developers-page .skill-hero-link:hover{color:#81330c}
@media(min-width:1281px){.public-nav{gap:18px}}
/* Switch the slightly fuller navigation to the existing menu before it crowds. */
@media(min-width:901px) and (max-width:1100px){
 .header-inner{position:relative}.public-menu-button{width:42px;height:42px;margin-left:auto;border:1px solid #eee5dd;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:#fff;cursor:pointer}
 .public-menu-button span{width:18px;height:2px;border-radius:2px;background:#554d47;transition:transform .16s ease,opacity .16s ease}
 .public-nav-panel{padding:17px;position:absolute;top:calc(100% + 1px);left:0;right:0;border:1px solid #eee5dd;border-top:0;border-radius:0 0 14px 14px;display:none;align-items:stretch;background:#fff;box-shadow:0 20px 35px rgba(52,37,26,.12)}
 .public-nav-toggle:checked ~ .public-nav-panel{display:block}.public-nav-toggle:checked + .public-menu-button span:nth-child(1){transform:translateY(6px) rotate(45deg)}.public-nav-toggle:checked + .public-menu-button span:nth-child(2){opacity:0}.public-nav-toggle:checked + .public-menu-button span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
 .public-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px!important}.public-nav a{padding:12px;border-radius:8px}.public-nav a::after{display:none}.public-nav a:hover{background:#fff4e9}.header-buttons{margin-top:12px;padding-top:13px;border-top:1px solid #eee5dd;justify-content:flex-end}
}
@media(max-width:1100px){.public-nav>a{white-space:normal}}
@media(max-width:760px){.skill-promo-section{padding:28px 0}.skill-promo{grid-template-columns:minmax(0,1fr);gap:22px;padding:26px}.skill-promo-actions{flex-direction:row;flex-wrap:wrap;align-items:center}.skill-promo-actions a{flex:1 1 200px}.skill-promo .skill-promo-copy h2{font-size:24px}}
@media(max-width:480px){.skill-promo{padding:23px 20px;border-radius:14px}.skill-promo-actions{flex-direction:column;align-items:stretch}.skill-promo-actions a{flex:none;width:100%}.skill-promo .skill-promo-copy h2{font-size:23px}.skill-promo .skill-promo-copy p{font-size:14px}.skill-promo-home,.skill-promo-onboarding{margin-top:26px}}
