/* Layout repairs for the existing marketplace design. */
:root{--layout-max:1240px;--layout-gutter:40px;--layout-space-1:8px;--layout-space-2:16px;--layout-space-3:24px;--layout-space-4:32px}
.skip-link{position:fixed;top:8px;left:8px;z-index:100;padding:10px 16px;background:var(--hb-surface);transform:translateY(-180%)}
.skip-link:focus{transform:none}
.ui-icon{width:20px;height:20px;vertical-align:middle;flex-shrink:0}
header.header,.landing-page header.header{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.header .brand{flex-shrink:0}
.header .header-actions{flex-shrink:0}
.header .brand-mark,.market-footer .brand-mark{flex:0 0 auto;display:inline-grid;place-items:center;line-height:1}
.market-footer .brand{display:inline-flex;align-items:center;max-width:100%;gap:10px;white-space:normal}
.market-footer .footer-top>*,.market-footer .footer-bottom>*{min-width:0}
.market-footer .footer-column{display:flex;flex-direction:column;align-items:flex-start;flex-wrap:nowrap;width:auto;max-width:100%;overflow:visible}
.market-footer .footer-column a{max-width:100%;overflow-wrap:anywhere}
.market-footer .footer-bottom{flex-wrap:wrap}
.header #market-navigation{display:flex;flex:1;align-items:center;justify-content:center;gap:8px 18px;min-width:0;flex-wrap:wrap;order:initial;width:auto;overflow:visible;padding:0}
#market-navigation a{white-space:nowrap;padding:8px 0}
.header .header-actions{display:flex;align-items:center;gap:16px;margin-left:auto;min-width:0}
.header .nav-toggle{display:none;align-items:center;gap:8px;min-height:44px;padding:8px 12px;border:1px solid var(--hb-border);border-radius:8px;background:var(--hb-surface);color:var(--hb-text);cursor:pointer}
.account-menu{position:relative;min-width:0}.account-menu>summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;padding:4px;border-radius:8px;color:var(--hb-text);max-width:270px}.account-menu>summary::-webkit-details-marker{display:none}.account-menu>summary:hover{background:var(--hb-page)}.account-avatar{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border-radius:50%;background:var(--hb-soft);color:var(--hb-link);font-weight:700;font-size:15px}.account-label{display:block;min-width:0;font-size:13px;line-height:1.5}.account-label strong{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.account-label small{display:block;color:var(--hb-muted);font-size:11px}.account-chevron{width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 5px 4px}.account-popover{position:absolute;right:0;top:calc(100% + 10px);z-index:55;width:260px;background:white;border:1px solid var(--hb-border);border-radius:12px;padding:12px;box-shadow:0 12px 32px rgb(32 39 56 / 14%);max-width:calc(100vw - 32px);max-height:70vh;overflow:auto}.account-popover>a{display:flex;gap:10px;align-items:center;padding:10px 12px;font-size:14px;border-radius:7px;min-height:44px}.account-popover>a:hover{background:var(--hb-soft);color:var(--hb-link)}.account-caption{font-size:11px;color:var(--hb-muted);margin:8px 12px 12px}.account-popover form{border-top:1px solid var(--hb-border);margin-top:8px;padding-top:8px}.account-logout{display:block;width:100%;border:0;background:white;text-align:left;padding:12px;font:600 14px var(--hb-font);cursor:pointer;border-radius:7px;color:var(--hb-text)}.account-logout:hover{background:var(--hb-page)}.account-popover .counter{margin-left:auto}
.header .account-label{display:block;min-width:0;line-height:1.4}
.header .account-label strong,.header .account-label small{display:block}
.header .account-avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--hb-soft);flex-shrink:0}
main,.panel,.job-card,.cards>*,.service-grid>*,.hb-hero>*,.hb-story>*{min-width:0}
img{max-width:100%}
input,select,textarea{min-width:0;max-width:100%}
.panel,.job-card,.message-bubble{overflow-wrap:anywhere}
/* Desktop alignment only: retain the existing mobile/tablet composition. */
@media(min-width:901px){
 header.header,.landing-page header.header{display:grid;grid-template-columns:auto minmax(0,1fr) auto}
 .header #market-navigation{grid-column:2;grid-row:1;flex-wrap:nowrap}
 .header .header-actions{grid-column:3;grid-row:1}
 .market-footer .footer-top{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr))}
 body:not(.landing-page) footer.market-footer{padding-inline:max(var(--layout-gutter),calc((100% - var(--layout-max))/2 + var(--layout-gutter)))}
 body:not(.landing-page) .market-footer .footer-top,body:not(.landing-page) .market-footer .footer-bottom{max-width:calc(var(--layout-max) - 2 * var(--layout-gutter))}
 body:not(.landing-page) header.header,body:not(.landing-page) main{max-width:var(--layout-max);padding-inline:var(--layout-gutter);margin-inline:auto}
 body:not(.landing-page) header.header{padding-block:var(--layout-space-3);column-gap:var(--layout-space-2)}
 main>.workspace-page{max-width:none;margin-inline:0}
 body:not(.landing-page) main>section{padding-block:var(--layout-space-4)}
 .section-heading{align-items:center;gap:var(--layout-space-3);margin-bottom:var(--layout-space-3)}
 .section-heading>div{min-width:0}
 .section-heading h1,.section-heading h2{margin-block:0}
 .section-heading>div>p{margin:var(--layout-space-1) 0 0}
 .section-heading>.button{flex-shrink:0;align-self:center}
 .workspace-page>.text-link{display:inline-block;margin-bottom:var(--layout-space-2)}
 .workspace-page>.panel{margin-top:0}
 .panel,.job-card{padding:var(--layout-space-4)}
 .button{padding:12px var(--layout-space-3);gap:var(--layout-space-1)}
 input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea{padding:12px var(--layout-space-2)}
 .header .brand,.header .header-actions,.header .notification-menu>summary,.header .account-menu>summary{display:flex;align-items:center}
 .header .notification-menu>summary,.header .account-menu>summary{min-height:44px;gap:var(--layout-space-1);padding-block:4px}
 .header #market-navigation{column-gap:var(--layout-space-1)}
 #market-navigation a{display:inline-flex;align-items:baseline;gap:var(--layout-space-1)}
 #market-navigation .counter{align-self:center}
 .panel:has(>.message-list)>.section-heading{margin:0 0 var(--layout-space-2);gap:var(--layout-space-2);flex-wrap:wrap}
 .panel:has(>.message-list)>.section-heading>p{margin:0}
 .message-list{padding:0;gap:var(--layout-space-2);}
 .message-bubble{width:auto;max-width:85%;padding:var(--layout-space-2)}
 .message-bubble>strong,.message-bubble>time,.message-bubble>p{margin-left:0;padding-left:0}
 .message-bubble>p{margin-block:var(--layout-space-1) 0}
 .message-compose{margin-top:var(--layout-space-3);padding-top:var(--layout-space-3)}
}
@media(min-width:901px) and (max-width:1400px){
 header.header,.landing-page header.header{grid-template-columns:auto minmax(0,1fr) auto}
 .header #market-navigation{grid-column:2;grid-row:1;order:initial;flex-basis:auto;justify-content:center;flex-wrap:wrap}
 .header .header-actions{grid-column:3;grid-row:1}
 header.header-guest,.landing-page header.header-guest{grid-template-columns:auto minmax(0,1fr) auto}
 .header-guest #market-navigation{grid-column:2;grid-row:1;order:initial;flex-basis:auto;justify-content:center;flex-wrap:nowrap}
 .header-guest .header-actions{grid-column:3;grid-row:1}
}
@media(max-width:900px){
 header.header,.landing-page header.header{padding:16px 5%;gap:12px}
 .header .nav-toggle{display:inline-flex;margin-left:auto}
 .header #market-navigation{order:4;flex-basis:100%;justify-content:flex-start;gap:4px 20px}
 .header.nav-ready #market-navigation{display:none}
 .header.nav-open #market-navigation{display:flex}
 .header .header-actions{flex-basis:100%;justify-content:flex-end;margin-left:0;flex-wrap:wrap}
 .service-grid,.service-columns,.profile-layout{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:550px){
 .header .brand{font-size:22px;letter-spacing:-1px}
 .header .header-actions{gap:12px;justify-content:space-between}
 .account-menu>summary{max-width:210px}
 .header .account-popover{position:absolute;right:0;width:260px;max-width:calc(100vw - 32px)}
 .header .notification-popover{position:fixed;top:145px;left:16px;right:16px;width:auto;max-width:calc(100vw - 32px)}
 .service-filters{grid-template-columns:minmax(0,1fr)}
 .hb-visual{min-width:0;max-width:100%}
 .hb-float{max-width:calc(100% - 12px)}
 .hb-hero h1{font-size:clamp(36px,10vw,46px)}
 .footer-top{min-width:0}.footer-column{min-width:0}.footer-column a{overflow-wrap:anywhere}
}