:root {
  --bg:      #FAFAFA;
  --bg2:     #F5F5F5;
  --bg3:     #E9EAEE;
  --line:    rgba(27,34,48,0.1);
  --text:    #1B2230;
  --muted:   rgba(27,34,48,0.68);
  --accent:  #1B2230;
  --white:   #FAFAFA;
  --surface: #FEFEFE;
  --card-shadow: 0 2px 14px rgba(27,34,48,.05);
  --serif:   'Shippori Mincho B1', serif;
  --display: 'Fraunces', serif;
  --mono:    'DM Mono', monospace;
  --sans:    'Zen Kaku Gothic New', sans-serif;
  --nav-h:   72px;
  --ease:    cubic-bezier(0.16,1,0.3,1);
  --ease-enter: cubic-bezier(0,0,0.2,1);
  --ease-exit:  cubic-bezier(0.4,0,1,1);
  --motion-fast: 140ms;
  --motion-base: 220ms;
  --motion-slow: 320ms;
  --content: 1180px;
  --gutter:  clamp(40px,6vw,96px);
  --side:    max(var(--gutter), calc((100% - var(--content)) / 2));
  --section-space:         120px;
  --section-space-compact:  60px;
  --section-space-large:   150px;
}
@media(max-width:1279px){:root{--section-space:96px;--section-space-compact:48px;--section-space-large:120px;}}
@media(max-width:1023px){:root{--section-space:80px;--section-space-compact:40px;--section-space-large:100px;}}
@media(max-width:751px) {:root{--section-space:64px;--section-space-compact:32px;--section-space-large: 80px;}}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;font-size:16px;}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-weight:400;line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;height:auto;}
ul{list-style:none;}

.skip-link{position:fixed;top:12px;left:12px;z-index:1000;background:var(--text);color:var(--white);padding:10px 16px;font-weight:600;transform:translateY(-160%);transition:transform var(--motion-fast) linear;}
.skip-link:focus{transform:translateY(0);}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;}
:focus-visible{outline:3px solid #D97706;outline-offset:3px;}
#main-content:focus{outline:none;}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(40px,6vw,96px);z-index:100;transition:background .4s var(--ease),border-color .4s;border-bottom:1px solid transparent;}
nav.scrolled{background:rgba(250,250,250,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--line);}
.nav-logo{font-family:var(--display);font-size:1.1rem;letter-spacing:.08em;font-weight:400;color:var(--text);transition:color .4s;white-space:nowrap;}
nav.scrolled .nav-logo{color:var(--text);}
.nav-links{display:flex;gap:40px;align-items:center;}
.nav-links a{font-family:var(--sans);font-size:.95rem;letter-spacing:.03em;color:var(--muted);transition:color .3s,text-shadow .3s;font-weight:400;white-space:nowrap;}
nav.scrolled .nav-links a{color:var(--muted);}
.nav-links a:hover{color:var(--text);}
nav.scrolled .nav-links a:hover{color:var(--text);}
.nav-cta{font-family:var(--mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;border:1px solid rgba(27,34,48,.35);color:var(--text)!important;padding:8px 20px;min-height:48px;display:inline-flex;align-items:center;box-sizing:border-box;transition:background .3s,color .3s,border-color .3s!important;white-space:nowrap;}
.nav-cta:hover{background:var(--text);color:var(--white)!important;}
nav.scrolled .nav-cta{border-color:rgba(27,34,48,.35)!important;color:var(--text)!important;}
nav.scrolled .nav-cta:hover{background:var(--text)!important;color:var(--white)!important;}
nav.scrolled .nav-hamburger span{background:var(--text);}
.nav-hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:none;cursor:pointer;padding:4px;z-index:200;flex-shrink:0;}
.nav-hamburger span{display:block;width:100%;height:1px;background:var(--text);transition:transform .35s var(--ease),opacity .35s;}

.nav-hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);}
.nav-hamburger.open span:nth-child(2){opacity:0;}
.nav-hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);}
body.nav-open{overflow:hidden;}

/* NAV DARK (Philosophy連動) */
nav.nav-dark{background:rgba(27,34,48,.96)!important;border-bottom-color:rgba(255,255,255,.12)!important;}
nav.nav-dark .nav-logo{color:var(--white);}
nav.nav-dark .nav-logo-sub{color:rgba(255,255,255,.45);}
nav.nav-dark .nav-links a{color:rgba(255,255,255,.65);}
nav.nav-dark .nav-links a:hover{color:var(--white);}
nav.nav-dark .nav-cta{border-color:rgba(255,255,255,.45)!important;color:var(--white)!important;}
nav.nav-dark .nav-cta:hover{background:var(--white)!important;color:var(--text)!important;}
nav.nav-dark .nav-hamburger span{background:var(--white);}

/* REVEAL */
.reveal{opacity:0;transition:opacity .5s var(--ease-enter);}
.reveal.visible{opacity:1;}
.reveal-delay-1{transition-delay:.1s;}
.reveal-delay-2{transition-delay:.2s;}
.reveal-delay-3{transition-delay:.3s;}
.reveal-delay-4{transition-delay:.4s;}

/* SECTION BASE */
.section-label{font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;display:flex;align-items:center;gap:16px;}
.section-label::before{content:'';width:40px;height:1px;background:var(--muted);opacity:.5;}
.section-title{font-family:var(--serif);font-size:clamp(1.8rem,3.5vw,3rem);font-weight:400;line-height:1.4;}

