:root{
  --bg:#fffdf0; --ink:#744438; --brown:#9a7467; --green:#476b55; --yellow:#f1f75d;
  --pink:#f5c7c7; --lilac:#cbb7f1; --blue:#c8d6f1; --sage:#cbd9b9;
  --serif: Georgia, 'Times New Roman', serif; --sans:'Noto Sans JP',sans-serif; --latin:'DM Sans',sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.75} img{display:block;max-width:100%} a{color:inherit;text-decoration:none} button{font:inherit}.container{width:min(1120px,calc(100% - 48px));margin:auto}.section-pad{padding:76px 0}.center{text-align:center}.sp-only{display:none}
.site-header{height:66px;background:rgba(255,253,240,.96);display:flex;align-items:center;justify-content:space-between;padding:0 6vw;position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(116,68,56,.08)}
.brand,.desktop-nav a{font-family:var(--latin);letter-spacing:.22em}.brand{font-size:15px;font-weight:500}.desktop-nav{display:flex;gap:48px}.desktop-nav a{font-size:12px}.desktop-nav a[aria-current="page"]{border-bottom:1px solid var(--ink)}
.menu-button{display:none;width:46px;height:46px;border:0;background:none;padding:10px;cursor:pointer}.menu-button span{display:block;height:2px;background:var(--ink);margin:6px 0}.mobile-menu{position:fixed;inset:0 0 0 auto;width:min(62vw,540px);background:var(--green);z-index:100;transform:translateX(110%);transition:transform .35s ease;color:#fff}.mobile-menu.is-open{transform:none}.menu-scrim{position:fixed;inset:0;background:rgba(0,0,0,.18);z-index:90}.mobile-menu-inner{height:100%;display:flex;flex-direction:column;padding:64px 58px 40px}.mobile-menu-title{font:700 42px/1 var(--latin);color:var(--yellow);margin:20px 0 40px}.mobile-menu nav{display:grid}.mobile-menu nav a{font:500 25px var(--latin);letter-spacing:.18em;padding:20px 0;border-bottom:2px dotted rgba(241,247,93,.7)}.menu-close{position:absolute;right:28px;top:24px;width:42px;height:42px;background:none;border:0;cursor:pointer}.menu-close:before,.menu-close:after{content:"";position:absolute;left:20px;top:3px;width:1px;height:38px;background:#fff}.menu-close:before{transform:rotate(45deg)}.menu-close:after{transform:rotate(-45deg)}.menu-contact{margin-top:auto;align-self:center;width:230px}.menu-contact img{width:100%;height:auto}
.hero{position:relative;height:min(610px,58vw);min-height:440px;overflow:hidden;background:#5b4037}.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-video-sp{display:none}
.patterned-section{background-color:var(--bg);background-image:url('../assets/top_backgraund.png');background-repeat:repeat-y;background-position:center top;background-size:100% auto}.intro-grid,.worry-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:center}.intro-grid{margin-bottom:58px}.worry-grid{grid-template-columns:1.1fr 1fr}.eyebrow{font:500 18px var(--latin);letter-spacing:.28em;margin:0 0 8px}.intro-copy h2,.worry-copy h2,.connect-copy h2{font-size:30px;line-height:1.5;letter-spacing:.08em;margin:0 0 18px}.intro-copy p,.worry-copy li,.connect-copy p{font-size:15px}.card-image img{width:100%;border-radius:22px;aspect-ratio:16/9;object-fit:cover}.worry-copy ul{padding-left:1.35em;margin:12px 0}.connect-copy{margin-top:62px}.connect-copy .quote{margin:24px 0 8px}.services-home{background:var(--bg)}.service-icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:55px 70px}.mini-service{text-align:center}.mini-service img{width:154px;height:88px;object-fit:contain;margin:0 auto 10px}.mini-service h3{font-size:16px;letter-spacing:.16em;margin:4px 0 8px}.mini-service p{font-size:12px;line-height:1.7;margin:0}.text-link{display:inline-block;margin-top:44px;font:600 12px var(--latin);letter-spacing:.16em;border-bottom:1px solid var(--ink);padding-bottom:3px}.flow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px}.flow-image img{width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid rgba(116,68,56,.45)}.flow-step{font:500 11px var(--latin);letter-spacing:.12em;color:#8d766f;margin:10px 0 2px}.flow-card h3{font-size:18px;margin:0}.flow-card p:last-child{font-size:12px;line-height:1.8}.contact{background:#f0f764;padding:24px 0 10px}.contact-grid{display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px}.profile{display:flex;align-items:center;gap:24px}.profile>img{width:92px;height:92px;object-fit:cover;border-radius:50%}.profile-name{font-weight:700;margin:0}.profile-brand{font:600 17px var(--latin);letter-spacing:.22em;margin:2px 0 4px}.profile p:last-child{font-size:11px;line-height:1.6}.contact-cta{display:block;width:260px}.contact-cta img{width:100%}.instagram-handle{text-align:center;font:500 11px var(--latin);letter-spacing:.08em;margin:2px 0}
.sub-main{min-height:calc(100vh - 66px);padding-bottom:80px}.sub-hero{padding-top:52px}.sub-hero h1{font:600 25px var(--latin);letter-spacing:.28em;background:var(--yellow);width:min(390px,80%);padding:8px 24px;text-align:center;border-radius:0 999px 999px 0;margin-left:calc((100vw - min(1120px,calc(100vw - 48px)))/-2);padding-left:max(24px,calc((100vw - min(1120px,calc(100vw - 48px)))/2))}.service-list{display:grid;gap:95px;padding:65px 0}.service-block{width:min(680px,100%);margin:auto;text-align:center}.service-block>img{width:190px;margin:0 auto -15px;position:relative;z-index:2}.service-box{border:1px solid rgba(116,68,56,.55);padding:24px 34px 24px;text-align:left;position:relative}.service-box h2{display:inline-block;background:#e1ebe5;padding:4px 18px;font-size:18px;letter-spacing:.12em;position:absolute;top:-20px;left:50%;transform:translateX(-50%);white-space:nowrap;margin:0}.service-box h2 span{font-family:var(--latin)}.service-box ul{margin:14px 0 0;padding-left:1.4em;font-size:15px}.sample-page{min-height:calc(100vh - 66px)}.coming-soon{min-height:68vh;display:grid;place-items:center}.coming-soon p{font-size:25px;letter-spacing:.3em;color:var(--green);font-weight:600}
@media (max-width: 820px){
  .container{width:min(100% - 34px,680px)}.section-pad{padding:48px 0}.desktop-nav{display:none}.menu-button{display:block}.site-header{height:52px;padding:0 18px}.brand{font-size:12px}.mobile-menu{width:70vw}.mobile-menu-inner{padding:56px 30px 28px}.mobile-menu-title{font-size:34px}.mobile-menu nav a{font-size:19px;padding:16px 0}.menu-contact{width:170px}
  .hero{height:calc(100vh - 52px);min-height:560px;max-height:820px}.hero-video-pc{display:none}.hero-video-sp{display:block}.sp-only{display:block}
  .intro-grid,.worry-grid{grid-template-columns:1fr;gap:28px}.intro-grid{margin-bottom:36px}.worry-grid .card-image{order:2}.worry-copy{order:1}.intro-copy h2,.worry-copy h2,.connect-copy h2{font-size:24px}.eyebrow{font-size:15px}.intro-copy p,.worry-copy li,.connect-copy p{font-size:13px}.connect-copy{margin-top:42px}.service-icon-grid{grid-template-columns:repeat(2,1fr);gap:34px 22px}.mini-service img{width:110px;height:70px}.mini-service h3{font-size:13px}.mini-service p{font-size:10.5px}.flow-grid{grid-template-columns:1fr;gap:26px}.flow-card{display:grid;grid-template-columns:38% 1fr;grid-template-rows:auto auto 1fr;column-gap:18px}.flow-image{grid-row:1/4}.flow-step{margin:0}.flow-card h3{font-size:16px}.flow-card p:last-child{font-size:11px;margin-top:4px}.contact-grid{grid-template-columns:1fr auto;gap:12px}.profile{gap:10px}.profile>img{width:54px;height:54px}.profile-brand{font-size:12px}.profile p:last-child{font-size:8px}.contact-cta{width:120px}.instagram-handle{font-size:9px}
  .sub-main{min-height:calc(100vh - 52px)}.sub-hero{padding-top:28px}.sub-hero h1{font-size:21px;width:78%;margin-left:-17px;padding-left:40px}.service-list{padding:48px 0;gap:75px}.service-block{width:86%}.service-block>img{width:150px}.service-box{padding:26px 24px 18px}.service-box h2{font-size:14px}.service-box ul{font-size:13px}.coming-soon{min-height:73vh}.coming-soon p{font-size:20px}
}
@media (max-width: 430px){.service-icon-grid{gap:28px 12px}.mini-service p{font-size:9px}.profile p:last-child{display:none}.contact-grid{grid-template-columns:1fr 108px}.mobile-menu{width:72vw}}


/* Interactive polish */
.hero-video{transition:opacity .7s ease, transform 1.2s ease;opacity:0;transform:scale(1.008)}
.hero-video.is-ready{opacity:1;transform:scale(1)}

.brand,.desktop-nav a,.text-link,.contact-cta,.menu-contact,.mini-service,.flow-card,.service-block{transition:opacity .22s ease,transform .22s ease,filter .22s ease}
@media (hover:hover) and (pointer:fine){
  .brand:hover,.desktop-nav a:hover,.text-link:hover{opacity:.58}
  .desktop-nav a:hover{transform:translateY(-1px)}
  .mini-service:hover{transform:translateY(-5px)}
  .mini-service:hover img{filter:brightness(1.04)}
  .flow-card:hover{transform:translateY(-4px)}
  .flow-card:hover .flow-image img{filter:brightness(1.04)}
  .service-block:hover{transform:translateY(-4px)}
  .contact-cta:hover,.menu-contact:hover{opacity:.82;transform:translateY(-2px)}
  .menu-button:hover{opacity:.62}
}

.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}
.reveal.reveal-left{transform:translateX(-18px)}
.reveal.reveal-right{transform:translateX(18px)}
.reveal.is-visible{opacity:1;transform:none}
.service-icon-grid .mini-service.reveal:nth-child(2),.service-icon-grid .mini-service.reveal:nth-child(5){transition-delay:.08s}
.service-icon-grid .mini-service.reveal:nth-child(3),.service-icon-grid .mini-service.reveal:nth-child(6){transition-delay:.16s}
.flow-grid .flow-card.reveal:nth-child(2){transition-delay:.08s}
.flow-grid .flow-card.reveal:nth-child(3){transition-delay:.16s}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1!important;transform:none!important}
  .hero-video{opacity:1!important;transform:none!important}
}

