.design-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,430px);gap:64px;align-items:start;margin:0 0 64px}.design-detail h2{font-size:25px;letter-spacing:-.7px;margin:32px 0 14px}.design-detail p,.design-detail li{font-size:16px;line-height:1.75;color:var(--ui-muted)}.design-detail li{padding:4px 0}.design-preview{overflow:hidden;border-radius:28px;box-shadow:0 18px 50px #2113311a;pointer-events:none}.design-preview .bio-page{max-width:430px;min-height:750px}.design-preview .p-tools{visibility:hidden}.design-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:25px 0 48px}.design-tile{display:block;text-decoration:none;border-radius:24px;background:white;border:1px solid #e6e3eb;overflow:hidden;transition:transform .2s,box-shadow .2s}.design-tile:hover{transform:translateY(-3px);box-shadow:0 12px 30px #21133116}.design-stage{position:relative;height:480px;background:#eeecf1;overflow:hidden}.design-canvas{position:absolute;top:14px;left:50%;width:390px;transform:translateX(-50%) scale(.68);transform-origin:top center;pointer-events:none}.design-canvas .bio-page{min-height:660px;border-radius:23px;overflow:hidden}.design-canvas .p-tools{visibility:hidden}.design-caption{padding:20px}.design-caption strong,.design-caption>span{display:block}.design-caption strong{font-size:20px;letter-spacing:-.5px}.design-caption>span{font-size:13px;color:#6a6274;margin-top:8px}.design-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:28px 0 60px}.design-pagination a{display:grid;place-items:center;min-width:44px;min-height:44px;border:1px solid #d6d0df;border-radius:12px;background:white;text-decoration:none}.design-pagination a[aria-current]{background:#2b1240;color:white}.design-preview nav,.design-canvas nav{position:static;width:auto;margin:0;padding:0;z-index:auto;border:0;border-radius:0;background:transparent;backdrop-filter:none;box-shadow:none;display:block}.design-preview footer,.design-canvas footer{width:auto;margin:0}.design-detail>.design-preview{position:sticky;top:105px}@media(max-width:820px){.design-detail{grid-template-columns:1fr;gap:28px}.design-detail>.design-preview{position:static;grid-row:1;max-width:390px;width:100%;justify-self:center}.design-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.design-stage{height:410px}.design-canvas{transform:translateX(-50%) scale(.57)}}@media(max-width:520px){.design-grid{grid-template-columns:1fr;max-width:360px;margin-left:auto;margin-right:auto}.design-stage{height:480px}.design-canvas{transform:translateX(-50%) scale(.68)}}@media(prefers-reduced-motion:reduce){.design-tile{transition:none}}
.design-detail{padding-top:42px}.design-detail h1{font-size:clamp(48px,6vw,78px);letter-spacing:-3px;line-height:1.06;margin:18px 0 25px}.design-detail .eyebrow{font-size:12px;letter-spacing:1px;font-weight:600;color:#665872}.design-detail>.design-preview{top:100px}.design-detail>div:first-child>p:first-of-type{margin-top:0}@media(max-width:820px){.design-detail{padding-top:24px}.design-detail h1{font-size:48px;letter-spacing:-2px}.design-detail>.design-preview{grid-row:auto}}
.design-preview nav.p-links,.design-canvas nav.p-links{display:flex;flex-direction:column;gap:9px}.design-preview nav.p-socials,.design-canvas nav.p-socials{display:flex;flex-direction:row;justify-content:center;gap:13px;margin-top:18px}
.design-preview nav.p-links,.design-canvas nav.p-links{align-items:stretch}.design-preview nav.p-socials,.design-canvas nav.p-socials{align-items:center}
.design-categories{position:static;display:flex;flex-wrap:wrap;gap:8px;width:auto;height:auto;margin:0 0 8px;padding:0;border:0;border-radius:0;background:none;backdrop-filter:none;box-shadow:none;justify-content:flex-start}.design-categories a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid #d6d0df;background:white;color:#2b1240;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap}.design-categories a:hover{border-color:#2b1240}.design-categories a[aria-current]{background:#2b1240;border-color:#2b1240;color:white}.category-intro{max-width:70ch;font-size:17px;line-height:1.7;color:var(--ui-muted,#5b5366);margin:22px 0 8px}
/* Browse-by-category sidebar, matching the editor gallery. */
.gallery-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:36px;align-items:start;width:min(1240px,calc(100vw - 40px));margin:12px 0 0 calc((100% - min(1240px,calc(100vw - 40px)))/2)}
.gallery-side{position:sticky;top:96px}
.gallery-side .side-label{margin:0 0 14px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#6b6775}
.gallery-side .design-categories{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:10px;margin:0}
.gallery-side .design-categories a{min-height:50px;padding:0 20px;font-size:15px;font-weight:500;color:#241530;border-color:#e5e1ec;transition:border-color .2s,background .2s,transform .35s cubic-bezier(.34,1.45,.64,1)}
.gallery-side .design-categories a:hover{border-color:#241530}
.gallery-side .design-categories a:active{transform:scale(.97)}
.gallery-side .design-categories a[aria-current]{background:#241530;border-color:#241530;color:#fff}
.gallery-main .design-grid{margin-top:0}.gallery-main .category-intro{margin-top:0}
@media(max-width:820px){
 .gallery-layout{grid-template-columns:minmax(0,1fr);gap:18px}
 .gallery-side{position:static}
 .gallery-side .design-categories{flex-direction:row;align-items:center;overflow-x:auto;margin:0 -20px;padding:2px 20px 6px;scrollbar-width:none}
 .gallery-side .design-categories::-webkit-scrollbar{display:none}
 .gallery-side .design-categories a{flex:none;min-height:44px;font-size:14px}
}
@media(prefers-reduced-motion:reduce){.gallery-side .design-categories a{transition:none}}
@media(max-width:820px){.gallery-side .design-categories{margin:0;padding:2px 0 6px}}
/* Template product page: heading, description, tags and one action beside a live phone preview. */
.tpl-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:clamp(40px,6vw,96px);align-items:center;margin:28px 0 80px}
.tpl-copy h1{margin:0 0 24px;font-size:clamp(44px,6.2vw,88px);line-height:.98;letter-spacing:-.045em;font-weight:800;color:#1d1530;text-wrap:balance}
.tpl-lede{margin:0;max-width:34em;font-size:clamp(18px,1.55vw,22px);line-height:1.6;color:#2b2438}
.tpl-tags{position:static;display:flex;flex-wrap:wrap;gap:10px;margin:28px 0 0;padding:0;width:auto;border:0;border-radius:0;background:none;backdrop-filter:none;box-shadow:none}
.tpl-tags a{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid #d9d3e3;border-radius:999px;background:#fff;color:#241530;font-size:15px;font-weight:500;text-decoration:none;transition:border-color .2s}
.tpl-tags a:hover{border-color:#241530}
.tpl-cta{display:inline-flex;align-items:center;justify-content:center;min-width:min(100%,340px);min-height:64px;margin-top:32px;padding:0 36px;border-radius:999px;background:linear-gradient(120deg,#4f22ac,#7643e9);color:#fff;font-size:18px;font-weight:650;text-decoration:none;box-shadow:0 16px 34px -18px #4f22acaa;transition:transform .45s cubic-bezier(.34,1.45,.64,1),box-shadow .3s}
.tpl-cta:hover{transform:translateY(-2px);box-shadow:0 20px 40px -18px #4f22acbb}.tpl-cta:active{transform:scale(.97)}
.tpl-note{margin:14px 0 0;font-size:14px;color:var(--ui-muted,#6b6775)}
.tpl-preview{border-radius:48px;box-shadow:0 30px 70px -30px #21133166,0 0 0 1px #0000000d;pointer-events:none;overflow:hidden}
.tpl-preview .bio-page{max-width:420px;min-height:760px}
.tpl-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0 0 72px}
.tpl-details article{padding:28px;border-radius:28px;background:#fff;border:1px solid #ece8f1}
.tpl-details h2{margin:0 0 12px;font-size:22px;letter-spacing:-.02em}
.tpl-details p,.tpl-details li{font-size:16px;line-height:1.7;color:var(--ui-muted,#5b5366)}
.tpl-details ul{margin:0 0 12px;padding-left:20px}
@media(max-width:900px){.tpl-hero{grid-template-columns:1fr;gap:40px;margin-bottom:56px}.tpl-preview{max-width:390px;width:100%;justify-self:center}.tpl-details{grid-template-columns:1fr}.tpl-cta{width:100%}}
@media(prefers-reduced-motion:reduce){.tpl-cta{transition:none}}