/* HERO */
#hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:0 clamp(40px,6vw,96px) 80px;overflow:hidden;}
#vanta-bg{position:absolute;inset:0;z-index:0;background:#888C96;}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(246,247,250,.92) 0%,rgba(229,230,234,.42) 26%,rgba(85,90,100,.18) 52%,var(--text) 100%);z-index:1;}
.hero-content-panel{--hero-notch-start:28%;--hero-notch-slope:52px;--hero-notch-depth:7%;position:relative;z-index:2;width:auto;margin:0 calc(-1 * var(--gutter)) -80px;padding:52px var(--gutter) 40px;background:linear-gradient(to bottom,transparent 48%,var(--text) 100%),linear-gradient(135deg,rgba(71,77,90,.5),rgba(22,28,40,.46));backdrop-filter:blur(30px) saturate(.48) contrast(.94);-webkit-backdrop-filter:blur(30px) saturate(.48) contrast(.94);clip-path:polygon(0 0,var(--hero-notch-start) 0,calc(var(--hero-notch-start) + var(--hero-notch-slope)) var(--hero-notch-depth),100% var(--hero-notch-depth),100% 100%,0 100%);}
.hero-headline{font-family:var(--serif);font-size:clamp(2.2rem,3.4vw,2.8rem);font-weight:400;line-height:1.5;letter-spacing:.01em;max-width:700px;margin-bottom:16px;color:var(--white);position:relative;}
.hero-headline .line{display:block;overflow:hidden;}
.hero-headline .line-inner{display:inline-block;opacity:0;transform:translateX(-14px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter);}
.hero-headline .line-inner.visible{opacity:1;transform:translateX(0);}
.hero-sub{font-size:.9rem;color:rgba(255,255,255,.86);max-width:564px;line-height:1.9;margin-bottom:20px;opacity:0;transform:translateX(-14px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter);position:relative;font-weight:400;}
.hero-sub.visible{opacity:1;transform:translateX(0);}
.hero-services{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;position:relative;}
.svc-tag{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.35);padding:5px 12px;opacity:0;transition:opacity .45s var(--ease-enter);}
.hero-services.visible .svc-tag{opacity:1;}
.hero-services.visible .svc-tag:nth-child(2){transition-delay:.05s;}
.hero-services.visible .svc-tag:nth-child(3){transition-delay:.10s;}
.hero-services.visible .svc-tag:nth-child(4){transition-delay:.15s;}
.hero-services.visible .svc-tag:nth-child(5){transition-delay:.20s;}
.hero-services.visible .svc-tag:nth-child(6){transition-delay:.25s;}
.hero-bottom{display:flex;align-items:center;gap:16px;position:relative;}
.hero-bottom a{opacity:0;transform:translateX(-12px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter),background .2s,color .2s,border-color .2s;}
.hero-bottom.visible a{opacity:1;transform:translateX(0);}
.hero-bottom.visible a:nth-child(2){transition-delay:.14s;}
.btn-primary{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;background:var(--text);color:var(--white);padding:0 28px;min-height:48px;border:none;cursor:pointer;box-sizing:border-box;transition:background 180ms ease,color 180ms ease,opacity 180ms ease;}
.btn-primary:hover{background:rgba(27,34,48,.82);}
.btn-primary:active{background:rgba(27,34,48,.95);}
.btn-primary:focus-visible{outline:2px solid var(--text);outline-offset:3px;}
.btn-primary svg{transition:transform 180ms ease;flex-shrink:0;}
.btn-primary:hover svg{transform:translateX(3px);}
.hero-bottom .btn-primary{background:var(--white);color:var(--text);}
.hero-bottom .btn-primary:hover{opacity:.82;}
.hero-bottom .btn-primary:active{opacity:.72;}
.hero-bottom .btn-primary:focus-visible{outline:2px solid var(--white);outline-offset:3px;}
.hero-bottom .btn-secondary{border:1px solid rgba(255,255,255,.6);color:var(--white);background:transparent;padding:0 28px;}
.hero-bottom .btn-secondary:hover{border-color:rgba(255,255,255,1);background:rgba(255,255,255,.28);color:var(--white);}
.hero-bottom .btn-secondary:active{background:rgba(255,255,255,.2);}
.hero-bottom .btn-secondary:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:3px;}
.btn-hero{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;background:var(--white);color:var(--text);padding:0 28px;min-height:56px;cursor:pointer;box-sizing:border-box;text-decoration:none;transition:opacity 180ms ease;}
.btn-hero:hover{opacity:.82;}
.btn-hero:active{opacity:.70;}
.btn-hero:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:3px;}
.btn-hero svg{transition:transform 180ms ease;flex-shrink:0;}
.btn-hero:hover svg{transform:translateX(3px);}
.hero-scroll{position:absolute;right:48px;bottom:52px;display:flex;flex-direction:column;align-items:center;gap:12px;opacity:0;animation:fadeIn 1s 1.5s forwards;z-index:3;}
.hero-scroll span{font-family:var(--mono);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(255,255,255,.76);writing-mode:vertical-rl;}
.scroll-line{width:1px;height:72px;background:rgba(255,255,255,.28);position:relative;overflow:hidden;}
.scroll-line::after{content:'';position:absolute;top:-100%;left:0;width:100%;height:55%;background:rgba(255,255,255,.94);animation:scrollLine 2s 1.5s infinite;}
@keyframes scrollLine{0%{top:-100%;}100%{top:200%;}}
@keyframes fadeIn{to{opacity:1;}}

/* WORKS */
#works{padding:var(--section-space) var(--side);background:var(--bg);scroll-margin-top:calc(var(--nav-h) + 24px);}
#approach{padding:var(--section-space) var(--side);background:var(--bg2);}
.w-case{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start;margin-bottom:120px;max-width:1180px;}
.w-case:last-child{margin-bottom:0;}
.w-case.reverse .case-img{order:2;}
.w-case.reverse .case-body{order:1;}
.case-img{position:relative;width:100%;overflow:hidden;background:var(--bg3);}
.case-img:has(.case-ph){aspect-ratio:4/3;}
.case-img img{width:100%;height:auto;display:block;transition:transform .5s var(--ease-enter);}
.w-case:hover .case-img img{transform:scale(1.03);}
.case-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);}
.case-ph span{font-family:var(--mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;}
.case-num{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;color:var(--muted);margin-bottom:16px;display:flex;align-items:center;gap:12px;}
.case-num::after{content:'';width:28px;height:1px;background:var(--muted);}
.case-tag{font-family:var(--mono);font-size:.7rem;color:var(--muted);letter-spacing:.12em;margin-bottom:8px;text-transform:uppercase;}
.case-title{font-family:var(--serif);font-size:clamp(1.2rem,1.6vw,1.5rem);font-weight:400;line-height:1.7;color:var(--text);letter-spacing:.02em;margin-bottom:32px;}
.case-challenge-label{font-family:var(--mono);font-size:.68rem;letter-spacing:.18em;color:var(--muted);margin-bottom:8px;}
.case-challenge{font-size:1rem;color:var(--muted);line-height:1.95;margin-bottom:36px;}
.verdict{border-left:2px solid var(--text);padding:6px 0 6px 24px;margin-bottom:32px;}
.verdict-label{font-family:var(--mono);font-size:.68rem;letter-spacing:.18em;color:var(--muted);margin-bottom:8px;}
.verdict-text{font-family:var(--serif);font-size:clamp(1rem,1.2vw,1.15rem);font-weight:400;line-height:1.85;color:var(--text);letter-spacing:.02em;}
.logic-toggle{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);font-weight:400;cursor:pointer;background:none;border:none;padding:8px 0;border-bottom:1px solid var(--line);transition:border-color .35s var(--ease);}
.logic-toggle:hover{border-bottom-color:var(--text);}
.logic-toggle .chev{width:9px;height:9px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .35s var(--ease);}
.logic-toggle[aria-expanded="true"] .chev{transform:rotate(-135deg);margin-top:2px;}
.logic-content{max-height:0;overflow:hidden;opacity:0;transition:max-height 1s var(--ease),opacity .8s var(--ease);}
.logic-content[data-open="true"]{max-height:800px;opacity:1;}
.logic-grid{padding-top:32px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.logic-item{border-top:1px solid var(--line);padding-top:20px;}
.logic-num{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;color:var(--muted);margin-bottom:8px;}
.logic-title{font-family:var(--serif);font-size:.95rem;font-weight:400;color:var(--text);margin-bottom:8px;}
.logic-desc{font-size:.95rem;color:var(--muted);line-height:1.9;}
.w-placeholder{color:var(--muted);}
/* 実績ページ専用：制作ロジックを VERDICT の下に全幅3カラムで常時表示（INDEXは折りたたみのまま） */
.case-detailed{max-width:1180px;margin:0 auto 120px;}
.case-detailed:last-child{margin-bottom:0;}
.case-detailed .w-case{margin-bottom:0;}
.case-logic{margin-top:48px;padding-top:40px;border-top:1px solid var(--line);}
.case-logic-label{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:20px;display:flex;align-items:center;gap:14px;}
.case-logic-label::after{content:'';flex:1;height:1px;background:var(--line);}
.case-logic .logic-grid{padding-top:0;}
/* INDEX works section: logic-toggle / logic-content span full grid width */
.w-case > .logic-toggle{order:3;grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:40px;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.w-case > .logic-toggle:hover{border-bottom-color:var(--text);}
.w-case > .logic-content{order:3;grid-column:1 / -1;}
@media(max-width:1024px){
  .w-case{grid-template-columns:1fr;gap:32px;margin-bottom:72px;}
  .w-case.reverse .case-img{order:1;}
  .w-case.reverse .case-body{order:2;}
  .case-img{display:flex;justify-content:center;align-items:center;}
  .case-img img{max-height:60vh;width:auto;max-width:100%;}
  .logic-grid{grid-template-columns:1fr;gap:24px;}
  .case-detailed{margin-bottom:72px;}
  .case-logic{margin-top:32px;padding-top:32px;}
  .w-case > .logic-toggle{margin-top:0;}
}
.works-groups{margin-top:48px;border-top:1px solid var(--line);}
.works-group{display:grid;grid-template-columns:280px 1fr;gap:48px;padding:40px 0;border-bottom:1px solid var(--line);}
.works-group-head{display:flex;flex-direction:column;gap:8px;align-self:start;}
.works-group-num{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:var(--muted);}
.works-group-en{font-family:var(--mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);}
.works-group-name{font-family:var(--serif);font-size:1.35rem;font-weight:400;line-height:1.4;}
.works-list{display:grid;grid-template-columns:repeat(2,1fr);gap:0 48px;align-self:start;}
.works-link{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none;transition:color .3s,padding .3s;}
.works-link:hover{padding-left:6px;}
.works-link-title{font-family:var(--serif);font-size:1rem;}
.works-link-arrow{flex-shrink:0;opacity:.45;transition:transform .3s,opacity .3s;}
.works-link:hover .works-link-arrow{transform:translateX(4px);opacity:1;}
@media(max-width:864px){
  .works-group{grid-template-columns:1fr;gap:20px;padding:36px 0;}
  .works-list{grid-template-columns:1fr;gap:0;}
}

/* TRACK RECORD */
#stats{--stats-bg-split:62%;position:relative;margin-top:-12px;padding:160px clamp(40px,6vw,96px) 104px;background:linear-gradient(to bottom,var(--text) 0%,var(--text) var(--stats-bg-split),var(--bg) var(--stats-bg-split),var(--bg) 100%);}
#stats::before{content:'';position:absolute;top:-12px;left:0;right:0;height:24px;background:var(--text);pointer-events:none;}
.stats-shell{position:relative;z-index:1;max-width:1180px;margin:0 auto;}
.stats-head{display:block;margin-bottom:48px;color:var(--white);opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter);}
.stats-heading-copy{display:flex;flex-direction:column;gap:16px;}
.stats-kicker{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.55);display:flex;align-items:center;gap:16px;}
.stats-kicker::before{content:'';width:40px;height:1px;background:rgba(255,255,255,.4);flex-shrink:0;}
.stats-title{font-family:var(--serif);font-size:clamp(1.65rem,2.8vw,2.6rem);font-weight:400;line-height:1.45;max-width:650px;}
.stats-inner{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch;padding:16px;background:#F0F1F4;border:1px solid rgba(27,34,48,.08);}
.stat-item{padding:24px 20px;display:grid;grid-template-columns:1fr 72px;grid-template-rows:auto auto auto;gap:0 12px;position:relative;background:var(--surface);border:1px solid rgba(27,34,48,.1);box-shadow:var(--card-shadow);opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease-enter),transform .5s var(--ease-enter);}
.stat-label{grid-column:1;grid-row:1;font-family:var(--sans);font-size:1rem;font-weight:500;letter-spacing:.02em;color:var(--text);margin-bottom:8px;align-self:start;}
.stat-icon{grid-column:2;grid-row:1/3;width:72px;height:72px;object-fit:contain;opacity:.7;mix-blend-mode:multiply;align-self:center;}
.stat-num-block{grid-column:1;grid-row:2;display:flex;align-items:baseline;gap:4px;margin-bottom:16px;white-space:nowrap;}
.stat-count{font-family:var(--serif);font-size:clamp(2.4rem,3.5vw,3.2rem);font-weight:600;line-height:1;letter-spacing:0;color:var(--muted);}
.stat-unit{font-family:var(--sans);font-size:.9rem;font-weight:400;color:var(--muted);padding-bottom:3px;}
.stat-context{grid-column:1/3;grid-row:3;font-family:var(--sans);font-size:.78rem;font-weight:400;letter-spacing:.01em;color:var(--muted);line-height:1.8;border-top:1px solid var(--line);padding-top:16px;}
#stats.stats-visible .stats-head{opacity:1;transform:translateY(0);}
#stats.stats-visible .stat-item{opacity:1;transform:translateY(0);}
#stats.stats-visible .stat-item:nth-child(1){transition-delay:.05s;}
#stats.stats-visible .stat-item:nth-child(2){transition-delay:.10s;}
#stats.stats-visible .stat-item:nth-child(3){transition-delay:.15s;}
#stats.stats-visible .stat-item:nth-child(4){transition-delay:.20s;}


