@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+JP:wght@400;500;600;700&display=swap');
:root{--ink:#66545d;--soft:#8b7980;--bg:#fbf8f5;--rose:#edccd4;--lilac:#e8ddec;--accent:#bd8293;--cream:#f6eae4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font-family:'DM Sans','Noto Sans JP',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}.shell{max-width:1180px;margin:0 auto;padding:0 34px}.header{height:96px;display:flex;align-items:center;justify-content:space-between}.logo{font-size:25px;font-weight:700;letter-spacing:-1.5px}.logo>span{color:var(--accent);margin-left:3px}.logo small{display:block;font-size:9px;letter-spacing:2px;font-weight:600;color:#a49398;margin-top:2px}.header nav{display:flex;align-items:center;gap:34px;font-size:13px}.contact-nav{border:1px solid #d6b9c2;border-radius:40px;padding:12px 22px}.hero{min-height:600px;display:grid;grid-template-columns:1.06fr 1fr;align-items:center;gap:45px;padding-top:30px;padding-bottom:70px}.pill{display:inline-block;background:#f4e7e9;color:#a57987;font-size:11px;letter-spacing:1.5px;padding:12px 19px;border-radius:40px}.hero h1{font-size:clamp(35px,3.8vw,58px);font-weight:600;line-height:1.5;letter-spacing:-1.9px;margin:30px 0 25px}.hero em,h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:#be8796}.hero p{line-height:2.35;font-size:15px;color:var(--soft)}.hero-links{display:flex;align-items:center;gap:24px;margin-top:35px}.button{background:#ba8798;color:#fff;display:inline-flex;align-items:center;justify-content:center;gap:20px;border-radius:45px;padding:18px 29px;font-size:14px;box-shadow:0 9px 24px #a77a8b28;transition:.25s}.button:hover{background:#a87586;transform:translateY(-2px)}.text-link{font-size:13px;border-bottom:1px solid #c7a6b2;padding-bottom:6px}.hero-images{display:grid;grid-template-columns:1fr 1fr;gap:20px;position:relative;padding:25px}.hero-card{min-width:0;transform:rotate(-6deg);padding:9px 9px 22px;background:#fff;border-radius:140px 140px 18px 18px;box-shadow:0 18px 35px #8a68701c}.hero-card.offset{transform:rotate(7deg) translateY(43px)}.hero-card img{width:100%;height:340px;object-fit:cover;border-radius:130px 130px 12px 12px}.hero-card span{display:block;font-size:10px;letter-spacing:1.8px;text-align:center;margin-top:12px;color:#ab929c}.floating-star{position:absolute;top:6px;right:5px;font-size:55px;color:#d8bbc7}.section{padding-top:110px;padding-bottom:105px}.section-top{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:35px}.eyebrow{letter-spacing:2.5px;color:#b28d9c;font-size:11px;font-weight:700;margin:0 0 15px}h2{font-size:clamp(35px,4vw,56px);letter-spacing:-1.9px;font-weight:600;line-height:1.3;margin:0}.section-intro{font-size:13px;line-height:2.1;color:#97858b}.filter-bar{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:28px}.filter{border:1px solid #e9d6db;background:transparent;border-radius:30px;color:#937e87;padding:10px 20px;font-size:12px}.filter.active{background:#c28f9f;color:white;border-color:#c28f9f}.filter span{margin-left:8px}.works-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}.work{min-width:0}.work[hidden]{display:none}.cover{padding:0;border:0;display:block;position:relative;width:100%;height:400px;border-radius:20px;overflow:hidden;background:var(--lilac);text-align:left}.cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s}.cover:hover img{transform:scale(1.055)}.cover:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#0005);pointer-events:none}.cover-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;width:58px;height:58px;background:#ffffffdb;color:#a77a8b;font-size:20px;z-index:2;padding-left:3px}.cover-tag{position:absolute;bottom:17px;left:18px;z-index:2;color:#fff;font-size:10px;letter-spacing:1.7px}.work-text{display:flex;justify-content:space-between;gap:15px;margin-top:14px}.work-text h3{font-size:17px;font-weight:600;margin:0 0 6px}.work-text p{font-size:12px;line-height:1.6;color:#a28f97;margin:0}.work-number{font-family:Georgia,serif;font-style:italic;color:#c5a3ad}.small-note{color:#a28f97;font-size:12px;margin-top:30px}.soft-section{padding:108px 0;background:#f4e9eb}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px;margin-top:48px}.service-grid>div{padding:32px 30px;background:#ffffffa6;border-radius:20px;min-height:220px}.service-grid span{color:#c391a4;font-size:28px}.service-grid h3{font-size:17px;margin:18px 0 12px}.service-grid p{font-size:13px;line-height:2;color:#947e88}.about{display:grid;grid-template-columns:1fr 1fr;gap:90px}.about-decoration{display:inline-block;margin-top:60px;background:#eee0e7;color:#a37e8d;border-radius:100px;padding:35px 52px;transform:rotate(-9deg);font-size:12px;letter-spacing:2px}.about-decoration i{font-size:23px;font-family:Georgia,serif;letter-spacing:0}.about-body{padding-top:40px}.about-body h3{font-size:19px}.about-body p{font-size:14px;line-height:2.45;color:#84747a}.tool-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.tool-list span{border:1px solid #e7d4da;border-radius:24px;padding:9px 13px;color:#987f8b;font-size:11px}.contact{background:linear-gradient(120deg,#eedbe3,#f2e6e9 50%,#e9dfee);padding:95px 0;text-align:center}.contact h2{margin:18px 0 18px}.contact-content>p:not(.eyebrow){color:#866e7a;font-size:14px}.contact .button{margin-top:20px}.contact .contact-note{font-size:10px!important;margin-top:24px;color:#9f8a92!important}.footer{display:flex;justify-content:space-between;padding-top:26px;padding-bottom:27px;font-size:11px;color:#ad98a2}#video-modal{background:#fdf9f7;border:0;border-radius:22px;color:var(--ink);padding:22px;max-width:min(520px,94vw);width:100%;max-height:95vh;box-shadow:0 30px 100px #52384950}#video-modal::backdrop{background:#322a33bc}.modal-inner{text-align:center}.modal-eyebrow{color:#be8796;letter-spacing:2px;font-size:10px;margin-bottom:10px}#modal-title{font-size:20px;margin-bottom:18px}#modal-player{display:block;max-width:100%;width:auto;height:min(66vh,740px);margin:0 auto;border-radius:12px;background:#181818}#modal-caption{color:#8e7b83;font-size:12px;line-height:1.7;margin-bottom:0}.modal-close{position:absolute;right:12px;top:8px;background:transparent;border:0;font-size:29px;color:#886c79}button:focus-visible,a:focus-visible{outline:3px solid #bd8293;outline-offset:4px}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:10px}.hero-images{max-width:560px;margin:0 auto}.works-grid{grid-template-columns:repeat(2,1fr)}.about{gap:30px}.cover{height:390px}}@media(max-width:600px){.shell{padding-left:20px;padding-right:20px}.header{height:82px}.header nav{gap:13px;font-size:11px}.header nav a:nth-child(2),.header nav a:nth-child(3){display:none}.contact-nav{padding:10px 13px}.hero{padding-top:35px;padding-bottom:40px}.hero h1{font-size:35px}.hero p{font-size:13px}.hero-images{padding:12px}.hero-card img{height:230px}.section{padding-top:65px;padding-bottom:70px}.section-top{display:block}.section-intro{margin-top:15px}.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 12px}.cover{height:255px;border-radius:12px}.cover-play{width:42px;height:42px;font-size:14px}.cover-tag{font-size:8px;left:9px;bottom:11px}.work-text h3{font-size:13px}.work-text p{font-size:10px}.work-number{display:none}.filter{padding:9px 12px;font-size:11px}.service-grid{grid-template-columns:1fr;gap:13px}.service-grid>div{min-height:0}.soft-section{padding:70px 0}.about{grid-template-columns:1fr;gap:0}.about-decoration{display:none}.about-body{padding-top:5px}.contact{padding:75px 0}.contact h2{font-size:32px}#modal-player{height:min(64vh,620px)}}

.drive-cover{background:linear-gradient(145deg,#f5dfe6 0%,#e6d5ed 48%,#cedbdb 100%);color:#956f85}.drive-art{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.drive-symbol{font-size:50px;color:#b286a1;line-height:1}.drive-label{font-family:Georgia,serif;font-size:clamp(28px,3vw,43px);line-height:1.2;letter-spacing:2px;margin-top:16px}.drive-sub{font-size:10px;letter-spacing:2px;margin-top:20px}.drive-cover .cover-play{background:#fffef1e8}.drive-cover .cover-tag{color:white}#drive-player{width:min(420px,80vw);height:min(66vh,680px);border:0;margin:0 auto;border-radius:12px;background:#181818}#drive-player[hidden]{display:none!important}#modal-player[hidden]{display:none!important}@media(max-width:600px){.drive-label{font-size:23px}.drive-symbol{font-size:30px}.drive-sub{font-size:7px}}

/* About portrait */
.about-photo{margin:30px 0 0;max-width:435px;padding:12px 12px 18px;background:#fffdfb;border:1px solid #f0e3e3;border-radius:26px;box-shadow:0 18px 40px rgba(158,112,132,.12);transform:rotate(-2deg)}
.about-photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:17px}
.about-photo figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:1.1px;color:#af8a98;padding:15px 6px 0;font-weight:600}
.about-body{align-self:center;padding-top:0}
@media(max-width:600px){.about-photo{max-width:360px;margin:28px auto 30px;transform:rotate(-1deg)}.about-body{padding-top:0}.about-photo figcaption{font-size:8px}}

/* Additional work inquiry notice */
.more-works-note{display:flex;align-items:center;gap:19px;margin:30px 0 0;padding:24px 28px;border:1px solid #ecdfe2;border-radius:24px;background:linear-gradient(110deg,#faf1f2,#f7f4f0);color:#715d67}.more-works-icon{font-size:28px;color:#c691a5;flex:none}.more-works-note>div{flex:1}.more-works-note strong{font-size:16px;font-weight:700}.more-works-note p{font-size:13px;line-height:1.9;margin:8px 0 0}.more-works-link{white-space:nowrap;color:#996e82;border-bottom:1px solid #bd91a2;text-decoration:none;font-size:12px;font-weight:700;padding-bottom:4px}@media(max-width:740px){.more-works-note{align-items:flex-start;flex-wrap:wrap;padding:21px;gap:13px}.more-works-link{margin-left:38px;white-space:normal}.more-works-note p br{display:none}}

/* ===== iOS / Android compatibility fixes (2026-10) ===== */
/* Use an SVG icon, not U+2733 which can render as a green emoji on iOS. */
.sparkle{display:inline-block;vertical-align:-0.09em;width:1em;height:1em;flex:0 0 auto;background-color:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 4 L58 38 L91 18 L69 48 L96 50 L69 57 L88 86 L58 66 L50 97 L42 66 L12 86 L31 57 L4 50 L31 43 L12 18 L42 38 Z' fill='black'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M50 4 L58 38 L91 18 L69 48 L96 50 L69 57 L88 86 L58 66 L50 97 L42 66 L12 86 L31 57 L4 50 L31 43 L12 18 L42 38 Z' fill='black'/%3E%3C/svg%3E") center/contain no-repeat}
.logo>.sparkle{color:var(--accent);margin-left:5px;width:.75em;height:.75em}
.floating-star .sparkle{display:block}
.more-works-icon .sparkle{display:block}
.about-photo figcaption .sparkle{width:.8em;height:.8em}
/* Desktop notice: 2-column grid with text occupying all available space. */
.more-works-note{display:grid;grid-template-columns:32px minmax(0,1fr);grid-template-areas:'icon content' '. link';align-items:start;column-gap:18px;row-gap:12px}
.more-works-note>.more-works-icon{grid-area:icon;min-width:0}
.more-works-note>div{grid-area:content;min-width:0;max-width:100%}
.more-works-note strong{display:block;overflow-wrap:anywhere;line-height:1.65}
.more-works-note p{overflow-wrap:anywhere;word-break:normal;line-break:strict}
.more-works-note>.more-works-link{grid-area:link;justify-self:start;white-space:normal;overflow-wrap:anywhere;margin:0}
@media(min-width:900px){.more-works-note{grid-template-columns:32px minmax(0,1fr) auto;grid-template-areas:'icon content link';align-items:center}.more-works-note>.more-works-link{white-space:nowrap}}
@media(max-width:740px){.more-works-note{display:block;padding:22px 20px;margin-top:30px;border-radius:20px}.more-works-icon{display:block;margin-bottom:12px;font-size:24px}.more-works-note>div{display:block;width:100%;min-width:0}.more-works-note strong{font-size:16px;line-height:1.65}.more-works-note p{font-size:13px;line-height:1.95;margin-top:10px;white-space:normal}.more-works-note>.more-works-link{display:inline-block;margin:19px 0 0;font-size:13px;line-height:1.65;max-width:100%}}