/* 686 uses the Mamo landing page styles and Studio Spectrum tokens.
   These additions fit the studio logo, project directory and real app screens. */
.wordmark{font-size:clamp(26px,2.8vw,38px);font-weight:750;line-height:1.08;letter-spacing:-.075em;background:linear-gradient(108deg,#c834ab,#9250d3 56%,#407cde);background-clip:text;-webkit-background-clip:text;color:transparent}
.site-header nav a[aria-current=page]{color:var(--ss-accent);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:7px}
.hero-copy,.story-copy,.project-card{min-width:0}.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.04fr)}
.studio-art{max-width:560px;width:100%;margin-inline:auto;align-self:center}
.studio-art .spark-one{right:-2px}.studio-art .hero-note{left:4%;right:7%;bottom:20px}
.emblem-art .emblem{width:85%;height:auto;margin:0 auto}.emblem-art::before{inset:10% 2% 13% 6%;background:var(--lilac)}
.studio-art .note-label{font-size:10px}.hero-description,.project-card p{overflow-wrap:break-word}
.project-section{padding-block:clamp(62px,8vw,112px)}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:42px}
.project-card{border-radius:var(--radius);padding:clamp(26px,3.2vw,46px)}
.apps-card{background:var(--pink)}.lab-card{background:var(--lilac)}
.project-card h3{font-size:clamp(34px,4vw,50px);margin:13px 0 22px;font-weight:650}
.app-card-link{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:17px 0}
.app-card-link+.app-card-link{border-top:1px solid color-mix(in srgb,var(--ink) 13%,transparent)}
.app-card-link:hover h4,.lab-card a:hover{text-decoration:underline;text-underline-offset:4px}
.app-icon{width:54px;height:54px;aspect-ratio:1;flex-shrink:0;border-radius:23%;box-shadow:0 3px 10px #24153314}
.app-card-link h4,.lab-details h4{font-size:24px;letter-spacing:-.04em}
.app-card-link p,.lab-details p{font-size:15px;color:var(--muted);line-height:1.55;margin-top:5px}
.app-card-link b{font-weight:500;color:var(--ss-accent)}.lab-details{display:grid;align-items:center;gap:14px;grid-template-columns:minmax(85px,.8fr) 1.4fr;margin:30px 0 18px}
.lab-details img{width:100%}.app-identity{display:flex;align-items:center;gap:13px}.app-identity b{font-size:26px;letter-spacing:-.045em;line-height:1.2}.app-identity .eyebrow{font-size:10px;color:var(--muted);margin-top:3px}
.family-art::before{inset:35px 1px 30px 28px}.family-art .family-portrait{margin:0 4%}
.map-art{padding-block:48px 70px}.screen-pair{display:flex;align-items:center;justify-content:center;gap:10px}.screen-pair img{width:38%;height:auto;border-radius:14px;box-shadow:0 15px 35px #33274a26}.screen-pair img:first-child{transform:rotate(-5deg)}.screen-pair img:last-child{transform:translateY(18px) rotate(5deg)}
.print-art figure{background:var(--blue);border-radius:110px 110px 26px 26px;padding:8% 5% 7%;margin:0 3%}
.print-art figure img{width:100%}.print-art figcaption{text-align:center;color:var(--muted);font-size:13px}.print-art .hero-note{bottom:5px}
.story-tab{background:transparent;text-align:left;color:var(--ink);font-family:inherit}.screen-link{display:block;width:min(100%,242px);margin:auto}.screen-link img{width:100%;border-radius:20px;box-shadow:0 18px 40px #28203826}
.story-panel{scroll-margin-top:20px}
.studio-footer{border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:35px}
.studio-footer p{font-size:12px;color:var(--muted);margin-top:9px}.studio-footer>div:last-child{display:flex;flex-wrap:wrap;gap:20px;font-size:14px}.studio-footer a:hover{text-decoration:underline}
@media(max-width:760px){.site-header{height:auto;min-height:76px;flex-wrap:wrap;gap:6px 12px;padding-block:12px}.site-header nav{display:flex;flex-wrap:wrap;gap:13px;margin-left:auto}.site-header nav a,.site-header nav a:first-child{display:inline-block;font-size:13px;padding-block:10px}.hero{grid-template-columns:minmax(0,1fr)}.hero h1{font-size:clamp(52px,13vw,80px)}.studio-art{max-width:435px;width:90%}.studio-art .hero-note{bottom:18px}.pair{grid-template-columns:1fr;margin-top:25px}.app-card-link{gap:12px}.app-card-link .app-icon{width:47px;height:47px}.project-card h3{margin-bottom:10px}.studio-footer{flex-wrap:wrap}.section-heading>p:last-child{padding-bottom:0}.screen-link{width:min(100%,210px)}}
@media(max-width:490px){.site-header{align-content:center;justify-content:flex-start;padding-top:20px}.site-header nav{width:100%;justify-content:space-between;margin:0}.hero{padding-top:22px}.app-card-link{grid-template-columns:auto minmax(0,1fr)}.app-card-link b{display:none}.project-card{padding:24px 20px}.lab-details{grid-template-columns:1fr 1.7fr;gap:9px}}
@media(prefers-color-scheme:dark){.wordmark{background-image:linear-gradient(105deg,#f284c6,#bc8cf0 55%,#82adff)}}
.studio-art::before{right:4%}.studio-art{overflow:clip;overflow-clip-margin:10px}
@media(min-width:761px) and (max-width:1000px){.hero h1{font-size:clamp(58px,7.7vw,74px)}}

.forge-intro{margin-top:24px;padding-block:clamp(66px,9vw,120px)}
.forge-intro h1{font-size:clamp(58px,9.5vw,130px);line-height:1;letter-spacing:-.065em;margin:20px 0}
.forge-intro .forge-lead{font-size:clamp(18px,2vw,26px);color:var(--ink);letter-spacing:-.025em}
.forge-workshop-head{display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:clamp(28px,7vw,105px)}
.forge-workshop-head h2{margin:15px 0}
.forge-workshop-head figure{padding:14px 22px;border-radius:var(--radius);background:var(--blue)}
.forge-workshop-head img{width:min(100%,265px);margin:auto}
.forge-workshop-head figcaption{text-align:center;font-size:12px;color:var(--muted)}
@media(max-width:760px){.forge-intro{margin-top:10px}.forge-workshop-head{grid-template-columns:1fr}.forge-workshop-head img{max-width:195px}}

.studio-about{display:grid;grid-template-columns:1fr 1.35fr;align-items:baseline;gap:clamp(24px,5vw,80px);padding:clamp(30px,4vw,54px) 0 clamp(44px,5vw,70px);border-top:1px solid var(--line)}
.studio-about h2{font-size:clamp(28px,3vw,42px)}
.studio-about p{color:var(--muted);font-size:16px;line-height:1.75;max-width:62ch}
@media(max-width:760px){.studio-about{grid-template-columns:1fr;gap:14px}}

.catalog{padding-block:clamp(42px,5vw,80px)}
.catalog h1{font-size:clamp(60px,7.5vw,100px);letter-spacing:-.065em;margin:18px 0}
.catalog h1 span{color:var(--ss-accent)}
.catalog .hero-lead{margin:0;color:var(--muted)}
.catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:42px}
.catalog-card{border-radius:var(--radius);overflow:hidden;background:var(--pink);display:flex;flex-direction:column}
.catalog-card:nth-child(2){background:var(--blue)}
.catalog-copy{padding:clamp(23px,3.5vw,44px);flex:1}
.catalog-copy .app-identity{margin:16px 0}
.catalog-copy>p:not(.eyebrow){color:var(--muted);line-height:1.65;max-width:42ch}
.catalog-links{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;margin-top:22px}
.catalog-screen{height:236px;overflow:hidden;display:flex;justify-content:center;padding:12px 10px 0}
.catalog-screen img{width:200px;height:auto;border-radius:18px;box-shadow:0 8px 32px #30213825}
.catalog-screen a:focus-visible{outline-offset:2px}
@media(max-width:760px){.catalog-grid{grid-template-columns:1fr}.catalog-screen{height:180px}.catalog-heading{margin-top:0}}