/* LOGO STRIP (あしらい) */
#logo-strip{background:var(--bg);overflow:hidden;padding:0 0 48px;}
.logo-marquee{overflow:hidden;}
.logo-track{display:flex;width:max-content;animation:logoMarquee 60s linear infinite;}
.logo-set{display:flex;align-items:center;gap:0;}
.logo-item{width:172px;height:72px;display:flex;align-items:center;justify-content:center;padding:12px 28px;}
.logo-item img{width:100%;height:100%;object-fit:contain;opacity:.9;mix-blend-mode:multiply;transition:opacity .3s,filter .3s;}
.logo-item:hover img{opacity:1;}
.logo-marquee:hover .logo-track{animation-play-state:paused;}
@keyframes logoMarquee{to{transform:translateX(-50%);}}

.works-more{margin-top:32px;display:flex;align-items:center;justify-content:space-between;padding:24px 28px;border:1px solid var(--line);background:var(--bg2);}
.works-more p{font-size:.9375rem;color:var(--muted);}
.btn-secondary{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;background:transparent;color:var(--text);border:1px solid var(--text);padding:0 28px;min-height:48px;cursor:pointer;box-sizing:border-box;transition:background 180ms ease,color 180ms ease,border-color 180ms ease;}
.btn-secondary:hover{background:var(--text);color:var(--white);border-color:var(--text);}
.btn-secondary:active{background:rgba(27,34,48,.9);color:var(--white);}
.btn-secondary:focus-visible{outline:2px solid var(--text);outline-offset:3px;}
.btn-secondary svg{transition:transform 180ms ease;flex-shrink:0;}
.btn-secondary:hover svg{transform:translateX(3px);}

/* SERVICE */
#service{padding:var(--section-space) var(--side);background:var(--bg);}
.service-footer{margin-top:24px;}
.service-footer p{font-size:.9375rem;color:var(--muted);margin-bottom:16px;}

/* PHILOSOPHY */
#philosophy{position:relative;overflow:hidden;padding:var(--section-space) var(--side);color:var(--white);}
#philosophy::before{content:'';position:absolute;inset:0;background:var(--text);clip-path:inset(100% 0 0 0);transition:clip-path .6s var(--ease-enter);z-index:0;}
#philosophy.bg-on::before{clip-path:inset(0 0 0 0);}
.philo-inner{position:relative;z-index:1;}
.philo-label{font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:40px;display:inline-flex;align-items:center;gap:16px;}
.philo-label::before{content:'';width:32px;height:1px;background:rgba(255,255,255,.4);}
.philo-headline{font-family:var(--serif);font-size:clamp(2rem,3.5vw,3rem);font-weight:400;line-height:1.55;color:var(--white);letter-spacing:.04em;margin-bottom:40px;}
.philo-sub{font-family:var(--serif);font-size:clamp(1.05rem,1.4vw,1.3rem);color:rgba(255,255,255,.85);line-height:1.85;margin-bottom:32px;letter-spacing:.04em;}
.philo-sub em{font-style:normal;color:var(--white);border-bottom:1px solid rgba(255,255,255,.35);padding-bottom:2px;}
.philo-body{font-family:var(--sans);font-size:1rem;font-weight:300;line-height:2.1;color:rgba(255,255,255,.68);letter-spacing:.02em;max-width:720px;margin-bottom:72px;}
.philo-body p{margin-bottom:1.5em;}
.philo-body p:last-child{margin-bottom:0;}
.philo-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.philo-card{border:1px solid rgba(255,255,255,.18);padding:40px 34px;display:flex;flex-direction:column;}
.philo-card-head{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;}
.philo-card-num{font-family:var(--display);font-size:2.1rem;font-weight:300;color:rgba(255,255,255,.4);line-height:1;}
.philo-card-meta{border-left:1px solid rgba(255,255,255,.2);padding-left:24px;}
.philo-card-en{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:10px;}
.philo-card-ja{font-family:var(--serif);font-size:clamp(1.2rem,1.5vw,1.45rem);font-weight:400;color:var(--white);letter-spacing:.04em;}
.philo-card-desc{font-size:.9rem;font-weight:300;color:rgba(255,255,255,.72);line-height:1.95;margin-top:28px;padding-top:26px;border-top:1px solid rgba(255,255,255,.14);}
.philo-capstone{margin-top:64px;font-family:var(--serif);font-size:clamp(1.15rem,1.7vw,1.5rem);font-weight:400;line-height:1.95;color:var(--white);letter-spacing:.03em;}