/* SAMPLE page */
.sample-content{padding:55px 0 90px}.sample-web-head{width:min(850px,100%);margin:0 auto 54px}.sample-web-head h2,.sample-video h2{text-align:center;font-size:18px;letter-spacing:.14em;margin:0 0 25px}.sample-web-head h2 span,.sample-video h2 span{font-family:var(--latin);letter-spacing:.28em}.sample-price-list{width:min(540px,100%);margin:0 auto 24px}.sample-price-list div{display:flex;justify-content:space-between;gap:24px;font-size:14px;line-height:1.8}.sample-price-list b{font-weight:500;white-space:nowrap}.sample-web-head>p{text-align:center;font-size:12px;line-height:2}.sample-site-card{width:min(900px,100%);margin:0 auto 62px;padding:0 42px 38px;background:rgba(203,217,185,.72);text-align:center;position:relative}.sample-site-card h3{display:inline-block;transform:translateY(-14px);margin:0;background:#f5c7c7;border-radius:999px;padding:5px 34px;font-size:15px;letter-spacing:.1em;font-weight:500}.sample-site-card>p{font-size:12px;line-height:1.8;margin:-2px 0 8px}.sample-open,.sample-insta{display:inline-block;font-size:12px;letter-spacing:.12em;border-bottom:1px solid var(--ink);padding:2px 6px;margin:0 0 25px}.sample-shots{display:flex;align-items:flex-start;justify-content:center;gap:42px;flex-wrap:wrap}.nail-shots img:first-child{width:48%}.nail-shots img:last-child{width:25%}.burger-shots{display:grid;grid-template-columns:repeat(6,1fr);gap:20px;align-items:start}.burger-shots img:nth-child(-n+3){grid-column:span 2}.burger-shots img:nth-child(n+4){grid-column:span 1}.sample-video{width:min(850px,100%);margin:85px auto 0}.sample-video-box{border:1px solid rgba(116,68,56,.55);padding:24px 34px;text-align:left}.sample-video-box h3{font:500 14px var(--latin);letter-spacing:.16em;margin:0 0 8px}.sample-video-box p{font-size:12px;line-height:1.8;margin:0 0 12px}.sample-insta{display:block;width:max-content;margin:18px auto 0}
@media(max-width:820px){.sample-content{padding-top:40px}.sample-web-head h2,.sample-video h2{font-size:15px}.sample-price-list{width:88%}.sample-price-list div{font-size:12px}.sample-web-head>p{font-size:10px}.sample-site-card{width:92%;padding:0 18px 26px;margin-bottom:50px}.sample-site-card h3{font-size:12px;padding:5px 18px}.sample-site-card>p{font-size:10px}.sample-shots{gap:18px}.nail-shots img:first-child{width:58%}.nail-shots img:last-child{width:28%}.burger-shots{grid-template-columns:repeat(4,1fr);gap:10px}.burger-shots img:nth-child(-n+3){grid-column:span 2}.burger-shots img:nth-child(n+4){grid-column:span 1}.sample-video{width:92%;margin-top:65px}.sample-video-box{padding:20px}.sample-video-box p{font-size:10px}}


/* SAMPLE: keep each responsive view visually grouped */
.burger-view-groups{display:grid;gap:28px;margin-top:2px}
.sample-view-group{width:min(760px,100%);margin:0 auto}
.sample-view-label{width:max-content;margin:0 auto 12px;padding:3px 16px;border-radius:999px;background:rgba(255,255,255,.58);font:500 10px var(--latin);letter-spacing:.2em}
.burger-pc-shots{display:grid;grid-template-columns:1.18fr .91fr .91fr;gap:14px;align-items:start;width:min(650px,100%);margin:auto}
.burger-pc-shots img,.burger-sp-shots img{width:100%;min-width:0}
.burger-sp-shots{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;align-items:start;width:min(500px,82%);margin:auto}

/* Desktop hover interactions */
.sample-site-card,.sample-shots img,.sample-open,.sample-insta,.service-box{transition:transform .25s ease,opacity .25s ease,filter .25s ease,box-shadow .25s ease}
@media (hover:hover) and (pointer:fine){
  .sample-site-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(76,67,55,.08)}
  .sample-shots img:hover{transform:translateY(-5px) scale(1.015);filter:brightness(1.025);box-shadow:0 8px 20px rgba(76,67,55,.12)}
  .sample-open:hover,.sample-insta:hover{opacity:.58;transform:translateY(-1px)}
  .service-block:hover .service-box{box-shadow:0 10px 24px rgba(76,67,55,.07)}
}
@media(max-width:820px){
  .burger-view-groups{gap:22px}
  .sample-view-label{font-size:9px;margin-bottom:9px}
  .burger-pc-shots{gap:7px;width:100%}
  .burger-sp-shots{gap:7px;width:88%}
}

/* SERVICE introduction */
.service-intro{width:min(680px,calc(100% - 48px));margin:20px auto 0;text-align:left;color:var(--ink)}
.service-intro h2{display:table;margin:0 auto 16px;background:#e1ebe5;padding:4px 18px;font-size:18px;line-height:1.45;letter-spacing:.14em;font-weight:600}
.service-intro p{margin:0 0 7px;font-size:14px;line-height:1.9;letter-spacing:.055em}
.service-intro + .service-list{padding-top:48px}
@media (max-width:820px){
  .service-intro{width:86%;margin-top:18px}
  .service-intro h2{font-size:14px;margin-bottom:13px;padding:4px 13px}
  .service-intro p{font-size:12px;line-height:1.85;letter-spacing:.035em}
  .service-intro + .service-list{padding-top:42px}
}