/* Homepage: live-search hero, "what is going wrong" list, stacked sheets */
.mono{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase}
.yh-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);min-height:min(760px,calc(100vh - 66px));background:var(--bg);border-bottom:1px solid var(--line)}
.yh-l{padding:30px clamp(18px,4vw,56px) 44px;display:flex;flex-direction:column;justify-content:space-between;gap:34px}
.yh-meta{display:flex;justify-content:space-between;gap:12px}
.yh-open:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:8px}
.yh-hero h1{font-size:clamp(2.6rem,6vw,5.4rem);line-height:.94;letter-spacing:-.045em}
.yh-hero h1 .l2{display:block;font-size:clamp(1.2rem,2.2vw,1.7rem);line-height:1.15;letter-spacing:-.025em;font-weight:500;margin-top:20px;max-width:24ch}
.yh-hero .lead{max-width:48ch;margin-top:20px}
.yh-hero .cta{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:26px}
.yh-lnk{font-family:var(--mono);font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--ink);padding-bottom:3px}
.yh-lnk:hover{color:var(--accent);border-color:var(--accent)}
.yh-hero .reassure{font-size:.92rem;color:var(--muted);margin-top:18px;max-width:46ch}
.yh-r{background:var(--accent);color:#fff;padding:34px;display:flex;flex-direction:column;gap:18px;position:relative;overflow:hidden}
.yh-tabs{display:flex;gap:6px;opacity:.9}.yh-tabs span{padding:5px 10px;border-radius:99px;border:1px solid #ffffff66}.yh-tabs span:first-child{background:#fff;color:var(--accent)}
.yh-q{background:#fff;color:var(--ink);border-radius:99px;display:flex;align-items:center;gap:12px;padding:15px 22px;font-family:var(--mono);font-size:1rem;min-height:56px}
.yh-q svg{flex:none}.yh-q .t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.yh-q .caret{width:2px;height:1.2em;background:var(--ink);animation:yhbl 1s steps(1) infinite}
@keyframes yhbl{50%{opacity:0}}
.yh-cnt{min-height:1.2em;opacity:.9}
.yh-res{display:grid;position:relative}
.yh-card{border-radius:18px;padding:18px 20px;grid-area:1/1;transition:opacity .5s,transform .5s}
.yh-card.no{border:1.5px dashed #ffffff99;display:flex;align-items:center;min-height:120px}.yh-card.no b{font-size:1.5rem;letter-spacing:-.02em}.yh-card.no small{display:block;font-family:var(--mono);font-size:.72rem;opacity:.85;margin-top:5px}
.yh-card.yes{background:#fff;color:var(--ink);display:grid;gap:8px;align-content:start;box-shadow:0 22px 40px -22px #000a}
.yh-card.yes .n{display:flex;align-items:center;gap:12px}.yh-card.yes .n i{font-style:normal;width:36px;height:36px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800}
.yh-card.yes .n b{font-size:1.7rem;letter-spacing:-.03em}.yh-card.yes .m{color:var(--muted);text-transform:none;letter-spacing:.02em;font-size:.78rem}
.yh-card.yes .b{display:flex;gap:8px}.yh-card.yes .b span{padding:8px 14px;border-radius:99px;border:1px solid var(--ink);text-transform:none}.yh-card.yes .b span:first-child{background:var(--accent);border-color:var(--accent);color:#fff}
.st-a .yes,.st-b .no{opacity:0;transform:translateY(10px);pointer-events:none}
.yh-foot{margin-top:auto;display:flex;justify-content:space-between;gap:12px;opacity:.85;flex-wrap:wrap}
/* problems */
.yh-prob{padding:clamp(54px,8vw,110px) 0;background:var(--bg)}
.yh-lab{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--ink);padding-top:14px;margin-bottom:clamp(26px,4vw,50px)}
.yh-pgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,5vw,70px);align-items:start}
.yh-pgrid h2{font-size:clamp(2rem,4.8vw,3.8rem)}
.yh-pgrid .lead{margin-top:18px;max-width:40ch}
.yh-sug{list-style:none;margin:0;padding:0;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden}
.yh-sug li+li{border-top:1px solid var(--line)}
.yh-sug a{display:grid;grid-template-columns:22px minmax(0,1fr);column-gap:14px;row-gap:4px;align-items:center;padding:18px 20px;text-decoration:none;transition:background .2s,color .2s}
.yh-sug .ic{width:20px;height:20px;border:2px solid var(--ink);border-radius:50%;position:relative;opacity:.55}
.yh-sug .ic:after{content:"";position:absolute;left:8px;top:3px;width:2px;height:7px;background:var(--ink);box-shadow:3px 4px 0 0 var(--ink)}
.yh-sug .tx{font-family:var(--mono);font-size:1rem;line-height:1.35}
.yh-sug .go{grid-column:2;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.yh-sug a:hover{background:var(--ink);color:#EFE9DF}.yh-sug a:hover .go{color:#aeb6ff}.yh-sug a:hover .ic{border-color:#EFE9DF}.yh-sug a:hover .ic:after{background:#EFE9DF;box-shadow:3px 4px 0 0 #EFE9DF}
@media(max-width:900px){
 .yh-hero,.yh-pgrid{grid-template-columns:1fr}
 .yh-l{padding:24px 18px 30px}.yh-r{padding:24px 18px}
 .yh-hero h1{font-size:clamp(2.4rem,11vw,3.4rem)}
 .yh-lab span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){.yh-q .caret{animation:none}.yh-card{transition:none}}
.yh-prob .strip{margin:-8px 0 clamp(34px,5vw,60px);border-top:0;border-bottom:1px solid var(--line);background:transparent}
/* ===== Ported from the approved search-concept mock (scoped to .ym) ===== */
.ym{padding-block:clamp(60px,9vw,120px)}
.ymi{max-width:1240px;margin:0 auto;padding-inline:clamp(16px,3vw,34px)}
.ym.proof,main.yd-sheets>section.ym.proof{background:var(--ink)!important;color:var(--bone)!important}
.ym.cta,main.yd-sheets>section.ym.cta{background:var(--accent)!important;color:#fff!important}
.ym.faq{max-width:none}
.ym .lab{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--ink);padding-top:10px;margin-bottom:34px}
.ym h2{font-size:clamp(2.2rem,5vw,4.4rem);line-height:.96}
.ym h2 em{color:var(--accent)}
.ym.proof h2 em{color:#fff;text-decoration:underline;text-decoration-thickness:.04em;text-underline-offset:.12em}
.ym.cta h2 em{color:#fff}
.ym .btn{display:inline-block}
.ym.cta .q{background:#fff;color:#121212;border-radius:26px;display:flex;align-items:center;gap:12px;padding:15px 22px;font-family:var(--mono);flex-wrap:wrap}
.ym .sv{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,1fr) 150px;gap:22px;align-items:center;padding:22px 0;border-top:1px solid var(--line);text-decoration:none;transition:background .25s,padding .25s}
.ym .svs a:last-child{border-bottom:1px solid var(--line)}
.ym .sv:hover{background:#fff;padding-inline:14px}
.ym .sv .k{font-family:var(--mono);font-size:.78rem;color:var(--muted)}
.ym .sv .n{font-size:clamp(1.6rem,3.4vw,2.8rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.ym .sv .t{color:#2a2823;font-size:1rem}
.ym .sv .go{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);text-align:right}
.ym .work{display:block}
.ym .faq-list details{border-top:1px solid var(--line);padding:20px 0}
@media(max-width:900px){.ym .sv{grid-template-columns:34px minmax(0,1fr);gap:8px 14px}.ym .sv .t,.ym .sv .go{grid-column:2;text-align:left}}
.ym .lab,.ym h2,.ym .phones .ph,.ym .num,.ym .step,.ym .work a,.ym .work img,.ym .pkg,.ym .pkg .cut span,.ym .rv blockquote,.ym .faq details,.ym.faq details,.ym.cta h2,.ym.cta .q,.ym .app{animation:none!important;clip-path:none!important
}
.ym.proof{background:var(--ink);color:var(--bone)}
.ym.proof .lab{border-color:#fff4}
.ym .pg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,70px);align-items:center}
.ym .phones{display:flex;gap:16px;justify-content:center;align-items:flex-start}
.ym .ph{width:min(44%,230px);aspect-ratio:9/19.5;background:#000;border-radius:30px;padding:7px;box-shadow:0 0 0 1.5px #ffffff30;position:relative}
.ym .ph+.ph{margin-top:44px}
.ym .ph img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:24px;display:block}
.ym .num{border-top:1px solid #fff3;padding:20px 0}
.ym .num b{display:block;font-size:clamp(3rem,7vw,6rem);letter-spacing:-.05em;line-height:.9;font-weight:800}
.ym .num b small{font-size:.35em;letter-spacing:0;font-family:var(--serif);font-style:italic;font-weight:400;margin-left:8px}
.ym .num span{font-family:var(--mono);font-size:.76rem;letter-spacing:.07em;text-transform:uppercase;opacity:.92}
.ym .note{font-family:var(--mono);font-size:.72rem;opacity:.85;margin-top:16px;max-width:60ch}
.ym .step{display:grid;grid-template-columns:90px minmax(0,1fr) minmax(0,1.1fr);gap:20px;padding:26px 0;border-top:1px solid var(--line);align-items:baseline}
.ym .step .no{font-family:var(--mono);font-size:.84rem;border:0;min-height:0;color:#3f3b35}
.ym .step .url{font-family:var(--mono);font-size:.74rem;color:#4a463f;margin-bottom:6px}
.ym .step h3{font-size:clamp(1.6rem,3vw,2.5rem);color:var(--sig);font-family:var(--serif);font-weight:400;letter-spacing:-.01em;line-height:1}
.ym .step p{margin:0;color:#2a2823;max-width:46ch;font-size:1.04rem}
.ym .work a{display:grid;grid-template-columns:70px minmax(0,1fr) minmax(0,.8fr) 200px;gap:22px;align-items:center;padding:20px 0;border-top:1px solid var(--line);text-decoration:none;transition:background .25s,padding .25s}
.ym .work a:hover{background:var(--soft);padding-inline:14px}
.ym .work .k{font-family:var(--mono);font-size:.78rem;color:var(--muted)}
.ym .work .n{font-size:clamp(1.8rem,4vw,3.2rem);font-weight:800;letter-spacing:-.04em;line-height:1}
.ym .work .t{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:#3f3b35}
.ym .work img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:8px;display:block}
.ym .pk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ym .pkg{background:var(--paper);border:1px solid var(--ink);padding:22px 20px;display:flex;flex-direction:column;gap:14px;position:relative}
.ym .pkg .code{display:flex;justify-content:space-between}
.ym .pkg h3{font-size:1.5rem;letter-spacing:-.03em}
.ym .pkg .pr{font-size:2.6rem;font-weight:800;letter-spacing:-.05em;line-height:1}
.ym .pkg .pr small{display:block;margin-top:8px;font-size:.78rem;font-family:var(--mono);font-weight:400;letter-spacing:0;color:var(--muted)}
.ym .pkg ul{margin:0;padding:0;list-style:none;display:grid;gap:7px;color:#2a2823;font-size:.97rem}
.ym .pkg li:before{content:"+ ";font-family:var(--mono);color:var(--sig)}
.ym .pkg .cut{border-top:1.5px dashed var(--ink);margin-top:auto;padding-top:10px;display:flex;justify-content:space-between}
.ym .pkg.hot{background:var(--sig);color:#fff;border-color:var(--sig)}
.ym .pkg.hot ul,.ym .pkg.hot .pr small{color:#ffffffc8}
.ym .pkg.hot li:before{color:#fff}
.ym .pkg.hot .cut{border-color:#fff}
.ym .pkg.hot .btn{background:#fff;color:var(--sig)}
.ym .rv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,4vw,50px)}
.ym .rv blockquote{margin:0;border-top:1px solid var(--ink);padding-top:20px}
.ym .rv q{display:block;quotes:none;font-family:var(--serif);font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.1;letter-spacing:-.01em}
.ym .rv cite{display:block;margin-top:16px;font-style:normal}
.ym .stars{color:var(--sig);letter-spacing:3px;margin-bottom:12px}
.ym.faq details{border-top:1px solid var(--line);padding:20px 0}
.ym.faq details:last-child{border-bottom:1px solid var(--line)}
.ym.faq summary{cursor:pointer;list-style:none;font-size:clamp(1.2rem,2.2vw,1.7rem);font-weight:500;letter-spacing:-.02em;display:flex;justify-content:space-between;gap:20px}
.ym.faq summary::-webkit-details-marker{display:none}
.ym.faq summary:after{content:"+";font-family:var(--mono)}
.ym.faq details[open] summary:after{content:"–"}
.ym.faq p{margin:12px 0 0;color:#2a2823;max-width:62ch;font-size:1.04rem}
.ym.cta{background:var(--sig);color:#fff}
.ym.cta h2{color:#fff;font-size:clamp(2.8rem,8vw,7.6rem)}
.ym.cta h2 em{color:#fff}
.ym.cta .q{max-width:640px;margin-top:30px}
.ym.cta .q .btn{margin-left:auto;background:var(--sig);color:#fff;border-radius:99px;padding:12px 18px;white-space:nowrap}
.ym.cta .contact{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px}
.ym .apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ym .app{display:flex;flex-direction:column;gap:8px;text-decoration:none;border:1px solid var(--ink);background:var(--bone);padding:14px 14px 18px}
.ym .app .ai{aspect-ratio:4/4.3;overflow:hidden;background:var(--soft);border-radius:4px 4px 0 0;display:flex;justify-content:center;padding:14px 18px 0}
.ym .app .ai img{width:100%;object-fit:cover;object-position:top;border-radius:14px 14px 0 0;border:4px solid var(--ink);border-bottom:0;display:block;background:#fff}
.ym .app h3{font-size:1.9rem;letter-spacing:-.04em;margin-top:6px}
.ym .app p{margin:0;color:#2a2823;font-size:.98rem;flex:1}
.ym .app .go{color:var(--sig);margin-top:6px}
.ym .app:hover .ai img{transform:translateY(-6px)}
.ym .app .ai img{transition:transform .3s}
@media(max-width:900px){.ym .apps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.ym .apps{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.ym .app{animation:rise linear both;animation-timeline:view();animation-range:entry calc(0% + var(--i,0)*7%) entry calc(50% + var(--i,0)*7%)}
.ym .app:nth-child(1){--i:0}
.ym .app:nth-child(2){--i:1}
.ym .app:nth-child(3){--i:2}
.ym .app:nth-child(4){--i:3}}}
.ym .prog{position:fixed;left:0;top:0;height:3px;width:100%;background:var(--sig);transform:scaleX(0);transform-origin:0 50%;z-index:60}
@media (prefers-reduced-motion:no-preference){@keyframes loadUp{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.ym .hero h1{animation:loadUp .9s cubic-bezier(.2,.7,.2,1) .1s both}
.ym .hero .sub,.ym .hero .row{animation:loadUp .9s cubic-bezier(.2,.7,.2,1) .3s both}
.ym .hero .r{animation:loadUp 1s cubic-bezier(.2,.7,.2,1) .2s both}
@supports (animation-timeline:view()){@keyframes grow{to{transform:scaleX(1)}}
.ym .prog{animation:grow linear both;animation-timeline:scroll(root)}
@keyframes rise{from{opacity:0;transform:translateY(54px)}to{opacity:1;transform:none}}
@keyframes slideL{from{opacity:0;transform:translateX(-80px)}to{opacity:1;transform:none}}
@keyframes slideR{from{opacity:0;transform:translateX(80px)}to{opacity:1;transform:none}}
@keyframes unclip{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes zoomIn{from{opacity:.2;transform:scale(.78)}to{opacity:1;transform:none}}
@keyframes parA{from{transform:translateY(90px) rotate(-3deg)}to{transform:translateY(-50px) rotate(0)}}
@keyframes parB{from{transform:translateY(20px) rotate(3deg)}to{transform:translateY(-90px) rotate(0)}}
@keyframes act{0%{opacity:.62}35%{opacity:1}65%{opacity:1}100%{opacity:.7}}
@keyframes scissors{from{transform:translateX(-220px)}to{transform:none}}
@keyframes line{from{width:0}to{width:100%}}
@keyframes drift{from{transform:translateX(0)}to{transform:translateX(-14%)}}
.ym .lab{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 40%}
.ym h2{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
.ym .fam p.big,.ym .fam .btn{animation:rise linear both;animation-timeline:view();animation-range:entry 10% entry 60%}
.ym .sug li{animation:slideR linear both;animation-timeline:view();animation-range:entry calc(5% + var(--i,0)*9%) entry calc(45% + var(--i,0)*9%)}
.ym .sug li:nth-child(1){--i:0}
.ym .sug li:nth-child(2){--i:1}
.ym .sug li:nth-child(3){--i:2}
.ym .sug li:nth-child(4){--i:3}
.ym .phones .ph:nth-child(1){animation:parA linear both;animation-timeline:view();animation-range:cover 0% cover 70%}
.ym .phones .ph:nth-child(2){animation:parB linear both;animation-timeline:view();animation-range:cover 0% cover 70%}
.ym .num{animation:rise linear both;animation-timeline:view();animation-range:entry 5% entry 50%}
.ym .step{animation:act linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.ym .step h3{display:inline-block;transform-origin:0 100%}
.ym .work a{animation:slideL linear both;animation-timeline:view();animation-range:entry 0% entry 50%}
.ym .work img{animation:unclip linear both;animation-timeline:view();animation-range:entry 10% entry 70%}
.ym .pkg{animation:rise linear both;animation-timeline:view();animation-range:entry calc(0% + var(--i,0)*7%) entry calc(50% + var(--i,0)*7%)}
.ym .pkg:nth-child(1){--i:0}
.ym .pkg:nth-child(2){--i:1}
.ym .pkg:nth-child(3){--i:2}
.ym .pkg:nth-child(4){--i:3}
.ym .pkg .cut span:last-child{display:inline-block;animation:scissors linear both;animation-timeline:view();animation-range:entry 40% cover 60%}
.ym .rv blockquote{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
.ym .rv blockquote:nth-child(2){animation-range:entry 12% entry 67%}
.ym.faq details{animation:slideL linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
.ym.cta h2{animation:zoomIn linear both;animation-timeline:view();animation-range:entry 0% entry 90%;transform-origin:0 100%}
.ym.cta .q{animation:rise linear both;animation-timeline:view();animation-range:entry 30% entry 90%}
.ym .tick div{animation-duration:38s}}}
@media (hover:hover){.ym .work a:hover .n{transform:translateX(10px)}
.ym .work .n{transition:transform .3s}
.ym .pkg{transition:transform .25s,box-shadow .25s}
.ym .pkg:hover{transform:translateY(-6px);box-shadow:0 26px 40px -26px #000a}}
.ym .app .ai{aspect-ratio:auto;height:auto;padding:26px 0 26px;border-radius:4px;background:var(--soft);display:flex;justify-content:center;overflow:visible}
.ym .app:hover .ai img{transform:none}
.ym .sheet>.in{transform:none!important;opacity:calc(1 - var(--c,0)*.12)}
.ym .pk{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.ym .pkg{padding:26px 24px}
@media(max-width:1100px){.ym .pk{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.ym .pk{grid-template-columns:minmax(0,1fr)}}
.ym .ipw{container-type:inline-size;width:min(64%,172px)}
.ym .ip{position:relative;width:100%;aspect-ratio:9/19.5;padding:2.5cqw;background:#030304;border-radius:15cqw;box-shadow:0 0 0 .8cqw #8d8d94,0 0 0 1.1cqw #2b2b30,0 7cqw 9cqw -4cqw #000a}
.ym .ip::before{content:"";position:absolute;top:3.3cqw;left:50%;width:29cqw;height:8.4cqw;margin-left:-14.5cqw;background:#000;border-radius:5cqw;z-index:2}
.ym .ip::after{content:"";position:absolute;left:-1.9cqw;top:19%;width:.9cqw;height:5.5%;background:#6a6a71;border-radius:1cqw 0 0 1cqw;box-shadow:0 7.4cqw 0 #6a6a71,0 -4.4cqw 0 #6a6a71,calc(100cqw + 1.9cqw) 4cqw 0 #6a6a71}
.ym .app .ai .ip img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:12.4cqw;border:0;display:block;background:#fff;transition:none}
@media(max-width:900px){.ym .pk{display:flex;flex-direction:column;align-items:stretch;gap:16px;width:100%}
.ym .pk>.pkg{display:flex;flex-direction:column;width:100%;max-width:none;min-width:0;flex:0 0 auto;align-self:stretch;box-sizing:border-box;margin:0}}
html.lite .ym .rvz,html.lite .ym .rvz.in{will-change:auto!important}/* section backgrounds exactly as in the approved mock */
main.yd-sheets>section#problems,main.yd-sheets>section#services,main.yd-sheets>section#process,main.yd-sheets>section#pricing,main.yd-sheets>section#faq{background:var(--bg)!important}
main.yd-sheets>section#work,main.yd-sheets>section#apps{background:#fff!important}
main.yd-sheets>section#reviews{background:#E4E6F4!important}
.tick{background:var(--ink);color:var(--bg);overflow:hidden;white-space:nowrap;padding:14px 0;position:relative;z-index:3}
.tick div{display:inline-block;animation:ymq 38s linear infinite}.tick span{margin:0 22px}.tick i{font-style:normal;color:#6f7bff}
@keyframes ymq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.tick div{animation:none}}
/* phones: work list becomes stacked cards, nothing squeezed */
@media(max-width:700px){
 .ym .work a{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"img img" "n k" "t t";gap:10px 12px;padding:18px 0 22px;align-items:baseline}
 .ym .work a img{grid-area:img;width:100%;aspect-ratio:16/10;border-radius:10px;margin-bottom:6px}
 .ym .work .k{grid-area:k;justify-self:end}
 .ym .work .n{grid-area:n;font-size:clamp(1.7rem,8vw,2.2rem)}
 .ym .work .t{grid-area:t;display:block;line-height:1.5}
 .ym .work a:hover{padding-inline:0;background:none}
 .ym .sv{padding:20px 0}
 .ym .sv .n{font-size:1.7rem}
}
/* phone and tablet rules carried over from the approved mock */
@media(max-width:900px){
 .ym .pg{grid-template-columns:minmax(0,1fr)}.ym .pg>*{min-width:0}
 .ym .step{grid-template-columns:44px minmax(0,1fr);gap:8px 14px}.ym .step>p{grid-column:2}
 .ym .rv{grid-template-columns:1fr}
 .ym .apps{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ym .phones{gap:12px}.ym .phones .ph{width:min(46%,220px)}
 .yh-pgrid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:560px){
 .ym .apps{grid-template-columns:minmax(0,1fr)}
 .ym .num b{font-size:clamp(2.4rem,13vw,3.6rem)}
 .ym h2{font-size:clamp(2rem,9vw,2.6rem)}
 .ym.cta h2{font-size:clamp(2.4rem,12vw,3.2rem)}
 .ym.cta .q .t{white-space:normal}
 .ym .lab{flex-wrap:wrap}
 .ym .sv{grid-template-columns:30px minmax(0,1fr)}
 .yh-sug a{padding:16px 14px}
 .yh-sug .tx{font-size:.95rem}
}
/* ChatGPT proof: thin iPhone frames instead of the thick pill */
.ym .phones{display:flex;gap:clamp(14px,3vw,30px);justify-content:center;align-items:flex-start}
.ym .phones .ipw{width:min(44%,230px)}
.ym .phones .ipw+.ipw{margin-top:44px}
.ym .ip img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:12.4cqw;border:0;display:block;background:#fff}
@media(max-width:560px){.ym .phones .ipw{width:46%}.ym .phones .ipw+.ipw{margin-top:30px}}
/* three ChatGPT screenshots in thin iPhone frames */
.ym .phones.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2.4vw,26px);align-items:start;margin-top:34px}
.ym .phones.trio figure{margin:0;display:grid;gap:12px;justify-items:center}
.ym .phones.trio .ipw{width:min(100%,210px)}
.ym .phones.trio .ipw+.ipw{margin-top:0}
.ym .phones.trio figure:nth-child(2){margin-top:34px}
.ym .phones.trio figcaption{display:grid;gap:4px;text-align:center;max-width:24ch}
.ym .phones.trio figcaption b{font-size:1rem;letter-spacing:-.02em}
.ym .phones.trio figcaption span{font-family:var(--mono);font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;opacity:.85;line-height:1.4}
.ym .pg.wide{grid-template-columns:minmax(0,1fr)}
@media(max-width:900px){
 .ym .phones.trio{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:18px;margin-inline:calc(-1 * clamp(16px,3vw,34px));padding:6px clamp(16px,3vw,34px) 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .ym .phones.trio::-webkit-scrollbar{display:none}
 .ym .phones.trio figure{flex:0 0 62%;scroll-snap-align:center}
 .ym .phones.trio figure:nth-child(2){margin-top:0}
 .ym .phones.trio .ipw{width:100%}
 .ym .phones.trio figcaption span{font-size:.76rem}
}
.trio-hint{display:none;text-align:center;opacity:.8;margin:2px 0 0}
@media(max-width:900px){.trio-hint{display:block}}
/* homepage work list: plain one-line description, then what we did */
.ym .work .t{display:grid;gap:6px;text-transform:none;letter-spacing:0;font-family:var(--sans);font-size:1rem;line-height:1.35;color:#2a2823}
.ym .work .t .d1{display:block}
.ym .work .t .d2{display:block;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);line-height:1.45}
@media(max-width:700px){.ym .work .t .d2{font-size:.76rem}}

/* Contact form in the homepage CTA sheet */
.ym.cta .cf{display:grid;gap:12px}
.ym.cta .cf-row{display:grid;gap:6px;min-width:0}
.ym.cta .cf label{font-family:var(--mono);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:#121212;overflow-wrap:anywhere}
.ym.cta .cf input,.ym.cta .cf textarea{width:100%;min-width:0;font:inherit;font-size:16px;color:#121212;background:#fff;border:1.5px solid #121212;border-radius:14px;padding:13px 14px;box-sizing:border-box}
.ym.cta .cf textarea{resize:vertical;min-height:96px}
.ym.cta .cf input:focus,.ym.cta .cf textarea:focus{outline:3px solid var(--sig);outline-offset:2px}
.ym.cta .cf .btn{justify-self:start;margin:0;min-height:48px;cursor:pointer;border:0;font:inherit;font-family:var(--mono)}
.ym.cta .cf .btn[disabled]{opacity:.6;cursor:wait}
.ym.cta .cf-note{margin:0;color:#b00020;font-size:.95rem}
.ym.cta .cf-ok{font-family:var(--mono);line-height:1.6;overflow-wrap:anywhere}
.ym.cta .cf-ok a{color:var(--sig)}
@media(max-width:900px){.ym.cta .cf .btn{justify-self:stretch}}
.ym.cta .cf-priv{margin:0;font-size:.85rem;color:#3f3b35}.ym.cta .cf-priv a{color:var(--sig)}