/* VOICE */
#voice{padding:var(--section-space) var(--side) var(--section-space-compact);background:var(--bg);}
/* FLOW（制作の流れ） */
#flow{padding:var(--section-space) var(--side);background:var(--bg);}
.flow-intro{font-size:1rem;color:var(--muted);line-height:1.9;max-width:600px;margin-top:16px;}
.flow-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:56px;}
.flow-step{padding-top:28px;border-top:1px solid var(--text);}
.flow-step-num{font-family:var(--display);font-size:1.9rem;font-weight:300;color:var(--muted);line-height:1;margin-bottom:18px;letter-spacing:-.01em;}
.flow-step-title{font-family:var(--serif);font-size:1.05rem;color:var(--text);margin-bottom:12px;letter-spacing:.04em;}
.flow-step-desc{font-size:.85rem;color:var(--muted);line-height:1.85;}
@media(max-width:980px){.flow-steps{grid-template-columns:repeat(2,1fr);gap:36px 24px;}}
@media(max-width:560px){.flow-steps{grid-template-columns:1fr;gap:0;}.flow-step{padding:24px 0;border-top:1px solid var(--line);}.flow-step:first-child{border-top:1px solid var(--text);}}
.voice-carousel{margin-top:48px;}
.voice-track-wrap{position:relative;overflow:hidden;max-width:880px;margin-left:auto;margin-right:auto;}
.voice-track-wrap::before,.voice-track-wrap::after{content:'';position:absolute;top:0;bottom:24px;width:72px;z-index:3;pointer-events:none;}
.voice-track-wrap::before{left:0;background:linear-gradient(to right,var(--bg) 30%,transparent);}
.voice-track-wrap::after{right:0;background:linear-gradient(to left,var(--bg) 30%,transparent);}
/* 1024px以下：縦長カードを1枚ずつ中央寄せ。矢印・ドットで操作（横スクロールも可） */
.voice-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:24px;padding:8px calc(50% - 150px) 22px;scroll-padding-inline:calc(50% - 150px);scrollbar-width:none;-ms-overflow-style:none;}
.voice-grid::-webkit-scrollbar{display:none;}
.voice-card{flex:0 0 300px;scroll-snap-align:center;background:var(--surface);border:1px solid var(--line);padding:36px 32px 32px;display:flex;flex-direction:column;gap:22px;box-shadow:0 4px 24px rgba(27,34,48,.07);}
.voice-arrow{position:absolute;top:0;bottom:24px;width:60px;background:none;border:none;cursor:pointer;z-index:4;display:flex;align-items:center;justify-content:center;color:var(--text);opacity:.35;transition:opacity .3s;}
.voice-arrow-prev{left:0;}
.voice-arrow-next{right:0;}
.voice-arrow:hover{opacity:1;}
.voice-mark{font-family:var(--display);font-size:3.4rem;line-height:.7;color:var(--text);opacity:.16;height:.5em;}
.voice-body{font-family:var(--serif);font-size:1.02rem;line-height:1.95;color:var(--text);flex:1;}
.voice-client{display:flex;flex-direction:column;gap:3px;padding-top:24px;border-top:1px solid var(--line);}
.voice-company{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.voice-name{font-family:var(--serif);font-size:.95rem;color:var(--text);font-weight:400;}
.voice-service{font-family:var(--mono);font-size:.68rem;letter-spacing:.04em;color:var(--muted);margin-top:4px;}
.voice-dots-row{display:flex;justify-content:center;gap:8px;align-items:center;margin-top:24px;}
.voice-dot{width:6px;height:6px;border-radius:50%;background:rgba(27,34,48,.2);border:none;cursor:pointer;padding:0;transition:width .3s,border-radius .3s,background .3s;}
.voice-dot.active{background:var(--text);width:20px;border-radius:3px;}
.voice-note{margin-top:24px;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;color:var(--muted);text-align:center;}

/* CTA */
#cta{padding:var(--section-space-large) var(--side);background:linear-gradient(to bottom,#FAFAFA 0%,#FAFAFA 22%,rgba(250,250,250,.93) 48%,rgba(245,245,245,.72) 74%,rgba(238,238,238,.40) 100%),#888C96 url('assets/footer-mesh.webp') center/cover no-repeat;text-align:center;position:relative;overflow:hidden;}
.cta-sub{font-family:var(--mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:40px;}
.cta-title{font-family:var(--serif);font-size:clamp(1.8rem,3.5vw,3rem);font-weight:400;line-height:1.5;color:var(--text);margin-bottom:20px;max-width:680px;margin-left:auto;margin-right:auto;}
.cta-body{font-size:1rem;color:var(--muted);max-width:560px;margin:0 auto 56px;line-height:1.9;}
.cta-form{width:100%;max-width:680px;margin:0 auto 48px;text-align:left;}
.cta-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.cta-form-group{display:flex;flex-direction:column;gap:8px;}
.cta-form-full{margin-bottom:16px;}
.cta-label{font-family:var(--mono);font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:8px;}
.cta-req{font-family:var(--mono);font-size:.5rem;color:var(--text);border:1px solid var(--line);padding:2px 6px;}
.cta-input{background:var(--white);border:1px solid var(--line);border-radius:0;padding:16px 16px;font-family:var(--sans);font-size:.82rem;color:var(--text);font-weight:300;outline:none;transition:border-color .3s;width:100%;-webkit-appearance:none;}
.cta-input::placeholder{color:var(--muted);}
.cta-input:focus{border-color:var(--text);}
.cta-select{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%230d0d0d' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:40px;}
.cta-textarea{min-height:120px;resize:vertical;line-height:1.8;}
.cta-form-footer{display:flex;align-items:center;justify-content:space-between;padding-top:8px;}
.cta-form-note{font-family:var(--mono);font-size:.55rem;letter-spacing:.1em;color:var(--muted);}
.cta-submit{cursor:pointer;border:none;font-family:inherit;}
.cta-tel-block{margin-top:40px;}
.cta-divider{font-family:var(--display);font-size:1rem;font-style:italic;color:var(--muted);margin-bottom:16px;}
.cta-tel-num{font-family:var(--display);font-size:2rem;font-weight:300;color:var(--text);letter-spacing:.06em;text-decoration:none;}
.cta-tel-hours{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;color:var(--muted);margin-top:10px;}

/* FOOTER */
footer{background:var(--text);padding:72px clamp(40px,6vw,96px) 40px;}
.footer-top{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:48px;margin-bottom:64px;}
.footer-logo{font-family:var(--display);font-size:1.3rem;font-weight:300;color:var(--white);margin-bottom:12px;}
.footer-tagline{font-family:var(--display);font-size:.78rem;color:rgba(255,255,255,.68);line-height:1.8;font-style:italic;}
.footer-col-title{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-bottom:16px;}
.footer-links{display:flex;flex-direction:column;gap:8px;}
.footer-links a{font-size:.875rem;color:rgba(255,255,255,.7);transition:color .3s;}
.footer-links a:hover{color:var(--white);}
.footer-info{display:flex;flex-direction:column;gap:6px;}
.footer-info p{font-size:.875rem;color:rgba(255,255,255,.65);line-height:1.75;}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:32px;border-top:1px solid rgba(255,255,255,.1);flex-wrap:wrap;gap:16px;}
.footer-copy{font-family:var(--mono);font-size:.75rem;letter-spacing:.06em;color:rgba(255,255,255,.5);}
.footer-right{display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.footer-privacy{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:rgba(255,255,255,.72);transition:color .3s;}
.footer-privacy:hover{color:rgba(255,255,255,.7);}
.footer-sns{display:flex;gap:20px;}
.footer-sns a{font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.55);transition:color .3s;}
.footer-sns a:hover{color:rgba(255,255,255,.8);}

::-webkit-scrollbar{width:4px;}
::-webkit-scrollbar-track{background:var(--bg2);}
::-webkit-scrollbar-thumb{background:var(--accent);}

/* TABLET */
@media(max-width:1024px){
  nav{padding:0 24px;}
  .nav-links{gap:24px;}
  .nav-links a{font-size:.85rem;}
  #hero{padding:0 32px 64px;}
  .hero-content-panel{width:calc(100% + 64px);margin:0 -32px -64px;padding:72px 32px 48px;}
  #works,#service,#philosophy,#approach,#flow,#cta{padding:var(--section-space) 32px;}
  footer{padding:64px 32px 32px;}
  #stats{--stats-bg-split:60%;padding:128px 32px 88px;}
  .stats-inner{grid-template-columns:repeat(2,1fr);}
  .stat-item{grid-template-columns:1fr 90px;gap:0 16px;padding:24px;}
  .stat-icon{width:90px;height:90px;}
  .stat-count{font-size:clamp(2.8rem,4.5vw,3.8rem);}
  .stats-head{margin-bottom:32px;}
  .stats-heading-copy{gap:8px;}
  .philo-cards{grid-template-columns:1fr;gap:16px;}
  .philo-card{padding:32px 28px;}
  .philo-capstone{margin-top:40px;font-size:1.15rem;}
  .footer-top{grid-template-columns:1fr 1fr;gap:40px;}
}

/* MOBILE */
@media(max-width:768px){
  nav{padding:0 20px;}
  .nav-hamburger{display:flex;}
  .nav-links{position:fixed;inset:0;background:var(--bg);flex-direction:column;align-items:center;justify-content:center;gap:32px;transform:translateX(100%);visibility:hidden;pointer-events:none;transition:none;z-index:150;}
  body.nav-motion-ready .nav-links{transition:transform .4s var(--ease),visibility 0s linear .4s;}
  .nav-links.open{transform:translateX(0);visibility:visible;pointer-events:auto;}
  body.nav-motion-ready .nav-links.open{transition:transform .4s var(--ease),visibility 0s;}
  .nav-links a{font-size:1rem;letter-spacing:.05em;color:var(--text);}
  .nav-cta{margin-top:8px;border-color:var(--accent)!important;color:var(--accent)!important;}
  #hero{min-height:100svh;height:auto;justify-content:flex-end;padding:calc(var(--nav-h) + 72px) 20px 40px;}
  #works,#service,#philosophy,#approach,#flow,#cta{padding:var(--section-space) 20px;}
  footer{padding:56px 20px 32px;}
  .hero-scroll{display:none;}
  .hero-overlay{background:linear-gradient(to bottom,rgba(246,247,250,.92) 0%,rgba(229,230,234,.42) 26%,rgba(85,90,100,.18) 52%,var(--text) 100%);}
  .hero-content-panel{--hero-notch-start:54%;--hero-notch-slope:36px;--hero-notch-depth:6%;width:calc(100% + 40px);margin:0 -20px -40px;padding:64px 20px 32px;background:linear-gradient(to bottom,transparent 42%,var(--text) 100%),linear-gradient(135deg,rgba(71,77,90,.52),rgba(22,28,40,.48));backdrop-filter:blur(24px) saturate(.48) contrast(.94);-webkit-backdrop-filter:blur(24px) saturate(.48) contrast(.94);}
  .hero-headline{font-size:clamp(2rem,8.4vw,2.8rem);line-height:1.45;margin-bottom:20px;}
  .hero-sub{font-size:.875rem;line-height:1.85;margin-bottom:24px;}
  .hero-services{gap:6px;margin-bottom:24px;}
  .svc-tag{font-size:.68rem;padding:4px 8px;}
  .hero-bottom{flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap;}
  .hero-bottom .btn-primary,.hero-bottom .btn-secondary{font-size:.76rem;padding:0 16px;width:100%;justify-content:center;}
  #stats{--stats-bg-split:92%;padding:96px 20px 72px;}
  .stats-head{margin-bottom:24px;}
  .stats-title{font-size:clamp(1.45rem,7vw,2rem);}
  .stats-inner{grid-template-columns:repeat(2,1fr);gap:10px;padding:12px;}
  .stat-item{padding:16px 14px;grid-template-columns:1fr 72px;gap:0 12px;}
  .stat-icon{width:72px;height:72px;}
  .stat-count{font-size:clamp(2.2rem,8vw,3rem);}
  .stat-unit{font-size:.88rem;}
  .stat-context{font-size:.7rem;}
  .logo-marquee{padding:20px 0;}
  .logo-item{width:180px;height:88px;padding:16px 24px;}
  .works-more{flex-direction:column;gap:16px;}
  .works-more .btn-secondary{width:100%;justify-content:center;}
  #voice{padding:var(--section-space) 0 var(--section-space-compact);}
  #voice .section-label,#voice .section-title,#voice .voice-note{padding-inline:20px;}
  .voice-grid{padding-inline:max(20px,calc(50% - 150px));scroll-padding-inline:max(20px,calc(50% - 150px));}
  .voice-card{flex:0 0 min(300px,calc(100vw - 56px));}
  .voice-arrow{width:44px;}
  .service-footer{flex-direction:column;align-items:flex-start;}
  .cta-title{font-size:clamp(1.5rem,6vw,2rem);}
  .cta-form-row{grid-template-columns:1fr;}
  .cta-form-footer{flex-direction:column;gap:16px;align-items:stretch;}
  .cta-submit{width:100%;justify-content:center;}
  .cta-form-note{text-align:center;}
  .footer-top{grid-template-columns:1fr 1fr;gap:20px 16px;}
  .footer-bottom{flex-direction:column;text-align:center;}
  .footer-right{justify-content:center;}
  .footer-sns{justify-content:center;}
}
@media(max-width:480px){
  #hero{padding:calc(var(--nav-h) + 52px) 16px 32px;}
  .hero-content-panel{width:calc(100% + 32px);margin:0 -16px -32px;padding:52px 16px 28px;}
  #works,#service,#philosophy,#approach,#flow,#cta{padding:var(--section-space) 16px;}
  footer{padding:48px 16px 32px;}
  .hero-headline{font-size:clamp(1.85rem,8.2vw,2.2rem);}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal,.hero-headline .line-inner,.hero-sub,.hero-services,.hero-bottom,.stats-head,.stat-item,.svc-tag,.hero-bottom a{opacity:1;transform:none;transition:none;}
  .svcA-img-wrap::after{display:none;}
  .hero-scroll{display:none;}
  .logo-track{width:100%;animation:none;}
  .logo-set{width:100%;display:grid;grid-template-columns:repeat(4,1fr);}
  .logo-set[aria-hidden="true"]{display:none;}
  .logo-item{width:auto;}
}
@media(max-width:768px) and (prefers-reduced-motion:reduce){
  .logo-set{grid-template-columns:repeat(2,1fr);}
  .logo-item{height:96px;}
}

@media(min-width:1025px){
  .voice-track-wrap{overflow:visible;max-width:none;}
  .voice-track-wrap::before,.voice-track-wrap::after{display:none;}
  .voice-grid{overflow:visible;flex-wrap:nowrap;padding:8px 0 20px;scroll-snap-type:none;}
  .voice-card{flex:1 1 0;min-width:0;scroll-snap-align:none;}
  .voice-card[aria-hidden]{display:none;}
  .voice-arrow,.voice-dots-row{display:none;}
}

/* NAV LOGO parts */
.nav-logo-brand{text-transform:uppercase;letter-spacing:.12em;}
.nav-logo-sub{font-style:normal;font-size:.85em;letter-spacing:.04em;color:var(--muted);}

/* Text Link */
.text-link{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);padding:10px 0;min-height:44px;box-sizing:border-box;text-decoration:none;transition:color 180ms ease;}
.text-link::after{content:"→";display:inline-block;transition:transform 180ms ease;}
.text-link:hover{text-decoration:underline;text-underline-offset:3px;}
.text-link:hover::after{transform:translateX(3px);}
.text-link:focus-visible{outline:2px solid var(--text);outline-offset:3px;}

/* Works intro paragraph */
.works-intro{font-size:1rem;color:var(--muted);max-width:564px;line-height:1.9;margin-top:24px;margin-bottom:56px;}

/* Service footer layout */
.service-footer--center{margin-top:56px;text-align:center;}

/* CTA actions block */
.cta-actions{display:flex;flex-direction:column;align-items:center;gap:32px;}

/* CTA primary button — large variant */
.btn-primary--lg{min-height:52px;padding:0 40px;font-size:.78rem;}

/* SERVICE — 縦並びカード + 画像クロスフェード */
.svcA-lead{font-family:var(--sans);font-size:clamp(.95rem,1vw,1.05rem);font-weight:400;line-height:2.05;color:var(--muted);letter-spacing:.03em;word-break:keep-all;max-width:640px;margin-top:16px;margin-bottom:64px;}
.svcA-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 32px;}
.svcA-card{display:flex;flex-direction:column;transition:transform var(--motion-base) var(--ease-enter);}
.svcA-card:hover{transform:translateY(-4px);}
.svcA-img-wrap{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--bg3);margin-bottom:24px;}
.svcA-img-wrap::after{content:'';position:absolute;inset:0;background:var(--bg);transform-origin:right;transition:transform .55s var(--ease-enter);}
.svcA-card.visible .svcA-img-wrap::after{transform:scaleX(0);}
.svcA-img-wrap img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease-enter);}
.svcA-card:hover .svcA-img-wrap img{transform:scale(1.04);}
.svcA-name{font-family:var(--serif);font-size:1.15rem;font-weight:400;color:var(--text);letter-spacing:.04em;margin-bottom:16px;}
.svcA-line{width:48px;height:1px;background:var(--text);margin-bottom:16px;transition:width var(--motion-base) var(--ease-enter);}
.svcA-card:hover .svcA-line{width:72px;}
.svcA-en{font-family:var(--mono);font-size:.72rem;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px;}
.svcA-desc{font-size:1rem;color:var(--muted);line-height:1.9;}
@media(max-width:1024px){.svcA-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){
  .svcA-grid{grid-template-columns:repeat(2,1fr);gap:20px 12px;}
  .svcA-lead{word-break:normal;overflow-wrap:anywhere;line-break:strict;}
  .svcA-line{display:none;}
  .svcA-img-wrap{margin-bottom:14px;}
  .svcA-card{padding:0;}
  .svcA-name{font-size:.95rem;margin-bottom:6px;}
  .svcA-en{font-size:.6rem;margin-bottom:8px;}
  .svcA-desc{font-size:.82rem;line-height:1.75;}
}

