:root{--cream:#fff8ec;--belly:#fffdf7;--fur:#f8e4b4;--spot:#d99a4e;--choc:#3f2414;--choc-soft:#6b4a35;--blush:#f7c9c1;--bow:#7c5cc4;--bow-soft:#e6dcf8;--yellow:#f7d35c;--line:2px solid var(--choc);--shadow:4px 4px 0 var(--choc);--shadow-sm:3px 3px 0 var(--choc);--radius:12px;--font:"Bricolage Grotesque", system-ui, sans-serif}*{box-sizing:border-box}body{background:var(--cream);color:var(--choc);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.5}img{max-width:100%;display:block}a{color:inherit}ul{margin:0;padding:0;list-style:none}h1,h2{letter-spacing:-.035em;margin:0;font-weight:800;line-height:1.02}h1{font-size:clamp(2rem,4vw,3rem)}h2{margin-bottom:18px;font-size:clamp(1.4rem,2.4vw,1.8rem)}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.wrap{width:100%;max-width:1600px;margin:0 auto;padding:0 40px}:focus-visible{outline:3px solid var(--bow);outline-offset:4px;border-radius:8px}.header{background:var(--cream);border-bottom:var(--line)}.header-inner{grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding-top:8px;padding-bottom:8px;display:grid}.header-left{justify-self:start}.logo{letter-spacing:-.04em;justify-self:center;align-items:center;gap:12px;font-size:1.4rem;font-weight:800;text-decoration:none;display:flex}.social-icons{justify-self:end;gap:8px;display:flex}.social-icons a{border:var(--line);background:var(--belly);width:42px;height:42px;color:var(--choc);border-radius:50%;place-items:center;transition:transform .12s,box-shadow .12s,background .12s;display:grid}.social-icons a:hover{background:var(--fur);box-shadow:var(--shadow-sm);transform:translate(-2px,-2px)}.logo-img{width:auto;height:92px;transition:transform .2s;display:block}.logo:hover .logo-img{transform:rotate(-3deg)scale(1.04)}.logo-avatar{border:var(--line);object-fit:cover;border-radius:50%;width:40px;height:40px}.nav{flex-wrap:wrap;gap:8px;display:flex}.nav a{border:var(--line);background:var(--belly);border-radius:999px;align-items:center;min-height:42px;padding:0 18px;font-size:.95rem;font-weight:700;text-decoration:none;display:inline-flex}.nav a:hover{background:var(--fur)}.nav a[aria-current=page]{background:var(--choc);color:var(--fur)}.nav .nav-cta{background:var(--yellow)}.marquee{background:var(--choc);color:var(--fur);padding:8px 0;overflow:hidden}.marquee-track{width:max-content;animation:45s linear infinite slide;display:flex}.marquee span{text-transform:uppercase;letter-spacing:.08em;white-space:nowrap;padding-right:24px;font-size:.85rem;font-weight:700}.marquee i{color:var(--spot);padding-left:24px;font-style:normal}@keyframes slide{to{transform:translate(-50%)}}.work-section{padding-top:28px;padding-bottom:64px}.work-grid{grid-template-columns:repeat(4,1fr);grid-auto-flow:dense;gap:32px 24px;display:grid}.work-card{text-align:left;width:100%;color:inherit;font:inherit;cursor:pointer;background:0 0;border:0;padding:0;display:block}.thumb video{object-fit:cover;width:100%;height:100%;display:block}.flip{perspective:1400px;aspect-ratio:3/4}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.7,.2,1);position:relative}.is-flipped .flip-inner{transform:rotateY(180deg)}.face{backface-visibility:hidden;border:var(--line);border-radius:var(--radius);box-shadow:var(--shadow);position:absolute;inset:0;overflow:hidden}.front{background:var(--fur);cursor:pointer;font:inherit;color:inherit;padding:0;transition:box-shadow .15s,translate .15s}.front:hover{box-shadow:6px 6px 0 var(--choc);translate:-2px -2px}.front video{object-fit:cover;width:100%;height:100%;display:block}.flip-hint{background:var(--belly);border:1.5px solid var(--choc);opacity:0;border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:700;transition:opacity .15s;position:absolute;bottom:10px;right:10px}.front:hover .flip-hint,.front:focus-visible .flip-hint{opacity:1}@media (hover:none){.flip-hint{opacity:1}}.back{background:var(--belly);cursor:pointer;flex-direction:column;gap:10px;padding:14px;display:flex;overflow-y:auto;transform:rotateY(180deg)}.back-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.back .details-date{font-size:.85rem}.back .details-x{width:36px;height:36px;font-size:1rem}.back-desc{color:var(--choc-soft);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:.9rem;line-height:1.4;display:-webkit-box;overflow:hidden}.back .details-stats{gap:6px}.back .details-stats li{padding:6px 10px}.back .details-stats strong{font-size:1.05rem}.back .details-stats span{font-size:.78rem}.back .details-stats .details-rate strong{font-size:1.6rem}.back-btn{width:100%;min-height:40px;margin-top:auto;font-size:.9rem}.work-item .work-title{margin-top:12px}.details-top{justify-content:space-between;align-items:center;gap:12px;display:flex}.details-date{color:var(--bow);margin:0;font-weight:700}.details-x{border:var(--line);background:var(--cream);width:40px;height:40px;color:var(--choc);font:800 1rem var(--font);cursor:pointer;border-radius:50%;flex:none}.details-x:hover{background:var(--fur)}.details-desc{color:var(--choc-soft);margin:10px 0 16px;font-size:1rem}.details-stats{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.details-stats li{background:var(--cream);border:1.5px solid var(--choc);border-radius:12px;flex-direction:column;padding:8px 12px;display:flex}.details-stats strong{letter-spacing:-.03em;font-size:1.15rem;font-weight:800;line-height:1.1}.details-stats span{color:var(--choc-soft);font-size:.85rem}.details-stats .details-rate{background:var(--yellow);grid-column:1/-1}.details-stats .details-rate strong{font-size:1.8rem}.details-stats .details-rate span{color:var(--choc);font-weight:700}.details-btn{width:100%;margin-top:16px}.work-hint{color:var(--choc-soft);margin:0 0 20px;font-size:.95rem}.thumb{aspect-ratio:3/4;border:var(--line);border-radius:var(--radius);background:var(--fur);box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s;position:relative;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;transition:transform .3s}.work-card:hover .thumb{box-shadow:6px 6px 0 var(--choc);transform:translate(-2px,-2px)}.work-card:hover .thumb img{transform:scale(1.03)}.views{background:var(--choc);color:var(--fur);border-radius:999px;padding:3px 10px;font-size:.8rem;font-weight:700;position:absolute;bottom:10px;left:10px}.work-title{margin-top:12px;font-size:1.05rem;font-weight:600;line-height:1.35;display:block}.about{max-width:1200px;padding-top:40px;padding-bottom:64px}.about h1{margin-bottom:18px;font-size:clamp(1.4rem,2.4vw,1.8rem)}.about-me p{max-width:62ch;color:var(--choc-soft);margin:0 0 12px;font-size:1.05rem}.about-me p:first-of-type{color:var(--choc);font-size:1.25rem;font-weight:500;line-height:1.5}.about-intro{grid-template-columns:340px 1fr;align-items:center;gap:56px;display:grid}.frame{border:var(--line);border-radius:var(--radius);box-shadow:10px 10px 0 var(--choc);background:#f1f0ee;overflow:hidden}.frame img{aspect-ratio:4/5;object-fit:cover;object-position:center 20%;width:100%}.frame-tilt{transform:rotate(-2deg)}.badge{background:var(--choc);color:var(--fur);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;margin:0 0 18px;padding:6px 16px;font-size:.85rem;font-weight:700;display:inline-block}.lead{max-width:36ch;color:var(--choc-soft);margin:20px 0 0;font-size:1.3rem}.btn-row{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}.btn{border:var(--line);min-height:46px;box-shadow:var(--shadow-sm);font:700 .95rem var(--font);color:var(--choc);border-radius:10px;justify-content:center;align-items:center;padding:0 22px;text-decoration:none;transition:transform .12s,box-shadow .12s;display:inline-flex}.btn:hover{box-shadow:var(--shadow);transform:translate(-2px,-2px)}.btn-yellow{background:var(--yellow)}.btn-white{background:var(--belly)}.btn-big{word-break:break-all;min-height:56px;padding:0 28px;font-size:1.1rem}.about-block{margin-top:56px}.card{background:var(--belly);border:var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.stat-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.stat{flex-direction:column;gap:6px;display:flex}.stat strong{letter-spacing:-.04em;font-size:clamp(1.8rem,3vw,2.4rem);font-weight:800;line-height:1}.stat span{font-size:.95rem}.stat-grid li:first-child{background:var(--fur)}.stat-grid li:nth-child(2){background:var(--blush)}.stat-grid li:nth-child(3){background:var(--bow-soft)}.stat-grid li:nth-child(4){background:var(--yellow)}.note{color:var(--choc-soft);max-width:60ch;margin:22px 0 0}.brand-grid{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.brand{align-self:start;padding:0}.brand-head{width:100%;font:inherit;color:inherit;text-align:left;cursor:pointer;border-radius:var(--radius);background:0 0;border:0;align-items:center;gap:18px;padding:20px;display:flex}.brand-head:hover{background:var(--fur)}.brand-logo{object-fit:contain;flex:none;width:auto;max-width:150px;height:40px}.brand-chevron{margin-left:auto;font-size:1.2rem;transition:transform .2s}.brand.is-open .brand-chevron{transform:rotate(180deg)}.brand.is-open .brand-head{border-bottom:1.5px dashed var(--spot);border-radius:var(--radius) var(--radius) 0 0}.brand-drop{padding:18px 20px 22px;animation:.3s ease-out drop-down}@keyframes drop-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}.brand-drop-body{grid-template-columns:160px 1fr;align-items:start;gap:18px;display:grid}.brand-video{aspect-ratio:9/16;object-fit:cover;border:var(--line);background:var(--choc);border-radius:10px;width:100%}.brand-stat{color:var(--choc-soft);font-size:.95rem}.footer{border-top:var(--line);flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;padding-bottom:20px;font-size:.9rem;font-weight:600;display:flex}@media (width<=1200px){.work-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=1000px){.header-inner{grid-template-columns:1fr;justify-items:center;gap:14px}.logo{order:-1}.header-left,.social-icons{justify-self:center}}@media (width<=960px){.work-grid{grid-template-columns:repeat(2,1fr)}.about-intro{grid-template-columns:1fr;gap:40px}.about-intro .frame{max-width:320px}.stat-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.wrap{padding:0 16px}.nav{justify-content:center}.logo-img{height:76px}.nav a{padding:0 18px}.work-grid{gap:28px 16px}.work-title{font-size:.95rem}.brand-grid{grid-template-columns:1fr}.brand-drop-body{grid-template-columns:110px 1fr;gap:12px}.stat-grid{gap:14px}.card{padding:20px}.btn-big{width:100%;padding:0 20px;font-size:1rem}}@media (width<=420px){.work-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.marquee-track,.brand-drop{animation:none}.flip-inner,*{transition:none!important}}
