/* AboutMe 1.1 structural layout library — thirty distinct profile arrangements. */
.bio-shell{display:flex;flex-direction:column}.bio-platform-icon{width:38px;height:38px;flex:0 0 auto}.bio-social-section .bio-social{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin-top:0}.bio-social-section .bio-social a{min-width:0;display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:11px;padding:12px 14px;color:var(--bio-text)}.bio-social-copy{display:grid;min-width:0}.bio-social-copy strong,.bio-social-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bio-social-copy small{color:var(--bio-muted);font-size:.72rem}.bio-social-section .bio-social a>b{font-size:1rem}.bio-social a[data-platform="instagram"] .bio-platform-icon{color:#c13584}.bio-social a[data-platform="youtube"] .bio-platform-icon{color:#e62117}.bio-social a[data-platform="facebook"] .bio-platform-icon,.bio-social a[data-platform="linkedin"] .bio-platform-icon{color:#1769aa}.bio-social a[data-platform="spotify"] .bio-platform-icon{color:#168d45}.bio-social a[data-platform="shopify"] .bio-platform-icon{color:#5e8e3e}.bio-social a[data-platform="amazon"] .bio-platform-icon{color:#b66a00}.bio-ad{order:95}

/* 01 — centered profile: generous conventional portfolio rhythm. */
body.bio-layout-centered-profile .bio-shell{max-width:1060px}body.bio-layout-centered-profile .bio-identity{max-width:820px;margin-inline:auto}body.bio-layout-centered-profile .bio-section:nth-child(odd){margin-left:5%}body.bio-layout-centered-profile .bio-section:nth-child(even){margin-right:5%}

/* 02 — social stack: compact creator link stack with identity always first. */
body.bio-layout-social-stack{background:linear-gradient(150deg,var(--bio-bg),color-mix(in srgb,var(--bio-accent) 10%,var(--bio-bg)))}body.bio-layout-social-stack .bio-shell{max-width:650px}body.bio-layout-social-stack .bio-cover{height:220px}body.bio-layout-social-stack .bio-identity{padding-inline:8px}body.bio-layout-social-stack .bio-section{padding:24px}body.bio-layout-social-stack .bio-section-heading{text-align:center;margin-inline:auto}body.bio-layout-social-stack .bio-link-card{min-height:88px;border-width:2px}body.bio-layout-social-stack .bio-social-section .bio-social{grid-template-columns:1fr}

/* 03 — editorial column: long-form biography and reading-first modules. */
body.bio-layout-editorial-column .bio-shell{max-width:900px}body.bio-layout-editorial-column .bio-identity{text-align:left;padding-inline:0}body.bio-layout-editorial-column .bio-avatar-wrap,body.bio-layout-editorial-column .bio-name-row,body.bio-layout-editorial-column .bio-meta,body.bio-layout-editorial-column .bio-actions{justify-content:flex-start}body.bio-layout-editorial-column .bio-name-row h1{font-family:Georgia,serif;font-weight:500}body.bio-layout-editorial-column .bio-section{padding-inline:8%;border-left:0;border-right:0;box-shadow:none}body.bio-layout-editorial-column .bio-richtext{font-family:Georgia,serif;font-size:1.25rem;line-height:1.85}

/* 04 — stage fullscreen: cover becomes a cinematic first screen. */
body.bio-layout-stage-fullscreen{background:#090a0d}body.bio-layout-stage-fullscreen .bio-shell{width:100%;max-width:none;padding-top:0}body.bio-layout-stage-fullscreen .bio-cover{height:min(78vh,820px);border:0;border-radius:0;box-shadow:none}body.bio-layout-stage-fullscreen .bio-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.82))}body.bio-layout-stage-fullscreen .bio-cover{position:relative}body.bio-layout-stage-fullscreen .bio-identity{width:min(calc(100% - 36px),1100px);margin:-260px auto 100px;padding:0;color:#fff;text-align:left}body.bio-layout-stage-fullscreen .bio-avatar-wrap,body.bio-layout-stage-fullscreen .bio-name-row,body.bio-layout-stage-fullscreen .bio-meta,body.bio-layout-stage-fullscreen .bio-actions{justify-content:flex-start}body.bio-layout-stage-fullscreen .bio-headline{margin-left:0;color:#d3d5d9}body.bio-layout-stage-fullscreen .bio-meta{color:#bec2c8}body.bio-layout-stage-fullscreen .bio-section,body.bio-layout-stage-fullscreen .bio-final{width:min(calc(100% - 36px),1100px);margin-inline:auto}

/* 05 — poster split: identity and cover form a two-panel campaign poster. */
body.bio-layout-poster-split .bio-shell{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:20px;max-width:1320px}body.bio-layout-poster-split .bio-cover{grid-column:2;height:680px;border-radius:2px}body.bio-layout-poster-split .bio-identity{grid-column:1;align-self:center;text-align:left;padding:48px 20px}body.bio-layout-poster-split .bio-avatar-wrap,body.bio-layout-poster-split .bio-name-row,body.bio-layout-poster-split .bio-meta,body.bio-layout-poster-split .bio-actions{justify-content:flex-start}body.bio-layout-poster-split .bio-name-row h1{text-transform:uppercase;font-size:clamp(4rem,8vw,8rem)}body.bio-layout-poster-split .bio-headline{margin-left:0}body.bio-layout-poster-split .bio-section,body.bio-layout-poster-split .bio-final,body.bio-layout-poster-split .bio-ad{grid-column:1/-1}

/* 06 — record sleeve: square artwork beside artist information. */
body.bio-layout-record-sleeve .bio-shell{display:grid;grid-template-columns:minmax(330px,.9fr) minmax(0,1.1fr);gap:26px;max-width:1220px}body.bio-layout-record-sleeve .bio-cover{grid-column:1;aspect-ratio:1;height:auto;border-radius:3px}body.bio-layout-record-sleeve .bio-identity{grid-column:2;align-self:center;text-align:left}body.bio-layout-record-sleeve .bio-avatar-wrap,body.bio-layout-record-sleeve .bio-name-row,body.bio-layout-record-sleeve .bio-meta,body.bio-layout-record-sleeve .bio-actions{justify-content:flex-start}body.bio-layout-record-sleeve .bio-headline{margin-left:0}body.bio-layout-record-sleeve .bio-section,body.bio-layout-record-sleeve .bio-final,body.bio-layout-record-sleeve .bio-ad{grid-column:1/-1}body.bio-layout-record-sleeve .bio-link-list{grid-template-columns:repeat(2,1fr)}

/* 07 — neon terminal: compact monospace panels with command-line rhythm. */
body.bio-layout-neon-terminal .bio-shell{max-width:1120px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}body.bio-layout-neon-terminal .bio-cover,body.bio-layout-neon-terminal .bio-avatar,body.bio-layout-neon-terminal .bio-section,body.bio-layout-neon-terminal .bio-link-card,body.bio-layout-neon-terminal .bio-final{border-radius:2px;box-shadow:none}body.bio-layout-neon-terminal .bio-identity{text-align:left;border:1px solid var(--bio-border);padding:28px;margin-top:16px}body.bio-layout-neon-terminal .bio-avatar-wrap,body.bio-layout-neon-terminal .bio-name-row,body.bio-layout-neon-terminal .bio-meta,body.bio-layout-neon-terminal .bio-actions{justify-content:flex-start}body.bio-layout-neon-terminal .bio-headline{margin-left:0}body.bio-layout-neon-terminal .bio-section-heading>span:before{content:"> ";}body.bio-layout-neon-terminal .bio-section{background:transparent}

/* 08 — bento grid: modules become differently sized dashboard tiles. */
body.bio-layout-bento-grid .bio-shell{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px;max-width:1320px}body.bio-layout-bento-grid .bio-cover,body.bio-layout-bento-grid .bio-identity{grid-column:1/-1}body.bio-layout-bento-grid .bio-section,body.bio-layout-bento-grid .bio-final{grid-column:span 6;margin-top:0}body.bio-layout-bento-grid .bio-about,body.bio-layout-bento-grid .bio-work,body.bio-layout-bento-grid .bio-experience,body.bio-layout-bento-grid .bio-final{grid-column:1/-1}body.bio-layout-bento-grid .bio-section{padding:32px}body.bio-layout-bento-grid .bio-gallery figure{grid-column:span 3}

/* 09 — community board: identity at left with modular community rail. */
body.bio-layout-community-board .bio-shell{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px;max-width:1260px}body.bio-layout-community-board .bio-cover{grid-column:1/-1;height:260px}body.bio-layout-community-board .bio-identity{grid-column:1;position:sticky;top:20px;align-self:start;padding:20px;text-align:left;border:1px solid var(--bio-border);background:var(--bio-surface)}body.bio-layout-community-board .bio-avatar-wrap,body.bio-layout-community-board .bio-name-row,body.bio-layout-community-board .bio-meta,body.bio-layout-community-board .bio-actions{justify-content:flex-start}body.bio-layout-community-board .bio-headline{margin-left:0}body.bio-layout-community-board .bio-section,body.bio-layout-community-board .bio-final,body.bio-layout-community-board .bio-ad{grid-column:2;margin-top:0}

/* 10 — executive split: permanent left identity and right content column. */
body.bio-layout-executive-split .bio-shell{display:grid;grid-template-columns:minmax(330px,.72fr) minmax(0,1.28fr);gap:24px;max-width:1380px}body.bio-layout-executive-split .bio-cover{grid-column:1;height:280px}body.bio-layout-executive-split .bio-identity{grid-column:1;position:sticky;top:22px;align-self:start;text-align:left;padding:18px 10px}body.bio-layout-executive-split .bio-avatar-wrap,body.bio-layout-executive-split .bio-name-row,body.bio-layout-executive-split .bio-meta,body.bio-layout-executive-split .bio-actions{justify-content:flex-start}body.bio-layout-executive-split .bio-headline{margin-left:0}body.bio-layout-executive-split .bio-section,body.bio-layout-executive-split .bio-final,body.bio-layout-executive-split .bio-ad{grid-column:2;margin-top:0}

/* 11 — launch full bleed: wide brand hero with horizontal content bands. */
body.bio-layout-launch-fullbleed .bio-shell{width:100%;max-width:none;padding:0}body.bio-layout-launch-fullbleed .bio-cover{height:70vh;min-height:520px;border:0;border-radius:0}body.bio-layout-launch-fullbleed .bio-identity{width:min(calc(100% - 36px),1240px);margin:-120px auto 40px;padding:42px;background:var(--bio-surface);border:1px solid var(--bio-border);text-align:left;box-shadow:var(--bio-shadow)}body.bio-layout-launch-fullbleed .bio-avatar-wrap,body.bio-layout-launch-fullbleed .bio-name-row,body.bio-layout-launch-fullbleed .bio-meta,body.bio-layout-launch-fullbleed .bio-actions{justify-content:flex-start}body.bio-layout-launch-fullbleed .bio-headline{margin-left:0}body.bio-layout-launch-fullbleed .bio-section,body.bio-layout-launch-fullbleed .bio-final,body.bio-layout-launch-fullbleed .bio-ad{width:min(calc(100% - 36px),1240px);margin-inline:auto}

/* 12 — heritage editorial: centered masthead and framed text spreads. */
body.bio-layout-heritage-editorial .bio-shell{max-width:1100px}body.bio-layout-heritage-editorial .bio-identity{padding-block:44px;border-block:1px solid var(--bio-border)}body.bio-layout-heritage-editorial .bio-name-row h1{font-family:Georgia,serif;font-weight:500}body.bio-layout-heritage-editorial .bio-section{outline:1px solid var(--bio-border);outline-offset:-10px;padding:64px}body.bio-layout-heritage-editorial .bio-about .bio-richtext{columns:2;column-gap:46px;font-family:Georgia,serif}

/* 13 — résumé sidebar: narrow professional facts beside career content. */
body.bio-layout-resume-sidebar .bio-shell{display:grid;grid-template-columns:300px minmax(0,1fr);gap:28px;max-width:1180px}body.bio-layout-resume-sidebar .bio-cover{grid-column:1;height:190px}body.bio-layout-resume-sidebar .bio-identity{grid-column:1;position:sticky;top:20px;text-align:left;padding:16px 0}body.bio-layout-resume-sidebar .bio-avatar-wrap,body.bio-layout-resume-sidebar .bio-name-row,body.bio-layout-resume-sidebar .bio-meta,body.bio-layout-resume-sidebar .bio-actions{justify-content:flex-start}body.bio-layout-resume-sidebar .bio-headline{margin-left:0}body.bio-layout-resume-sidebar .bio-section,body.bio-layout-resume-sidebar .bio-final,body.bio-layout-resume-sidebar .bio-ad{grid-column:2;margin-top:0}body.bio-layout-resume-sidebar .bio-section{box-shadow:none}

/* 14 — phone card: a true small-screen bio card even on desktop. */
body.bio-layout-phone-card{background:radial-gradient(circle at 20% 10%,color-mix(in srgb,var(--bio-accent) 18%,transparent),transparent 35%),var(--bio-bg)}body.bio-layout-phone-card .bio-shell{width:min(calc(100% - 28px),460px);margin-block:32px;padding:12px;border:1px solid var(--bio-border);border-radius:34px;background:var(--bio-surface);box-shadow:0 30px 90px rgba(17,24,39,.2)}body.bio-layout-phone-card .bio-cover{height:180px;border-radius:24px 24px 8px 8px}body.bio-layout-phone-card .bio-avatar{width:104px;height:104px}body.bio-layout-phone-card .bio-name-row h1{font-size:2.5rem}body.bio-layout-phone-card .bio-section,body.bio-layout-phone-card .bio-final{padding:22px;border-radius:16px;box-shadow:none}body.bio-layout-phone-card .bio-social-section .bio-social{grid-template-columns:1fr}body.bio-layout-phone-card .bio-gallery{grid-template-columns:repeat(2,1fr)}body.bio-layout-phone-card .bio-gallery figure,body.bio-layout-phone-card .bio-gallery figure:nth-child(n){grid-column:span 1}

/* 15 — mono strip: borderless typographic bands and no card metaphor. */
body.bio-layout-mono-strip .bio-shell{max-width:1180px}body.bio-layout-mono-strip .bio-cover{border-radius:0;filter:grayscale(1)}body.bio-layout-mono-strip .bio-identity{text-align:left;padding:40px 0}body.bio-layout-mono-strip .bio-avatar-wrap,body.bio-layout-mono-strip .bio-name-row,body.bio-layout-mono-strip .bio-meta,body.bio-layout-mono-strip .bio-actions{justify-content:flex-start}body.bio-layout-mono-strip .bio-headline{margin-left:0}body.bio-layout-mono-strip .bio-section{border:0;border-top:2px solid var(--bio-text);border-radius:0;background:transparent;box-shadow:none;padding:52px 0}body.bio-layout-mono-strip .bio-link-card{border-inline:0;border-radius:0;background:transparent}

/* 16 — agency casebook: wide case-study grid with offset header. */
body.bio-layout-agency-casebook .bio-shell{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;max-width:1400px}body.bio-layout-agency-casebook .bio-cover{grid-column:5/-1;height:500px}body.bio-layout-agency-casebook .bio-identity{grid-column:1/7;align-self:end;margin-right:-120px;z-index:2;text-align:left;padding:42px;background:var(--bio-surface);border:1px solid var(--bio-border)}body.bio-layout-agency-casebook .bio-avatar-wrap,body.bio-layout-agency-casebook .bio-name-row,body.bio-layout-agency-casebook .bio-meta,body.bio-layout-agency-casebook .bio-actions{justify-content:flex-start}body.bio-layout-agency-casebook .bio-headline{margin-left:0}body.bio-layout-agency-casebook .bio-section,body.bio-layout-agency-casebook .bio-final,body.bio-layout-agency-casebook .bio-ad{grid-column:1/-1}body.bio-layout-agency-casebook .bio-links,body.bio-layout-agency-casebook .bio-social-section{grid-column:span 6}

/* 17 — studio asymmetric: narrow/wide alternating editorial blocks. */
body.bio-layout-studio-asymmetric .bio-shell{max-width:1260px}body.bio-layout-studio-asymmetric .bio-identity{text-align:left;width:74%;padding-left:6%}body.bio-layout-studio-asymmetric .bio-avatar-wrap,body.bio-layout-studio-asymmetric .bio-name-row,body.bio-layout-studio-asymmetric .bio-meta,body.bio-layout-studio-asymmetric .bio-actions{justify-content:flex-start}body.bio-layout-studio-asymmetric .bio-headline{margin-left:0}body.bio-layout-studio-asymmetric .bio-section:nth-of-type(odd){width:76%;margin-left:auto}body.bio-layout-studio-asymmetric .bio-section:nth-of-type(even){width:88%;margin-right:auto}body.bio-layout-studio-asymmetric .bio-work{width:100%!important}

/* 18 — bold panels: alternating solid color campaign panels. */
body.bio-layout-bold-panels .bio-shell{max-width:1200px}body.bio-layout-bold-panels .bio-cover{border-radius:2px}body.bio-layout-bold-panels .bio-name-row h1{text-transform:uppercase;font-weight:900}body.bio-layout-bold-panels .bio-section{border-radius:2px;box-shadow:none}body.bio-layout-bold-panels .bio-section:nth-of-type(3n+1){background:var(--bio-primary);color:var(--bio-primary-text)}body.bio-layout-bold-panels .bio-section:nth-of-type(3n+1) .bio-section-heading>span,body.bio-layout-bold-panels .bio-section:nth-of-type(3n+1) .bio-section-heading p{color:inherit}body.bio-layout-bold-panels .bio-section:nth-of-type(3n+2){background:color-mix(in srgb,var(--bio-accent) 22%,var(--bio-surface))}body.bio-layout-bold-panels .bio-link-card{border-width:2px}

/* 19 — gallery masonry: imagery dominates, metadata stays quiet. */
body.bio-layout-gallery-masonry .bio-shell{width:min(calc(100% - 28px),1500px);max-width:none}body.bio-layout-gallery-masonry .bio-identity{text-align:left;padding-inline:0}body.bio-layout-gallery-masonry .bio-avatar-wrap,body.bio-layout-gallery-masonry .bio-name-row,body.bio-layout-gallery-masonry .bio-meta,body.bio-layout-gallery-masonry .bio-actions{justify-content:flex-start}body.bio-layout-gallery-masonry .bio-headline{margin-left:0}body.bio-layout-gallery-masonry .bio-work{padding:0;border:0;background:transparent;box-shadow:none}body.bio-layout-gallery-masonry .bio-gallery{display:block;columns:3;column-gap:10px}body.bio-layout-gallery-masonry .bio-gallery figure,body.bio-layout-gallery-masonry .bio-gallery figure:nth-child(n){display:inline-block;width:100%;margin:0 0 10px;border-radius:2px}body.bio-layout-gallery-masonry .bio-gallery img,body.bio-layout-gallery-masonry .bio-gallery figure:nth-child(n) img{aspect-ratio:auto;min-height:220px}

/* 20 — manifesto poster: type-led poster followed by manifesto bands. */
body.bio-layout-manifesto-poster .bio-shell{max-width:1220px}body.bio-layout-manifesto-poster .bio-cover{height:520px;border-radius:0}body.bio-layout-manifesto-poster .bio-identity{margin-top:-160px;width:90%;padding:40px;background:var(--bio-primary);color:var(--bio-primary-text);text-align:left}body.bio-layout-manifesto-poster .bio-avatar{display:none}body.bio-layout-manifesto-poster .bio-name-row,body.bio-layout-manifesto-poster .bio-meta,body.bio-layout-manifesto-poster .bio-actions{justify-content:flex-start}body.bio-layout-manifesto-poster .bio-headline{margin-left:0;color:inherit}body.bio-layout-manifesto-poster .bio-name-row h1{text-transform:uppercase}body.bio-layout-manifesto-poster .bio-section{border-radius:0;box-shadow:none;border-width:0 0 1px;padding:70px 4%}

/* 21 — color blocks: playful side-by-side content tiles. */
body.bio-layout-color-blocks .bio-shell{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1240px}body.bio-layout-color-blocks .bio-cover,body.bio-layout-color-blocks .bio-identity,body.bio-layout-color-blocks .bio-work,body.bio-layout-color-blocks .bio-experience,body.bio-layout-color-blocks .bio-final{grid-column:1/-1}body.bio-layout-color-blocks .bio-section{margin-top:0;box-shadow:none}body.bio-layout-color-blocks .bio-section:nth-of-type(odd){background:color-mix(in srgb,var(--bio-primary) 10%,var(--bio-surface))}body.bio-layout-color-blocks .bio-section:nth-of-type(even){background:color-mix(in srgb,var(--bio-accent) 13%,var(--bio-surface))}

/* 22 — service menu: service-board links and two-column information. */
body.bio-layout-service-menu .bio-shell{max-width:1120px}body.bio-layout-service-menu .bio-identity{text-align:left;border-bottom:3px double var(--bio-border)}body.bio-layout-service-menu .bio-avatar-wrap,body.bio-layout-service-menu .bio-name-row,body.bio-layout-service-menu .bio-meta,body.bio-layout-service-menu .bio-actions{justify-content:flex-start}body.bio-layout-service-menu .bio-headline{margin-left:0}body.bio-layout-service-menu .bio-link-list{grid-template-columns:repeat(2,minmax(0,1fr))}body.bio-layout-service-menu .bio-link-card{min-height:112px;align-items:flex-start}body.bio-layout-service-menu .bio-section-heading{display:grid;grid-template-columns:140px 1fr;max-width:none;align-items:end}body.bio-layout-service-menu .bio-section-heading>span{grid-column:1}body.bio-layout-service-menu .bio-section-heading h2{grid-column:2}

/* 23 — dark booking: compact dark service card and prominent action. */
body.bio-layout-dark-booking .bio-shell{max-width:820px}body.bio-layout-dark-booking .bio-cover{height:430px}body.bio-layout-dark-booking .bio-identity{margin:-110px 28px 0;padding:28px;background:var(--bio-surface);border:1px solid var(--bio-border);text-align:left}body.bio-layout-dark-booking .bio-avatar-wrap,body.bio-layout-dark-booking .bio-name-row,body.bio-layout-dark-booking .bio-meta,body.bio-layout-dark-booking .bio-actions{justify-content:flex-start}body.bio-layout-dark-booking .bio-headline{margin-left:0}body.bio-layout-dark-booking .bio-section{box-shadow:none}body.bio-layout-dark-booking .bio-btn.primary{min-width:190px}

/* 24 — local business: practical two-column brochure. */
body.bio-layout-local-business .bio-shell{display:grid;grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);gap:18px;max-width:1240px}body.bio-layout-local-business .bio-cover{grid-column:1/-1;height:320px}body.bio-layout-local-business .bio-identity{grid-column:1;text-align:left}body.bio-layout-local-business .bio-avatar-wrap,body.bio-layout-local-business .bio-name-row,body.bio-layout-local-business .bio-meta,body.bio-layout-local-business .bio-actions{justify-content:flex-start}body.bio-layout-local-business .bio-headline{margin-left:0}body.bio-layout-local-business .bio-section,body.bio-layout-local-business .bio-final,body.bio-layout-local-business .bio-ad{grid-column:2;margin-top:0}body.bio-layout-local-business .bio-links,body.bio-layout-local-business .bio-social-section{grid-column:1}

/* 25 — storefront grid: product-card treatment for every important destination. */
body.bio-layout-storefront-grid .bio-shell{max-width:1320px}body.bio-layout-storefront-grid .bio-identity{text-align:left}body.bio-layout-storefront-grid .bio-avatar-wrap,body.bio-layout-storefront-grid .bio-name-row,body.bio-layout-storefront-grid .bio-meta,body.bio-layout-storefront-grid .bio-actions{justify-content:flex-start}body.bio-layout-storefront-grid .bio-headline{margin-left:0}body.bio-layout-storefront-grid .bio-link-list{grid-template-columns:repeat(3,minmax(0,1fr))}body.bio-layout-storefront-grid .bio-link-card{min-height:210px;display:grid;grid-template-columns:1fr;align-content:end}body.bio-layout-storefront-grid .bio-link-card img{width:100%;height:118px}body.bio-layout-storefront-grid .bio-link-card>b{position:absolute;right:18px;top:16px}body.bio-layout-storefront-grid .bio-link-card{position:relative}

/* 26 — drop mobile: narrow promotional phone screen with oversized actions. */
body.bio-layout-drop-mobile{background:linear-gradient(135deg,var(--bio-primary),var(--bio-accent))}body.bio-layout-drop-mobile .bio-shell{width:min(calc(100% - 24px),430px);margin-block:24px;padding:10px;border-radius:26px;background:var(--bio-bg);box-shadow:0 30px 80px rgba(0,0,0,.28)}body.bio-layout-drop-mobile .bio-cover{height:260px;border-radius:18px}body.bio-layout-drop-mobile .bio-name-row h1{font-size:2.8rem;text-transform:uppercase}body.bio-layout-drop-mobile .bio-section,body.bio-layout-drop-mobile .bio-final{padding:20px;border-radius:14px;box-shadow:none}body.bio-layout-drop-mobile .bio-link-card{min-height:92px;background:var(--bio-primary);color:var(--bio-primary-text);border-color:var(--bio-primary)}body.bio-layout-drop-mobile .bio-social-section .bio-social{grid-template-columns:1fr}

/* 27 — maker story: biography and imagery alternate like a small editorial shop. */
body.bio-layout-maker-story .bio-shell{max-width:1180px}body.bio-layout-maker-story .bio-identity{text-align:left;padding-left:7%}body.bio-layout-maker-story .bio-avatar-wrap,body.bio-layout-maker-story .bio-name-row,body.bio-layout-maker-story .bio-meta,body.bio-layout-maker-story .bio-actions{justify-content:flex-start}body.bio-layout-maker-story .bio-headline{margin-left:0}body.bio-layout-maker-story .bio-about{display:grid;grid-template-columns:260px 1fr;gap:34px}body.bio-layout-maker-story .bio-about .bio-section-heading{margin:0}body.bio-layout-maker-story .bio-work{padding:30px}body.bio-layout-maker-story .bio-link-list{grid-template-columns:repeat(2,1fr)}

/* 28 — magazine cover: cover-led masthead with multi-column editorial modules. */
body.bio-layout-magazine-cover .bio-shell{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px;max-width:1400px}body.bio-layout-magazine-cover .bio-cover{grid-column:1/9;height:660px;border-radius:0}body.bio-layout-magazine-cover .bio-identity{grid-column:8/-1;align-self:center;margin-left:-120px;padding:38px;background:var(--bio-surface);border:1px solid var(--bio-border);text-align:left}body.bio-layout-magazine-cover .bio-avatar-wrap,body.bio-layout-magazine-cover .bio-name-row,body.bio-layout-magazine-cover .bio-meta,body.bio-layout-magazine-cover .bio-actions{justify-content:flex-start}body.bio-layout-magazine-cover .bio-headline{margin-left:0}body.bio-layout-magazine-cover .bio-section,body.bio-layout-magazine-cover .bio-final,body.bio-layout-magazine-cover .bio-ad{grid-column:1/-1}body.bio-layout-magazine-cover .bio-links,body.bio-layout-magazine-cover .bio-social-section,body.bio-layout-magazine-cover .bio-media{grid-column:span 6}

/* 29 — atelier narrow: refined centered narrow screen with tall imagery. */
body.bio-layout-atelier-narrow .bio-shell{max-width:720px}body.bio-layout-atelier-narrow .bio-cover{height:520px;border-radius:2px}body.bio-layout-atelier-narrow .bio-avatar{border-radius:2px}body.bio-layout-atelier-narrow .bio-section{padding:42px 28px;border-inline:0;border-radius:0;box-shadow:none}body.bio-layout-atelier-narrow .bio-gallery{grid-template-columns:1fr 1fr}body.bio-layout-atelier-narrow .bio-gallery figure,body.bio-layout-atelier-narrow .bio-gallery figure:nth-child(n){grid-column:span 1;border-radius:0}

/* 30 — street collage: energetic offset cards and rotated media. */
body.bio-layout-street-collage .bio-shell{max-width:1200px}body.bio-layout-street-collage .bio-cover{height:500px;transform:rotate(-1deg);border-radius:2px}body.bio-layout-street-collage .bio-identity{width:88%;margin:-90px 0 20px auto;padding:32px;background:var(--bio-primary);color:var(--bio-primary-text);text-align:left;transform:rotate(.6deg)}body.bio-layout-street-collage .bio-avatar-wrap,body.bio-layout-street-collage .bio-name-row,body.bio-layout-street-collage .bio-meta,body.bio-layout-street-collage .bio-actions{justify-content:flex-start}body.bio-layout-street-collage .bio-headline{margin-left:0;color:inherit}body.bio-layout-street-collage .bio-section{width:94%;border-radius:2px;box-shadow:8px 8px 0 color-mix(in srgb,var(--bio-primary) 18%,transparent)}body.bio-layout-street-collage .bio-section:nth-of-type(even){margin-left:auto;transform:rotate(.35deg)}body.bio-layout-street-collage .bio-section:nth-of-type(odd){margin-right:auto;transform:rotate(-.3deg)}

/* Collapse every complex desktop arrangement into a clear mobile page. */
@media(max-width:860px){
 body.bio-page .bio-shell{display:flex;width:min(calc(100% - 24px),var(--bio-max));margin-inline:auto;padding:22px 0 60px;border-radius:0;box-shadow:none}
 body.bio-page .bio-cover,body.bio-page .bio-identity,body.bio-page .bio-section,body.bio-page .bio-final,body.bio-page .bio-ad{position:relative;top:auto;width:auto;max-width:none;grid-column:auto;margin-left:0;margin-right:0;transform:none}
 body.bio-layout-stage-fullscreen .bio-shell,body.bio-layout-launch-fullbleed .bio-shell{width:100%;padding-top:0}
 body.bio-layout-stage-fullscreen .bio-cover,body.bio-layout-launch-fullbleed .bio-cover{height:360px;min-height:0}
 body.bio-layout-stage-fullscreen .bio-identity{width:min(calc(100% - 24px),680px);margin:-130px auto 34px;padding:22px;color:#fff}
 body.bio-layout-launch-fullbleed .bio-identity{width:min(calc(100% - 24px),680px);margin:-70px auto 24px;padding:24px}
 body.bio-layout-phone-card .bio-shell,body.bio-layout-drop-mobile .bio-shell{width:min(calc(100% - 20px),460px);margin:10px auto;padding:10px;border-radius:24px;box-shadow:0 18px 48px rgba(17,24,39,.18)}
 body.bio-layout-poster-split .bio-cover,body.bio-layout-record-sleeve .bio-cover,body.bio-layout-magazine-cover .bio-cover{height:360px;aspect-ratio:auto}
 body.bio-layout-poster-split .bio-identity,body.bio-layout-record-sleeve .bio-identity,body.bio-layout-agency-casebook .bio-identity,body.bio-layout-magazine-cover .bio-identity{margin-top:-60px;padding:24px;background:var(--bio-surface);color:var(--bio-text);z-index:2}
 body.bio-layout-community-board .bio-identity,body.bio-layout-executive-split .bio-identity,body.bio-layout-resume-sidebar .bio-identity{position:relative;top:auto}
 body.bio-layout-heritage-editorial .bio-about .bio-richtext{columns:1}
 body.bio-layout-gallery-masonry .bio-gallery{columns:2}
 body.bio-layout-storefront-grid .bio-link-list,body.bio-layout-service-menu .bio-link-list,body.bio-layout-maker-story .bio-link-list{grid-template-columns:1fr}
 body.bio-layout-color-blocks .bio-section:nth-of-type(n),body.bio-layout-studio-asymmetric .bio-section:nth-of-type(n),body.bio-layout-street-collage .bio-section:nth-of-type(n){width:auto;transform:none}
 body.bio-layout-maker-story .bio-about{display:block}
}
@media(max-width:560px){.bio-social-section .bio-social{grid-template-columns:1fr}body.bio-layout-gallery-masonry .bio-gallery{columns:1}body.bio-layout-bento-grid .bio-section,body.bio-layout-color-blocks .bio-section{grid-column:auto}.bio-platform-icon{width:34px;height:34px}}