/* =====================================================================
   下層ページ共通部品（privacy / contact / company / plans が共有）
   ＊新しい下層ページは <body class="static-page"> にして
     このファイルを link するだけでよい
   ===================================================================== */

/* 下層ページ専用：ナビは常に白（スクロールで暗転しない） */
body.static-page nav{background:rgba(250,250,250,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--line);}
.nav-links a.active{color:var(--text);}

/* PAGE HERO（濃紺＋背景の巨大英字ワード） */
.page-hero{position:relative;overflow:hidden;padding:calc(var(--nav-h) + 96px) var(--side) 88px;background:var(--text);}
.page-hero-bg-word{position:absolute;right:var(--side);bottom:-0.15em;font-family:var(--display);font-size:clamp(80px,15vw,180px);font-weight:300;letter-spacing:-0.02em;color:rgba(255,255,255,.04);line-height:1;white-space:nowrap;pointer-events:none;user-select:none;}
.page-hero-bg-word::before{content:attr(data-word);}
.page-hero-label{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:24px;display:flex;align-items:center;gap:14px;}
.page-hero-label::before{content:'';width:40px;height:1px;background:rgba(255,255,255,.3);}
.page-hero h1{font-family:var(--serif);font-size:clamp(2rem,4vw,3.2rem);font-weight:400;line-height:1.35;color:var(--white);margin-bottom:20px;}
.page-hero-desc{font-size:.92rem;color:rgba(255,255,255,.62);line-height:1.85;max-width:460px;word-break:auto-phrase;text-wrap:pretty;}
.page-hero-date{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;color:rgba(255,255,255,.68);margin-top:24px;}

