/* Module 3A. Loaded only by the professional directory and public profile. */
.seo-directory-mobile{display:none}
@media(max-width:1023px){
  .seo-directory-desktop{display:none}
  .seo-directory-mobile{display:block}
  .professional-directory.opp-page{padding:0 0 calc(var(--mobile-bottom-space, 72px) + 24px)!important;max-width:100vw!important;width:100%!important;overflow-x:clip!important;box-sizing:border-box!important}
  .professional-directory .opp-hero{display:flex!important;flex-direction:column!important;padding:14px 16px 6px!important;margin:0!important;gap:6px!important}
  .professional-directory .opp-hero .eyebrow{font-size:11px!important;font-weight:800!important;letter-spacing:0.08em!important;color:var(--green,#167253)!important;text-transform:uppercase!important;display:block!important;margin-bottom:2px!important}
  .professional-directory .opp-hero h1{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif!important;font-size:21px!important;line-height:1.25!important;letter-spacing:-0.4px!important;margin:0 0 4px!important;color:#0f172a!important;font-weight:800!important}
  .professional-directory .opp-hero p{font-size:13px!important;line-height:1.4!important;color:#64748b!important;margin:0!important}
  .professional-directory .opp-layout{display:block!important;padding:0!important}
  .directory-mobile-toolbar{display:flex!important;align-items:center!important;gap:10px!important;padding:12px 16px!important;background:#ffffff!important;border-bottom:1px solid #f1f5f9!important;position:sticky!important;top:var(--mobile-header-height,calc(64px + env(safe-area-inset-top,0px)))!important;z-index:15!important;width:100%!important;box-sizing:border-box!important;margin:0!important}
  .directory-mobile-toolbar .opp-filter-group{margin:0!important;flex:1!important;min-width:0!important}
  .directory-mobile-toolbar label{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%)!important}
  .directory-mobile-toolbar .opp-filter-field{position:relative!important;display:flex!important;align-items:center!important;height:44px!important;min-height:44px!important;border-radius:12px!important;border:1px solid #e2e8f0!important;background:#f8fafc!important;padding:0 12px 0 40px!important;box-shadow:none!important;box-sizing:border-box!important;width:100%!important;transition:border-color .15s,background-color .15s!important}
  .directory-mobile-toolbar .opp-filter-field:focus-within{background:#ffffff!important;border-color:var(--green,#167253)!important;box-shadow:0 0 0 3px rgba(22,114,83,0.12)!important}
  .directory-mobile-toolbar .opp-filter-field>svg,.directory-mobile-toolbar .opp-filter-field>[data-lucide],.directory-mobile-toolbar .opp-filter-field>i{display:none!important}
  .directory-mobile-toolbar input[type=search]{width:100%!important;height:100%!important;font-size:14px!important;color:#0f172a!important;background:transparent!important;border:none!important;outline:none!important;padding:0!important;-webkit-appearance:none!important}
  .directory-mobile-search-submit{position:absolute!important;left:4px!important;top:50%!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;min-height:34px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:transparent!important;border:none!important;padding:0!important;margin:0!important;color:#94a3b8!important;cursor:pointer!important;box-shadow:none!important;z-index:2!important}
  .directory-mobile-search-submit svg{width:18px!important;height:18px!important;color:#94a3b8!important}
  .directory-mobile-filter-button{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;height:44px!important;min-height:44px!important;min-width:44px!important;padding:0 14px!important;border-radius:12px!important;border:1px solid #e2e8f0!important;background:#ffffff!important;color:#1e293b!important;font-size:13.5px!important;font-weight:600!important;cursor:pointer!important;white-space:nowrap!important;box-shadow:0 1px 2px rgba(0,0,0,0.05)!important;transition:background .15s,border-color .15s!important;flex-shrink:0!important;box-sizing:border-box!important;position:static!important}
  .directory-mobile-filter-button:active{background:#f1f5f9!important}
  .directory-mobile-filter-button svg{width:18px!important;height:18px!important;color:#475569!important;flex-shrink:0!important}
  .directory-mobile-filter-button span{display:inline-block!important}
  .directory-mobile-filter-count{background:var(--green,#167253)!important;color:#ffffff!important;font-size:11px!important;font-weight:700!important;padding:1px 6px!important;border-radius:9999px!important;min-width:18px!important;height:18px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;position:static!important;border:none!important}
  .directory-mobile-summary{display:none!important}
  .directory-mobile-filters{inset:auto 0 0!important;margin:0!important;width:100%;max-width:100%;max-height:calc(100dvh - 20px);padding:0;border:0;border-top:1px solid #e0e5de;border-radius:24px 24px 0 0!important;background:#ffffff!important;box-shadow:0 -10px 40px rgba(0,0,0,0.18)!important;box-sizing:border-box;overflow:auto;overscroll-behavior:contain}
  .directory-mobile-filters::backdrop{background:rgba(15,23,42,0.55);backdrop-filter:blur(4px)}
  .directory-mobile-filters[open]{animation:professionals-sheet-in .22s ease-out}
  .directory-mobile-filters .opp-filters-card{display:block!important;position:static!important;padding:20px 20px max(24px,env(safe-area-inset-bottom));margin:0;border:0;border-radius:0;background:transparent;box-shadow:none}
  .directory-mobile-filters .opp-filters-header{position:relative;display:flex;align-items:center;gap:12px;margin-bottom:20px}
  .directory-mobile-filters .opp-filters-title{font:700 22px/1.3 'DM Sans',sans-serif;margin-right:auto}
  .directory-mobile-filters .opp-filter-reset{display:inline-flex;min-height:44px;align-items:center;padding:0;border:0;font-size:13px;box-shadow:none}
  .directory-mobile-filters-close{width:44px;height:44px;padding:0;background:transparent;color:var(--green);font-size:26px;box-shadow:none}
  .directory-mobile-filters #directory-filters{gap:18px}
  .directory-mobile-filters .opp-filter-group label{font-size:13px;margin-bottom:7px}
  .directory-mobile-filters .opp-filter-field{height:48px;padding:0 12px;border:1px solid #e0e5de;border-radius:12px;background:#fff}
  .directory-mobile-filters .custom-select-text{font-size:14px!important;white-space:normal;line-height:1.3}
  .directory-mobile-filters .custom-select-trigger{min-height:46px!important}
  .directory-mobile-filters .custom-select-panel{min-width:0;max-width:100%;z-index:5}
  .directory-mobile-filters .custom-select-item{min-height:44px;padding:10px!important;box-sizing:border-box;font-size:14px!important}
  .directory-mobile-filters .directory-search-button{min-height:48px;position:sticky;bottom:0;margin-top:4px;box-shadow:none}
  .professional-directory .opp-feed-header{padding:10px 16px 6px!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important}
  .professional-directory .opp-feed-count{font-size:13px!important;font-weight:600!important;color:#64748b!important}
  .professional-directory .opp-cards-grid{display:flex!important;flex-direction:column!important;gap:0!important;padding:0 0 24px!important;width:100%!important}
  .professional-directory .directory-profile-card.opp-card,
  .directory-profile-card.opp-card{display:flex!important;flex-direction:column!important;gap:10px!important;width:100%!important;max-width:100%!important;border-radius:0!important;border-left:none!important;border-right:none!important;border-top:none!important;border-bottom:1px solid #eef2f6!important;background:#ffffff!important;padding:16px!important;margin:0!important;box-shadow:none!important;box-sizing:border-box!important;min-height:0!important;transform:none!important}
  .professional-directory .directory-profile-card:first-child{padding-top:16px!important}
  .professional-directory .directory-profile-top,
  .directory-profile-top,
  .professional-directory .directory-profile-top:has(.directory-profile-badges){display:flex!important;flex-direction:row!important;align-items:flex-start!important;gap:14px!important;width:100%!important;margin:0!important}
  .professional-directory .directory-profile-media,
  .directory-profile-media,
  .professional-directory .directory-profile-top:has(.directory-profile-badges) .directory-profile-media{display:block!important;float:none!important;margin:0!important;width:76px!important;height:76px!important;min-width:76px!important;min-height:76px!important;border-radius:14px!important;overflow:hidden!important;flex-shrink:0!important;background:#edf4e6!important}
  .professional-directory .directory-profile-media img,
  .directory-profile-media img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 30%!important;border-radius:14px!important;display:block!important}
  .professional-directory .directory-profile-identity,
  .directory-profile-identity,
  .professional-directory .directory-profile-top:has(.directory-profile-badges) .directory-profile-identity{display:flex!important;flex-direction:column!important;gap:4px!important;flex:1!important;min-width:0!important;margin:0!important}
  .professional-directory .directory-profile-identity h2,
  .directory-profile-identity h2{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif!important;font-size:16.5px!important;font-weight:700!important;line-height:1.3!important;color:#0f172a!important;margin:0!important}
  .professional-directory .directory-profile-identity h2 a,
  .directory-profile-identity h2 a{color:inherit!important;text-decoration:none!important}
  .professional-directory .directory-profile-byline,
  .directory-profile-byline{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:4px!important;margin:0!important}
  .professional-directory .directory-profile-author{font-size:12px!important;font-weight:500!important;overflow-wrap:anywhere!important}
  .professional-directory .directory-author-repeated{display:none!important}
  .professional-directory .directory-profile-verified,
  .directory-profile-verified{display:inline-flex!important;align-items:center!important;gap:4px!important;color:var(--green,#167253)!important;font-size:12px!important;font-weight:600!important;line-height:1!important}
  .professional-directory .directory-profile-verified svg,
  .directory-profile-verified svg{width:15px!important;height:15px!important;color:var(--green,#167253)!important;flex-shrink:0!important}
  .professional-directory .directory-profile-rating,
  .directory-profile-rating{display:flex!important;align-items:center!important;gap:5px!important;font-size:13px!important;font-weight:700!important;color:#0f172a!important;margin:0!important;line-height:1.2!important}
  .professional-directory .directory-profile-rating svg,
  .directory-profile-rating svg{width:14px!important;height:14px!important;fill:#f59e0b!important;stroke:#f59e0b!important;color:#f59e0b!important;flex-shrink:0!important}
  .professional-directory .directory-profile-rating span,
  .directory-profile-rating span{font-size:12px!important;font-weight:400!important;color:#64748b!important}
  .professional-directory .directory-profile-location,
  .directory-profile-location{display:flex!important;align-items:flex-start!important;gap:6px!important;font-size:12.5px!important;color:#475569!important;margin:2px 0 0!important;line-height:1.4!important}
  .professional-directory .directory-profile-location svg,
  .directory-profile-location svg{width:14px!important;height:14px!important;color:#94a3b8!important;margin-top:2px!important;flex-shrink:0!important}
  .professional-directory .directory-profile-service,
  .directory-profile-service{display:flex!important;align-items:center!important;gap:6px!important;font-size:13px!important;color:#065f46!important;font-weight:600!important;margin:0!important}
  .professional-directory .directory-profile-service svg,
  .directory-profile-service svg{width:14px!important;height:14px!important;color:#10b981!important;flex-shrink:0!important}
  .professional-directory .directory-profile-badges{display:flex!important;flex-wrap:wrap!important;gap:4px!important;margin:2px 0 0!important}
  .professional-directory .directory-profile-badge{font-size:11px!important;margin-bottom:0!important}
  .professional-directory .directory-profile-bio,
  .directory-profile-bio{font-size:13px!important;line-height:1.45!important;color:#475569!important;margin:2px 0 0!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .professional-directory .directory-profile-bottom,
  .directory-profile-bottom{display:flex!important;align-items:center!important;margin-top:4px!important;padding:0!important;width:100%!important}
  .professional-directory .directory-profile-bottom a.button,
  .directory-profile-bottom a.button{width:100%!important;min-height:44px!important;height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:13.5px!important;font-weight:700!important;border-radius:10px!important;background:transparent!important;border:1px solid var(--green,#167253)!important;color:var(--green,#167253)!important;text-decoration:none!important;box-sizing:border-box!important;transition:all .15s ease!important}
  .professional-directory .directory-profile-bottom a.button:active,
  .directory-profile-bottom a.button:active{background:#eef7f3!important}
  .professional-directory .directory-pagination{flex-wrap:wrap;width:auto;background:transparent;gap:4px}
  .professional-directory .directory-pagination a,.professional-directory .directory-pagination>span{min-width:44px;min-height:44px;box-sizing:border-box;border-radius:10px}
  .professional-directory .directory-empty{padding:24px 0;background:transparent;border:0;box-shadow:none}
  .professional-directory .directory-empty h2{font-size:23px;line-height:1.3}
  .professional-directory .directory-empty a{display:inline-flex;align-items:center;min-height:44px;font-size:14px}

  .detail-page:has(#professional-page){padding:24px 20px 32px;max-width:100%;box-sizing:border-box}
  #professional-page{gap:28px;min-width:0}
  #professional-page .profile-hero{grid-template-columns:1fr;gap:20px}
  #professional-page .profile-identity{grid-template-columns:108px minmax(0,1fr);gap:8px 16px;align-items:start}
  #professional-page .profile-identity>div{display:contents}
  #professional-page .profile-avatar{grid-column:1;grid-row:1/5;width:108px;height:100%;min-height:152px;max-height:220px;border-radius:16px;object-position:center 35%}
  #professional-page .profile-avatar[src*="profile-avatar.svg"]{height:108px;min-height:0;object-fit:contain;align-self:start;border-radius:50%;aspect-ratio:1}
  #professional-page.profile-long-name .profile-avatar{grid-row:1/4;height:132px;min-height:0}
  #professional-page.profile-long-name .profile-avatar[src*="profile-avatar.svg"]{height:auto;aspect-ratio:1}
  #professional-page.profile-long-name .profile-identity h1{grid-column:1/-1;grid-row:4;font-size:25px}
  #professional-page.profile-long-name .profile-rating{grid-row:1}
  #professional-page.profile-long-name .profile-identity .eyebrow{grid-row:2}
  #professional-page.profile-long-name .identity-verified-badge{grid-row:3}
  #professional-page .profile-identity h1{grid-column:2;grid-row:1;font:700 27px/1.15 'DM Sans',sans-serif;letter-spacing:-.7px;margin:0;overflow-wrap:anywhere}
  #professional-page .profile-rating{grid-column:2;grid-row:2;font-size:14px;flex-wrap:wrap;gap:4px}
  #professional-page .profile-rating span:not(.profile-rating-star){font-size:12px}
  #professional-page .profile-identity .eyebrow{grid-column:2;grid-row:3;margin:0;font:500 12px/1.5 'DM Sans',sans-serif;letter-spacing:0;text-transform:none;color:var(--muted);overflow-wrap:anywhere}
  #professional-page .identity-verified-badge{grid-column:2;grid-row:4;justify-self:start;font-size:11px;padding:5px 7px;white-space:normal;line-height:1.4;margin:0}
  #professional-page .profile-bio{grid-column:1/-1;grid-row:6;max-width:none;margin:4px 0 0;font-size:14px;line-height:1.7;overflow-wrap:anywhere}
  #professional-page .profile-bio.is-collapsed{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  #professional-page .profile-bio-toggle{grid-column:1/-1;grid-row:7;justify-self:start;min-height:44px;padding:10px 0;background:transparent;color:var(--green);font-size:13px;box-shadow:none}
  #professional-page .profile-tags{grid-column:1/-1;grid-row:5;gap:6px;margin-top:8px}
  #professional-page .profile-tags span{font-size:12px;padding:7px 10px;line-height:1.4}
  #professional-page .profile-sidebar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  #professional-page .profile-actions{display:contents}
  #professional-page .profile-actions>button{min-height:44px;padding:10px 4px;font-size:12px;box-shadow:none!important;background:transparent;color:var(--green);transform:none!important;gap:5px}
  #professional-page .profile-actions>button:not(.profile-favorite-btn):not(.profile-report){grid-column:1/-1;order:0;min-height:48px;border-radius:12px;background:var(--green);color:#fff;font-size:15px}
  #professional-page .profile-favorite-btn{order:1}
  #professional-page .profile-share-trigger{order:2;min-height:44px;padding:10px 4px;font-size:12px;color:var(--green)}
  #professional-page .profile-report{order:3}
  #professional-page .profile-actions>p{grid-column:1/-1;order:4;margin:0;font-size:12px;line-height:1.5}
  #professional-page .profile-cover-actions-group{grid-column:1/-1;order:5}
  #professional-page .profile-cover-action-btn{min-height:44px;box-shadow:none!important}
  #professional-page .profile-trust{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;padding:12px 0;border-top:1px solid #dfe5dc;border-bottom:1px solid #dfe5dc}
  #professional-page .profile-trust span{font-size:12px;line-height:1.5;text-align:left}
  #professional-page .profile-trust span:first-child,#professional-page:has(.identity-verified-badge) .profile-trust span:nth-child(2){display:none}
  #professional-page .profile-section{gap:12px;min-width:0;scroll-margin-top:80px}
  #professional-page .profile-section-title{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
  #professional-page .profile-section-title h2{font:700 23px/1.25 'DM Sans',sans-serif;letter-spacing:-.5px}
  #professional-page .profile-section-title p{font-size:13px;line-height:1.5;margin:4px 0 0;overflow-wrap:anywhere}
  #professional-page .profile-section-link{min-height:44px;box-sizing:border-box;padding:10px 0;font-size:13px;white-space:normal;line-height:1.4;transform:none!important}
  #professional-page .profile-services{grid-template-columns:1fr;gap:0}
  #professional-page .profile-service-card{grid-template-columns:36px minmax(0,1fr);gap:12px;padding:16px 0;min-height:0;border-radius:0;border-bottom:1px solid #dfe5dc;background:transparent;box-shadow:none;transform:none}
  #professional-page .profile-service-icon{width:36px;height:36px;border-radius:0;background:transparent;box-shadow:none;color:var(--green)}
  #professional-page .profile-service-card h3{font-size:15px;line-height:1.4;margin:0 0 5px;overflow-wrap:anywhere}
  #professional-page .profile-service-card p{font-size:13px;line-height:1.6;overflow-wrap:anywhere}
  #professional-page .profile-portfolio{display:flex;overflow-x:auto;gap:16px;padding:0 0 10px;scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:thin}
  #professional-page .profile-portfolio-card{flex:0 0 82%;scroll-snap-align:start;min-width:0;border-radius:0;background:transparent;box-shadow:none;transform:none;user-select:auto}
  #professional-page .profile-portfolio-card>.profile-media{height:180px;border-radius:14px;object-fit:cover}
  #professional-page .profile-portfolio-card>div{padding:12px 0 0;gap:6px}
  #professional-page .profile-portfolio-card h3{font-size:15px;line-height:1.4;margin:0;overflow-wrap:anywhere}
  #professional-page .profile-portfolio-card p{font-size:13px;line-height:1.6;overflow-wrap:anywhere}
  #professional-page .profile-empty{width:100%;box-sizing:border-box;padding:20px 0;min-height:0;border-radius:0;background:transparent;box-shadow:none}
  #professional-page .profile-empty>span{background:transparent;box-shadow:none}
  #professional-page .profile-empty h3{font-size:15px;line-height:1.4}
  #professional-page .profile-empty p{font-size:13px;line-height:1.6}
  #professional-page .opinion-summary{display:grid;grid-template-columns:88px minmax(0,1fr);gap:18px;margin:12px 0 24px;align-items:center}
  #professional-page .opinion-average{min-width:0}
  #professional-page .opinion-average>div{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
  #professional-page .opinion-average strong{font-size:34px}
  #professional-page .opinion-average .opinion-stars{font-size:16px}
  #professional-page .opinion-average p{font-size:12px}
  #professional-page .opinion-distribution{width:auto;max-width:none;border:0;padding:0}
  #professional-page .opinion-distribution-row{grid-template-columns:24px minmax(0,1fr) 32px;gap:6px}
  #professional-page .profile-opinion{border-bottom:1px solid #dfe5dc;padding-bottom:20px;margin-bottom:20px}
  #professional-page .opinion-head{display:grid;grid-template-columns:36px minmax(0,1fr);gap:4px 10px}
  #professional-page .opinion-avatar{width:36px;height:36px;font-size:13px;grid-row:1/3}
  #professional-page .opinion-identity h3{font-size:14px;overflow-wrap:anywhere}
  #professional-page .opinion-meta{gap:6px}
  #professional-page .opinion-verified{font-size:11px}
  #professional-page .opinion-head time{grid-column:2;width:auto;margin:0;font-size:11px;padding:0}
  #professional-page .profile-opinion>p{font-size:14px;line-height:1.7}
  #professional-page .profile-contact{grid-template-columns:1fr;background:transparent;border-top:1px solid #dfe5dc;padding:24px 0;border-radius:0;gap:12px}
  #professional-page .profile-contact>span{display:none}
  #professional-page .profile-contact h2{font:700 23px/1.3 'DM Sans',sans-serif;letter-spacing:-.5px;overflow-wrap:anywhere}
  #professional-page .profile-contact p:not(.eyebrow){font-size:13px;line-height:1.6;margin:6px 0 0}
  #professional-page .profile-contact button{min-height:48px;font-size:15px;grid-column:1}
  #professional-page .profile-modal,
  #professional-page .profile-share-modal,
  dialog#portfolio-preview-modal,
  #portfolio-preview-modal.dashboard-modal.portfolio-preview-modal-custom,
  .portfolio-preview-modal-custom,
  .request-image-lightbox {
    position: fixed !important;
    inset: auto 0 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100dvh - 20px) !important;
    border: 0 !important;
    border-top: 1px solid #e0e5de !important;
    border-radius: 24px 24px 0 0 !important;
    background: #ffffff !important;
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.18) !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }
  #professional-page :is(.profile-modal, .profile-share-modal, .portfolio-preview-modal-custom)::backdrop,
  dialog#portfolio-preview-modal::backdrop,
  .portfolio-preview-modal-custom::backdrop,
  .request-image-lightbox::backdrop {
    background: rgba(15, 23, 42, 0.55) !important;
    backdrop-filter: blur(4px);
  }
  .directory-mobile-filters[open],
  .request-image-lightbox[open],
  dialog#portfolio-preview-modal[open],
  .portfolio-preview-modal-custom[open],
  #professional-page :is(.profile-modal, .profile-share-modal, .portfolio-preview-modal-custom)[open] {
    animation: professionals-sheet-in 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
  }
  #professional-page .profile-modal,
  #professional-page .profile-share-modal {
    padding: 20px 20px max(24px, env(safe-area-inset-bottom)) !important;
  }
  #professional-page .profile-share-modal {
    padding: 0 !important;
  }
  #professional-page .profile-share {
    padding: 24px 20px max(24px, env(safe-area-inset-bottom));
  }
  #professional-page .profile-share-close,
  #professional-page .profile-modal-close {
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f1f5f9;
    color: var(--ink);
    border: 0;
  }
  #professional-page .profile-share-networks a,
  #professional-page .profile-share-copy {
    min-height: 44px;
    box-sizing: border-box;
  }
  #professional-page .profile-modal-header h2 {
    font: 700 22px/1.3 'DM Sans', sans-serif;
    letter-spacing: -0.4px;
  }
  #professional-page .profile-modal-header p {
    font-size: 13px;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
  #professional-page .profile-modal-content {
    grid-template-columns: 1fr;
    grid-auto-rows: max-content;
    overscroll-behavior: contain;
    min-height: 0;
  }
  #professional-page .profile-modal-content .profile-service-card,
  #professional-page .profile-modal-content .profile-portfolio-card {
    width: 100%;
    flex-basis: auto;
  }
  #professional-page .profile-modal-pagination {
    gap: 6px !important;
    flex-wrap: wrap;
  }
  #professional-page .profile-modal-pagination button {
    min-height: 44px;
    padding: 10px;
    font-size: 12px;
  }

  /* Portfolio preview modal bottom sheet */
  dialog#portfolio-preview-modal,
  #portfolio-preview-modal.dashboard-modal.portfolio-preview-modal-custom,
  .portfolio-preview-modal-custom {
    padding: 0 !important;
    height: auto !important;
  }
  #portfolio-preview-modal .portfolio-preview-container {
    position: relative;
    padding: 20px 20px max(24px, env(safe-area-inset-bottom)) !important;
    max-height: none !important;
    overflow: visible !important;
  }
  #portfolio-preview-modal .portfolio-preview-close {
    position: absolute;
    top: 16px;
    right: 16px;
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #f1f5f9;
    color: var(--ink);
    font-size: 24px;
    z-index: 20;
    display: grid;
    place-items: center;
    border: 0;
    cursor: pointer;
  }
  #portfolio-preview-modal .portfolio-preview-grid {
    display: grid;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-top: 14px;
    min-width: 0;
  }
  #portfolio-preview-modal .portfolio-preview-media {
    gap: 12px;
  }
  #portfolio-preview-modal .portfolio-preview-main-img-wrap {
    width: 100%;
    height: 230px;
    border-radius: 16px;
    overflow: hidden;
    background: #f1f5f9;
  }
  #portfolio-preview-modal .portfolio-preview-main-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  #portfolio-preview-modal .portfolio-preview-thumbs-row {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 4px 2px;
    scrollbar-width: thin;
  }
  #portfolio-preview-modal .portfolio-preview-thumb {
    min-width: 60px;
    min-height: 44px;
    width: 70px;
    height: 50px;
    border-radius: 8px;
    overflow: hidden;
    padding: 0;
    border: 2px solid transparent !important;
  }
  #portfolio-preview-modal .portfolio-preview-thumb.active {
    border-color: var(--green, #047857) !important;
  }
  #portfolio-preview-modal .portfolio-preview-badge {
    margin-bottom: 8px;
    align-self: flex-start;
  }
  #portfolio-preview-modal .portfolio-preview-title {
    font-size: 22px !important;
    line-height: 1.25 !important;
    margin: 0 0 10px 0 !important;
    overflow-wrap: anywhere;
  }
  #portfolio-preview-modal .portfolio-preview-body-desc {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin: 0 0 20px 0 !important;
    overflow-wrap: anywhere;
  }
  #portfolio-preview-modal .portfolio-preview-details-box {
    border-top: 1px solid #f1f5f9;
    padding-top: 16px;
  }
  #portfolio-preview-modal .portfolio-preview-dl-row {
    grid-template-columns: 110px 1fr !important;
    gap: 10px !important;
    font-size: 13px !important;
  }

  /* Lightbox / image viewer bottom sheet */
  .request-image-lightbox {
    height: calc(100dvh - 20px) !important;
    padding: 16px 16px max(16px, env(safe-area-inset-bottom)) !important;
    color: var(--ink, #172b21) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .request-image-lightbox .request-image-toolbar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    height: 44px;
    color: var(--ink, #172b21);
    margin-bottom: 8px;
    flex-shrink: 0;
  }
  .request-image-lightbox .request-image-toolbar span {
    font-size: 14px;
    font-weight: 600;
    color: var(--ink, #172b21);
  }
  .request-image-lightbox .request-image-zoom {
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .request-image-lightbox .request-image-zoom button {
    min-width: 44px;
    min-height: 44px;
    border: 1px solid #e0e5de !important;
    border-radius: 12px;
    background: #f8fafc !important;
    color: var(--ink, #172b21) !important;
    display: grid;
    place-items: center;
    padding: 0;
  }
  .request-image-lightbox .request-image-zoom button:hover:not(:disabled) {
    background: #e2e8f0 !important;
  }
  .request-image-lightbox .request-image-zoom button[data-lightbox-reset] {
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
  }
  .request-image-lightbox .request-image-close {
    position: absolute;
    right: 0;
    top: 0;
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #f8fafc !important;
    color: var(--ink, #172b21) !important;
    border: 1px solid #e0e5de !important;
    display: grid;
    place-items: center;
    padding: 0;
  }
  .request-image-lightbox .request-image-stage {
    position: relative;
    flex: 1 1 auto;
    height: auto;
    min-height: 200px;
    padding: 8px 48px;
    background: #f8fafc;
    border-radius: 16px;
    border: 1px solid #eef2eb;
    margin: 4px 0 10px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .request-image-lightbox .request-image-stage > img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  }
  .request-image-lightbox .request-image-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: var(--ink, #172b21) !important;
    border: 1px solid #dce3da !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    display: grid;
    place-items: center;
    z-index: 5;
    padding: 0;
  }
  .request-image-lightbox .request-image-nav.previous { left: 8px; }
  .request-image-lightbox .request-image-nav.next { right: 8px; }
  .request-image-lightbox .request-image-thumbnails {
    display: flex;
    gap: 8px;
    justify-content: center;
    overflow-x: auto;
    padding: 4px 0 max(4px, env(safe-area-inset-bottom));
    flex-shrink: 0;
  }
  .request-image-lightbox .request-image-thumbnail {
    flex: 0 0 auto;
    min-width: 44px;
    min-height: 44px;
    width: 64px;
    height: 52px;
    border-radius: 8px;
    border: 2px solid transparent !important;
    overflow: hidden;
    opacity: 0.7;
    background: transparent;
    padding: 0;
  }
  .request-image-lightbox .request-image-thumbnail.is-active {
    border-color: var(--green, #047857) !important;
    opacity: 1;
  }
  .request-image-lightbox .request-image-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 6px;
  }

  body:has(#professional-page) .request-image-lightbox button { min-width: 44px; min-height: 44px; }
  body:has(#professional-page) #input-modal button { min-height: 44px; }

  @keyframes professionals-sheet-in {
    from {
      transform: translateY(100%);
      opacity: 0.95;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  }

  @media(max-width:360px) {
    .detail-page:has(#professional-page) {
      padding-left: 16px;
      padding-right: 16px;
    }
    .professional-directory .directory-profile-media,
    .directory-profile-media {
      width: 68px !important;
      height: 68px !important;
      min-width: 68px !important;
      min-height: 68px !important;
    }
    .professional-directory .directory-profile-identity h2,
    .directory-profile-identity h2 { font-size: 15.5px !important; }
    #professional-page .profile-identity { grid-template-columns: 88px minmax(0, 1fr); gap: 8px 12px; }
    #professional-page .profile-avatar { width: 88px; }
    #professional-page .profile-identity h1 { font-size: 24px; }
  }

  @media(prefers-reduced-motion: reduce) {
    .directory-mobile-filters[open],
    .request-image-lightbox[open],
    dialog#portfolio-preview-modal[open],
    .portfolio-preview-modal-custom[open],
    #professional-page :is(.profile-modal, .profile-share-modal, .portfolio-preview-modal-custom)[open] {
      animation: none !important;
    }
  }
}