/* SECTION COMMON（plans / company） */
.psec{padding:var(--section-space) var(--side);}
.psec--no-top-pc{padding-top:0;}
.psec-kicker{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:16px;display:flex;align-items:center;gap:14px;}
.psec-kicker::before{content:'';width:40px;height:1px;background:var(--line);}
.psec-title{font-family:var(--serif);font-size:clamp(1.5rem,2.6vw,2.1rem);font-weight:400;color:var(--text);line-height:1.45;}

/* CONTENT（privacy / contact の読み物幅） */
.content{max-width:760px;margin:0 auto;padding:80px var(--gutter) 120px;}

/* PRIVACY POLICY */
.policy-intro{font-size:1rem;color:var(--muted);line-height:2;margin-bottom:56px;padding-bottom:40px;border-bottom:1px solid var(--line);}
.policy-section{margin-bottom:48px;}
.policy-section h2{font-family:var(--serif);font-size:1.15rem;font-weight:400;color:var(--text);margin-bottom:16px;padding-left:16px;border-left:2px solid var(--text);}
.policy-section p{font-size:1rem;color:var(--muted);line-height:1.95;margin-bottom:12px;}
.policy-section ul{margin:12px 0 12px 24px;}
.policy-section ul li{font-size:1rem;color:var(--muted);line-height:1.9;padding:4px 0;list-style:disc;}
.policy-contact{background:var(--bg2);border:1px solid var(--line);padding:32px;margin-top:56px;}
.policy-contact h3{font-family:var(--serif);font-size:1.05rem;font-weight:400;margin-bottom:12px;}
.policy-contact p{font-size:.95rem;color:var(--muted);line-height:1.9;}
.policy-contact a{border-bottom:1px solid var(--line);transition:border-color .3s;}
.policy-contact a:hover{border-color:var(--text);}

/* CONTACT FORM */
.contact-intro{font-size:1rem;color:var(--muted);line-height:2;margin-bottom:48px;padding-bottom:40px;border-bottom:1px solid var(--line);}
.contact-intro .req-mark{color:#C0392B;}
.contact-req-note{font-size:.82rem;color:var(--muted);}
.contact-form{display:flex;flex-direction:column;gap:26px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);}
.field label .req{color:#C0392B;margin-left:6px;}
.field input,.field select,.field textarea{font-family:var(--sans);font-size:.9rem;color:var(--text);background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);padding:13px 14px;width:100%;outline:none;transition:border-color .2s;border-radius:0;}
.field input,.field textarea{-webkit-appearance:none;appearance:none;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--text);}
.field textarea{resize:vertical;min-height:160px;line-height:1.7;}
.field select{cursor:pointer;height:48px;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231B2230' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-agree{font-size:.82rem;color:var(--muted);line-height:1.8;}
.form-agree a{border-bottom:1px solid var(--line);transition:border-color .3s;}
.form-agree a:hover{border-color:var(--text);}
.form-submit-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;background:var(--text);color:var(--white);padding:18px 40px;border:none;cursor:pointer;transition:transform var(--motion-fast) var(--ease-enter),background .2s;}
.form-submit-btn:hover{background:rgba(27,34,48,.8);}
.form-submit-btn:active{transform:scale(.98);}
.contact-info{background:var(--bg2);border:1px solid var(--line);padding:32px;margin-top:56px;}
.contact-info h3{font-family:var(--serif);font-size:1.05rem;font-weight:400;margin-bottom:20px;}
.contact-info-row{display:flex;gap:16px;padding:12px 0;border-top:1px solid var(--line);}
.contact-info-row:first-of-type{border-top:none;padding-top:0;}
.contact-info-label{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);width:96px;flex-shrink:0;padding-top:3px;}
.contact-info-val{font-size:.92rem;color:var(--text);line-height:1.7;}
.contact-info-val .tel{font-family:var(--display);font-size:1.5rem;font-weight:300;letter-spacing:.04em;}
.contact-thanks{display:none;padding:8px 0 24px;}
.contact-thanks.visible{display:block;}
.contact-thanks-icon{font-family:var(--display);font-size:2rem;color:var(--text);opacity:.35;margin-bottom:16px;}
.contact-thanks h3{font-family:var(--serif);font-size:1.3rem;font-weight:400;color:var(--text);margin-bottom:14px;}
.contact-thanks p{font-size:.92rem;color:var(--muted);line-height:1.9;}

/* PLANS */
.plans-intro{max-width:640px;font-size:1rem;color:var(--muted);line-height:2;margin-top:24px;}
.plans-cat{padding-bottom:64px;scroll-margin-top:calc(var(--nav-h) + 24px);}
.plans-cat-head{max-width:1180px;margin-bottom:28px;}
.plans-cat-kicker{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;display:flex;align-items:center;gap:14px;}
.plans-cat-kicker::before{content:'';width:40px;height:1px;background:var(--line);}
.plans-cat-title{font-family:var(--serif);font-size:clamp(1.3rem,2.2vw,1.8rem);font-weight:400;color:var(--text);line-height:1.4;margin-bottom:10px;}
.plans-cat-lead{font-size:.9375rem;color:var(--muted);line-height:1.8;max-width:560px;}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:8px;}
.plan-card{background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);padding:34px 30px 30px;display:flex;flex-direction:column;gap:18px;transition:transform var(--motion-base) var(--ease-enter),box-shadow var(--motion-base) linear,border-color var(--motion-base) linear;}
.plan-card:hover{border-color:rgba(27,34,48,.22);transform:translateY(-4px);box-shadow:0 10px 28px rgba(27,34,48,.09);}
.plan-card-kicker{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.plan-card-title{font-family:var(--serif);font-size:1.15rem;font-weight:400;color:var(--text);line-height:1.45;}
.price-from{display:block;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-family:var(--mono);}
.price-main{font-family:var(--display);font-size:1.7rem;font-weight:400;letter-spacing:-.01em;color:var(--text);}
.price-unit{font-family:var(--mono);font-size:.78rem;color:var(--muted);}
.plan-card-items{padding:20px 0 4px;margin:0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px;flex:1;}
.plan-card-items li{font-size:.82rem;color:var(--muted);display:flex;gap:8px;line-height:1.6;}
.plan-card-items li::before{content:'—';opacity:.4;flex-shrink:0;}
.plan-card-link{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text);border-bottom:1px solid var(--line);padding-bottom:6px;align-self:flex-start;transition:border-color .3s;}
.plan-card-link:hover{border-color:var(--text);}
/* カード下部のイメージ画像（全幅・締めのアクセント）。画像未設置時はグレーのプレースホルダー */
.plan-card-media{margin:2px -30px -30px;aspect-ratio:2/1;background:var(--bg3);overflow:hidden;position:relative;}
.plan-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease-enter);}
.plan-card:hover .plan-card-media img{transform:scale(1.04);}
.plan-card-media::after{content:'PHOTO';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;color:var(--muted);pointer-events:none;}
.plan-card-media:has(img)::after{display:none;}

/* RECOMMENDED PACKAGE（3カラム比較・POPでなくインクで上品に） */
.pkg-table{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px;align-items:stretch;}
.pkg-col{background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);padding:44px 32px 36px;display:flex;flex-direction:column;position:relative;transition:transform var(--motion-base) var(--ease-enter),box-shadow var(--motion-base) linear,border-color var(--motion-base) linear;}
.pkg-col:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(27,34,48,.09);}
.pkg-col--featured{border-color:var(--text);box-shadow:0 14px 38px rgba(27,34,48,.13);}
.pkg-badge{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--text);color:var(--white);font-family:var(--mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;padding:7px 20px;white-space:nowrap;}
.pkg-name{font-family:var(--display);font-size:1.55rem;font-weight:400;letter-spacing:.01em;color:var(--text);text-align:center;}
.pkg-scope{font-family:var(--mono);font-size:.64rem;letter-spacing:.06em;color:var(--muted);text-align:center;margin-top:10px;}
.pkg-divider{width:40px;height:2px;background:var(--text);margin:22px auto 24px;}
.pkg-headline{font-family:var(--serif);font-size:1.2rem;font-weight:400;line-height:1.6;color:var(--text);text-align:center;margin-bottom:16px;}
.pkg-desc{font-size:.85rem;color:var(--muted);line-height:1.95;text-align:center;margin-bottom:28px;}
.pkg-price-block{margin-top:auto;}
.pkg-price{display:flex;align-items:baseline;justify-content:center;gap:4px;}
.pkg-price-num{font-family:var(--display);font-size:2rem;font-weight:400;letter-spacing:-.01em;color:var(--text);}
.pkg-price-unit{font-family:var(--mono);font-size:.74rem;color:var(--muted);}
.pkg-price-regular{text-align:center;font-size:.74rem;color:var(--muted);text-decoration:line-through;margin-top:6px;}
.pkg-feat-label{font-family:var(--mono);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:24px;padding-top:20px;border-top:1px solid var(--line);margin-bottom:14px;}
.pkg-feats{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px;}
.pkg-feats li{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;color:var(--text);line-height:1.6;}
.pkg-check{flex-shrink:0;margin-top:3px;color:var(--text);}
@media(max-width:880px){.pkg-table{grid-template-columns:1fr;gap:32px;}.pkg-col{padding:40px 28px 32px;}}
/* WORKS PORTFOLIO (category grid) */
.works-portfolio{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:40px;}
.wp-card{background:var(--surface);padding:28px 26px 30px;display:flex;flex-direction:column;gap:6px;transition:background var(--motion-base) linear;}
.wp-card:hover{background:var(--bg2);}
.wp-en{display:none;}
.wp-name{font-family:var(--serif);font-size:1.1rem;font-weight:400;color:var(--text);letter-spacing:.04em;margin-bottom:12px;}
.wp-list{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px;}
.wp-list li{font-size:.84rem;color:var(--muted);line-height:1.6;display:flex;gap:8px;}
.wp-list li::before{content:'—';opacity:.4;flex-shrink:0;}
@media(max-width:1024px){.works-portfolio{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.works-portfolio{grid-template-columns:1fr;}}

.plans-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:8px;}
.plans-note-label{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;}
/* FAQ */
.faq-list{max-width:1180px;margin-top:40px;border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{list-style:none;cursor:pointer;padding:24px 44px 24px 0;font-family:var(--serif);font-size:1.05rem;line-height:1.6;color:var(--text);position:relative;display:flex;gap:14px;}
.faq-q::-webkit-details-marker{display:none;}
.faq-q::before{content:'Q';font-family:var(--mono);font-size:.8rem;color:var(--muted);flex-shrink:0;padding-top:2px;}
.faq-q::after{content:'';position:absolute;right:8px;top:30px;width:9px;height:9px;border-right:1.5px solid var(--text);border-bottom:1.5px solid var(--text);transform:rotate(45deg);transition:transform .3s var(--ease);}
.faq-item[open] .faq-q::after{transform:rotate(-135deg);}
.faq-a{overflow:hidden;padding:0;transition:height .35s cubic-bezier(.4,0,.2,1);}
.faq-a p{font-size:.92rem;color:var(--muted);line-height:1.95;padding:0 44px 28px 30px;}
.plans-note-text{font-size:.86rem;color:var(--muted);line-height:1.95;}

/* COMPANY */
.co-mission{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(40px,5vw,72px);align-items:center;}
.co-mission-body{font-size:.95rem;color:var(--muted);line-height:2.1;margin-top:28px;line-break:strict;word-break:auto-phrase;text-wrap:pretty;}
.co-mission-body p+p{margin-top:1.4em;}
.tablet-break{display:none;}
.co-mission-sign{margin-top:36px;}
.co-mission-sign-role{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.co-mission-sign-name{font-family:var(--serif);font-size:1.3rem;color:var(--text);letter-spacing:.08em;}
.co-mission-visual{background:var(--text);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.co-mission-visual img{width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.co-mission-visual--portrait{aspect-ratio:1354/2048;background:var(--bg2);}
.co-mission-visual--portrait img{object-fit:contain;object-position:center;}
.co-mission-visual-inner{font-family:var(--display);font-size:clamp(2.4rem,5vw,4.4rem);color:rgba(255,255,255,.08);text-align:center;line-height:1.2;font-style:italic;font-weight:300;pointer-events:none;user-select:none;padding:20px;}
.co-values{background:var(--bg);}
.co-values-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px;}
.co-value-item{background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);padding:36px 30px;}
.co-value-num{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;color:var(--muted);margin-bottom:20px;}
.co-value-title{font-family:var(--serif);font-size:1.1rem;font-weight:400;color:var(--text);margin-bottom:14px;line-height:1.45;}
.co-value-body{font-size:.88rem;color:var(--muted);line-height:1.95;}
.co-table{width:100%;border-collapse:collapse;margin-top:40px;}
.co-table tr{border-bottom:1px solid var(--line);}
.co-table tr:first-child{border-top:1px solid var(--line);}
.co-table th{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;color:var(--muted);font-weight:400;text-align:left;padding:22px 24px 22px 0;width:200px;vertical-align:top;}
.co-table td{font-size:.92rem;color:var(--text);padding:22px 0;line-height:1.75;vertical-align:top;}
.co-table td a{border-bottom:1px solid var(--line);transition:border-color .3s;}
.co-table td a:hover{border-color:var(--text);}

/* PAGE CTA（下層ページ共通） */
.page-cta{padding:var(--section-space-large) var(--side);background:linear-gradient(to bottom,#FAFAFA 0%,#FAFAFA 22%,rgba(250,250,250,.93) 48%,rgba(245,245,245,.72) 74%,rgba(238,238,238,.40) 100%),#888C96 url('assets/footer-mesh.webp') center/cover no-repeat;text-align:center;}
.page-cta-kicker{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:24px;}
.page-cta-title{font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.2rem);font-weight:400;line-height:1.6;margin-bottom:40px;}
.page-cta-btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;background:var(--text);color:var(--white);padding:0 40px;min-height:52px;border:none;cursor:pointer;box-sizing:border-box;transition:background 180ms ease,opacity 180ms ease;}
.page-cta-btn:hover{background:rgba(27,34,48,.82);}
.page-cta-btn:active{background:rgba(27,34,48,.95);}
.page-cta-btn:focus-visible{outline:2px solid var(--text);outline-offset:3px;}

/* 下層ページ レスポンシブ */
@media(max-width:1024px){
  .co-values-grid{grid-template-columns:1fr 1fr;}
  .plans-grid{grid-template-columns:repeat(2,1fr);}
  .plans-notes{grid-template-columns:1fr 1fr;}
}
@media(max-width:860px){
  .co-mission{grid-template-columns:1fr;gap:40px;}
  .co-mission-visual{aspect-ratio:16/7;}
  .co-mission-visual--portrait{width:min(100%,360px);aspect-ratio:1354/2048;margin-inline:auto;}
}
@media(min-width:521px) and (max-width:860px){
  .tablet-break{display:block;}
}
@media(max-width:768px){
  .page-hero{padding:calc(var(--nav-h) + 56px) 20px 64px;}
  .page-hero-bg-word{font-size:clamp(60px,18vw,80px);}
  .content{padding:56px 20px 80px;}
  .psec{padding:var(--section-space) 20px;}
  .psec--no-top-pc{padding-top:var(--section-space);}
  .page-cta{padding:var(--section-space) 20px;}
  .field-row{grid-template-columns:1fr;}
  .contact-info{padding:24px;}
  .contact-info-row{flex-direction:column;gap:4px;}
  .contact-info-label{width:auto;}
  .plans-grid{grid-template-columns:1fr;}
  .plans-notes{grid-template-columns:1fr;gap:28px;}
  .co-values-grid{grid-template-columns:1fr;}
  .co-table th{display:block;width:auto;padding:18px 0 4px;}
  .co-table td{display:block;padding:0 0 18px;}
  .co-table tr:first-child th{padding-top:18px;}
}

/* モーション低減設定：下層ページ部品にも適用 */
@media(prefers-reduced-motion:reduce){
  .plan-card,.plan-card:hover{transform:none!important;}
  .form-submit-btn:active{transform:none!important;}
  .svcA-card:hover .svcA-img-wrap img,.case-img img,.w-case:hover .case-img img{transform:none!important;}
}

/* Mobile navigation and narrow-screen stats fixes */
@media(max-width:768px){
  /* backdrop-filter on the fixed nav makes fixed descendants use the
     72px nav as their containing block. Disable it only while the
     full-screen menu is open so the menu can fill the viewport. */
  body.nav-open nav{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .nav-links{
    width:100vw;
    height:100vh;
    height:100dvh;
  }
}

@media(max-width:520px){
  .co-mission-body{font-size:.9rem;line-height:1.95;margin-top:24px;}
  .co-mission-body p+p{margin-top:1.25em;}
  .co-mission-visual--portrait{width:min(82vw,300px);}
  .stats-inner{grid-template-columns:1fr;}
  .stat-item{
    min-width:0;
    grid-template-columns:minmax(0,1fr) 56px;
  }
  .stat-icon{width:56px;height:56px;}
}

/* BACK TO TOP */
.back-to-top{position:fixed;bottom:32px;right:32px;width:44px;height:44px;background:var(--text);color:var(--white);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);transition:opacity .25s var(--ease),transform .25s var(--ease),background .2s;pointer-events:none;z-index:200;}
.back-to-top.visible{opacity:1;transform:translateY(0);pointer-events:auto;}
.back-to-top:hover{background:rgba(27,34,48,.78);}
.back-to-top:focus-visible{outline:2px solid var(--text);outline-offset:3px;}
@media(max-width:768px){.back-to-top{bottom:20px;right:16px;}}

@media(prefers-reduced-motion:reduce){
  .btn-primary,.btn-primary svg,.btn-secondary,.text-link,.text-link::after,.nav-cta,.page-cta-btn{transition:none;}
  .btn-primary:hover svg,.text-link:hover::after{transform:none;}
}