:root{--white:255,255,255}*{box-sizing:border-box}html{scroll-behavior:smooth;scrollbar-gutter:stable}body{margin:0;background:#000;color:#fff;font-family:'Barlow',sans-serif}body.admin-bar .space-navbar{top:calc(1rem + 32px)}a{color:inherit;text-decoration:none}.space-page{background:#000;overflow:hidden}.space-section{position:relative;min-height:100vh;background:#000;overflow:hidden}.fading-video{position:absolute;opacity:0;pointer-events:none;display:block}.space-hero-video{left:50%;top:0;transform:translateX(-50%);width:120%;height:120%;object-fit:cover;object-position:top center;z-index:0}.space-cap-video{inset:0;width:100%;height:100%;object-fit:cover;z-index:0}.liquid-glass{background:rgba(255,255,255,.01);background-blend-mode:luminosity;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:none;box-shadow:inset 0 1px 1px rgba(255,255,255,.1);position:relative;overflow:hidden}.liquid-glass::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,.15) 20%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(255,255,255,.15) 80%,rgba(255,255,255,.45) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.liquid-glass-strong{background:rgba(255,255,255,.01);background-blend-mode:luminosity;backdrop-filter:blur(50px);-webkit-backdrop-filter:blur(50px);border:none;box-shadow:4px 4px 4px rgba(0,0,0,.05),inset 0 1px 1px rgba(255,255,255,.15);position:relative;overflow:hidden}.liquid-glass-strong::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.2) 20%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 60%,rgba(255,255,255,.2) 80%,rgba(255,255,255,.5) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.space-navbar{position:fixed;top:1rem;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 2rem}.space-logo{width:48px;height:48px;border-radius:9999px;display:grid;place-items:center;font-family:'Instrument Serif',serif;font-style:italic;font-size:30px;line-height:1}.space-nav-center{border-radius:9999px;padding:6px;display:flex;align-items:center;gap:2px}.space-nav-center a:not(.space-nav-cta){font-size:14px;font-weight:500;color:rgba(255,255,255,.9);padding:9px 12px;border-radius:9999px}.space-nav-center a:hover{background:rgba(255,255,255,.08)}.space-nav-cta{background:#fff;color:#000;border-radius:9999px;font-size:14px;font-weight:600;padding:9px 14px;white-space:nowrap}.space-navbar-spacer{width:48px;height:48px}.space-hero{display:flex;flex-direction:column;justify-content:center;align-items:center}.space-hero-content{position:relative;z-index:10;min-height:calc(100vh - 150px);padding:110px 16px 40px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.space-badge{border-radius:9999px;display:flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;margin-bottom:20px}.space-badge span{background:#fff;color:#000;border-radius:9999px;padding:5px 12px;font-size:12px;font-weight:700}.space-badge p{margin:0;color:rgba(255,255,255,.9);font-size:14px}.space-headline{margin:0;max-width:850px;display:flex;flex-wrap:wrap;justify-content:center;row-gap:.1em;font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(58px,8vw,102px);line-height:.8;letter-spacing:-4px;color:#fff}.space-headline span{display:inline-block;margin-right:.28em;opacity:0;filter:blur(10px);transform:translateY(50px)}.space-headline.active span{animation:blurWord .7s ease-out forwards;animation-delay:calc(var(--i) * .1s)}@keyframes blurWord{0%{filter:blur(10px);opacity:0;transform:translateY(50px)}50%{filter:blur(5px);opacity:.5;transform:translateY(-5px)}100%{filter:blur(0);opacity:1;transform:translateY(0)}}.space-subheading{max-width:670px;margin:22px 0 0;color:#fff;font-size:16px;font-weight:300;line-height:1.2}.space-ctas{display:flex;align-items:center;gap:24px;margin-top:24px}.space-primary{display:inline-flex;align-items:center;gap:8px;border-radius:9999px;padding:12px 20px;font-size:14px;font-weight:600}.space-secondary{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500}.play-icon{width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:12px solid #fff}.space-stats{display:flex;align-items:stretch;gap:16px;margin-top:32px}.space-stat{width:220px;border-radius:20px;padding:20px;text-align:left}.space-stat svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.space-stat strong{display:block;margin-top:28px;font-family:'Instrument Serif',serif;font-style:italic;font-size:40px;line-height:1;letter-spacing:-1px}.space-stat span{display:block;margin-top:8px;font-size:12px;color:#fff;font-weight:300}.space-partners{position:absolute;left:0;right:0;bottom:30px;z-index:11;display:flex;flex-direction:column;align-items:center;gap:16px}.space-partners p{margin:0;border-radius:9999px;padding:7px 14px;font-size:12px;font-weight:500}.space-partners div{display:flex;gap:clamp(28px,5vw,64px);flex-wrap:wrap;justify-content:center}.space-partners span{font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(26px,3vw,36px)}.reveal{opacity:0;filter:blur(10px);transform:translateY(20px);transition:opacity .75s ease,filter .75s ease,transform .75s ease;transition-delay:var(--delay,0s)}.reveal.active{opacity:1;filter:blur(0);transform:translateY(0)}.space-capabilities{min-height:100vh}.space-cap-content{position:relative;z-index:10;min-height:100vh;padding:96px clamp(28px,5vw,80px) 40px;display:flex;flex-direction:column}.space-cap-header{margin-bottom:auto}.space-cap-header p{margin:0 0 24px;font-size:14px;color:rgba(255,255,255,.8)}.space-cap-header h2{margin:0;font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(60px,8vw,112px);line-height:.9;letter-spacing:-3px}.space-cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:64px}.space-cap-card{border-radius:20px;min-height:360px;padding:24px;display:flex;flex-direction:column}.space-cap-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.space-cap-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}.space-cap-icon svg{width:24px;height:24px;fill:#fff}.space-tags{max-width:70%;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.space-tags span{border-radius:9999px;padding:5px 10px;font-size:11px;color:rgba(255,255,255,.9);background:rgba(255,255,255,.04);box-shadow:inset 0 1px 1px rgba(255,255,255,.08)}.space-card-bottom{margin-top:auto}.space-card-bottom h3{margin:0;font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(36px,3vw,48px);line-height:1;letter-spacing:-1px}.space-card-bottom p{margin:12px 0 0;max-width:32ch;font-size:14px;font-weight:300;line-height:1.35;color:rgba(255,255,255,.9)}.space-contact{background:#000;padding:80px 20px}.space-contact-card{max-width:920px;margin:auto;border-radius:28px;padding:40px;text-align:center}.space-contact-card p{margin:0 0 18px;color:rgba(255,255,255,.8)}.space-contact-card h2{font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(48px,8vw,88px);line-height:.9;margin:0 0 24px}.space-contact-card a{display:inline-flex;gap:8px;align-items:center;background:#fff;color:#000;border-radius:9999px;padding:13px 20px;font-weight:600}@media(max-width:900px){.space-nav-center{display:none}.space-navbar{padding:0 18px}.space-navbar-spacer{display:none}.space-hero-content{padding-top:96px;min-height:100vh}.space-badge{max-width:92vw}.space-badge p{font-size:12px;text-align:left}.space-headline{font-size:clamp(54px,17vw,84px);letter-spacing:-2px}.space-subheading{font-size:14px;max-width:88vw}.space-ctas{flex-direction:column;gap:14px}.space-stats{width:100%;overflow-x:auto;padding:0 18px 16px;scroll-snap-type:x mandatory}.space-stat{flex:0 0 220px;scroll-snap-align:center}.space-partners{position:relative;bottom:auto;padding:0 20px 28px}.space-partners div{gap:24px}.space-cap-grid{grid-template-columns:1fr}.space-cap-card{min-height:320px}.space-cap-content{padding:88px 20px 32px}.space-tags{max-width:76%}body.admin-bar .space-navbar{top:1rem}}@media(max-width:520px){.space-badge{border-radius:24px;align-items:flex-start}.space-stats{margin-left:-16px;margin-right:-16px}.space-cap-header h2{font-size:64px}.space-card-bottom h3{font-size:38px}.space-tags{max-width:68%}}

/* TAKENAKA portfolio custom additions */
.takenaka-portfolio-page .space-logo{font-family:'Instrument Serif',serif;font-style:italic;font-size:28px;font-weight:400}.takenaka-portfolio-page .space-subheading{font-size:clamp(15px,2vw,18px);line-height:1.75;max-width:720px}.takenaka-portfolio-page .space-stat strong{font-size:44px}.portfolio-work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:64px}.portfolio-work-card{border-radius:24px;min-height:460px;padding:18px;display:flex;flex-direction:column;cursor:pointer;transition:transform .35s ease,background .35s ease}.portfolio-work-card:hover{transform:translateY(-8px);background:rgba(255,255,255,.04)}.portfolio-work-thumb{height:230px;border-radius:18px;background-size:cover;background-position:center;background-repeat:no-repeat;box-shadow:0 18px 45px rgba(0,0,0,.28);margin-bottom:22px}.portfolio-work-body span{display:block;color:rgba(255,255,255,.68);font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px}.portfolio-work-body h3{font-family:'Instrument Serif',serif;font-style:italic;font-size:clamp(34px,3vw,44px);line-height:1;margin:0 0 12px;color:#fff}.portfolio-work-body p{font-size:14px;line-height:1.7;font-weight:300;color:rgba(255,255,255,.88);margin:0}.takenaka-process{padding-top:90px}.takenaka-process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:28px;text-align:left}.takenaka-process-grid div{border-radius:22px;padding:22px;background:rgba(255,255,255,.035);box-shadow:inset 0 1px 1px rgba(255,255,255,.08)}.takenaka-process-grid strong{font-family:'Instrument Serif',serif;font-style:italic;font-size:46px;line-height:1;display:block}.takenaka-process-grid span{display:block;font-weight:600;margin:10px 0;color:#fff}.takenaka-process-grid p{font-size:14px;line-height:1.6;color:rgba(255,255,255,.78);margin:0}.takenaka-contact-text{max-width:620px;margin:0 auto 28px!important;line-height:1.8}.takenaka-contact-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.takenaka-contact-actions a{margin:0}.takenaka-contact-actions .takenaka-ghost-link{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22)}.portfolio-modal{position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:24px}.portfolio-modal.active{display:flex}.portfolio-modal img{max-width:min(1100px,94vw);max-height:88vh;border-radius:22px;box-shadow:0 30px 90px rgba(0,0,0,.55)}.portfolio-modal-close{position:absolute;top:24px;right:32px;width:48px;height:48px;border:0;border-radius:9999px;background:rgba(255,255,255,.12);color:#fff;font-size:34px;line-height:1;cursor:pointer}.portfolio-modal-close:hover{background:rgba(255,255,255,.2)}
@media(max-width:900px){.portfolio-work-grid{display:flex;overflow-x:auto;gap:16px;padding:0 20px 18px;margin-left:-20px;margin-right:-20px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.portfolio-work-grid::-webkit-scrollbar{display:none}.portfolio-work-card{flex:0 0 82vw;min-width:82vw;min-height:420px;scroll-snap-align:center}.portfolio-work-thumb{height:210px}.takenaka-process-grid{grid-template-columns:1fr}.takenaka-contact-actions{flex-direction:column;align-items:center}.takenaka-contact-actions a{width:min(320px,100%);justify-content:center}.takenaka-portfolio-page .space-headline{max-width:92vw}.takenaka-portfolio-page .space-partners div{gap:18px}.takenaka-portfolio-page .space-partners span{font-size:25px}}@media(max-width:520px){.portfolio-work-card{flex-basis:86vw;min-width:86vw;min-height:390px;padding:14px;border-radius:22px}.portfolio-work-thumb{height:180px;border-radius:16px}.portfolio-work-body h3{font-size:34px}.portfolio-work-body p{font-size:13px}.portfolio-modal img{max-width:96vw;max-height:78vh}.portfolio-modal-close{top:14px;right:14px}}




/* =========================
   Mobile Optimization
========================= */

@media (max-width:768px){

  /* ヒーローエリア */
  .space-hero-content{
      padding-top:120px;
      padding-left:20px;
      padding-right:20px;
  }

  /* メインタイトル */
  .space-headline{
      font-size:clamp(3rem,12vw,4.8rem)!important;
      line-height:.9!important;
      text-align:center;
      margin-bottom:20px;
  }

  /* 説明文 */
  .space-subheading{
      width:90%;
      margin:0 auto;
      font-size:.95rem;
      line-height:1.8;
      text-align:center;
  }

  /* ボタン */
  .space-ctas{
      flex-direction:column;
      gap:12px;
      width:100%;
  }

  .space-primary,
  .space-secondary{
      width:100%;
      justify-content:center;
  }

}

/* 背景を少し暗くして文字を読みやすく */
.space-hero{
    position:relative;
}

.space-hero::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.45);
    pointer-events:none;
}

.space-hero-content{
    position:relative;
    z-index:2;
}
@media (max-width:768px){

  .portfolio-work-grid{
    display:flex !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    gap:16px !important;
    scroll-behavior:smooth;
  }

  .portfolio-work-card{
    flex:0 0 86vw !important;
    min-width:86vw !important;
    scroll-snap-align:center;
  }

  .portfolio-work-grid::-webkit-scrollbar{
    display:none;
  }

}
/* Works swipe hint */
.works-swipe-ui{
  display:none;
}

@media (max-width:768px){

  .works-swipe-ui{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-top:18px;
    margin-bottom:32px;
    color:rgba(255,255,255,.72);
    text-align:center;
    letter-spacing:.12em;
  }

  .works-swipe-ui span{
    font-size:13px;
    font-weight:600;
  }

  .works-swipe-ui small{
    font-size:11px;
    letter-spacing:.04em;
    color:rgba(255,255,255,.55);
  }

  .portfolio-work-card{
    position:relative;
    cursor:pointer;
    overflow:hidden;
  }

  .portfolio-work-card::after{
    content:"タップで拡大";
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,0,0,.42);
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
    color:#fff;
    font-size:14px;
    font-weight:600;
    letter-spacing:.12em;
    opacity:0;
    transition:opacity .25s ease;
    pointer-events:none;
    z-index:5;
  }

  .portfolio-work-card:active::after,
  .portfolio-work-card:hover::after{
    opacity:1;
  }

}

/* ===== Mobile Only: Works Swipe UI ===== */
@media (max-width: 768px){

  .works-swipe-ui{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:100%;
    margin:18px auto 34px !important;
    padding:0 !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
    z-index:10;
  }

  .works-swipe-ui small{
    display:none !important;
  }

  .works-swipe-ui span{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    color:rgba(255,255,255,.78);
    font-size:12px;
    font-weight:600;
    letter-spacing:.22em;
    text-transform:uppercase;
  }

  .works-swipe-ui span::before{
    content:"←";
    display:inline-block;
    animation:swipeLeft 1.4s ease-in-out infinite;
  }

  .works-swipe-ui span::after{
    content:"→";
    display:inline-block;
    animation:swipeRight 1.4s ease-in-out infinite;
  }

  @keyframes swipeLeft{
    0%,100%{ transform:translateX(0); opacity:.45; }
    50%{ transform:translateX(-6px); opacity:1; }
  }

  @keyframes swipeRight{
    0%,100%{ transform:translateX(0); opacity:.45; }
    50%{ transform:translateX(6px); opacity:1; }
  }

}


/* ===== SWIPE UI FIX ===== */

/* PCは完全非表示 */
.works-swipe-ui{
    display:none !important;
}

/* スマホだけ表示 */
@media (max-width:768px){

    .works-swipe-ui{
        display:flex !important;
        justify-content:center !important;
        align-items:center !important;

        width:100% !important;

        position:static !important;
        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;

        margin:20px auto 40px auto !important;
        text-align:center !important;
    }

    .works-swipe-ui span{
        display:flex;
        align-items:center;
        gap:12px;

        color:rgba(255,255,255,.8);
        font-size:12px;
        letter-spacing:.2em;
        font-weight:600;
    }

    .works-swipe-ui span::before{
        content:"←";
        animation:swipeLeft 1.5s infinite;
    }

    .works-swipe-ui span::after{
        content:"→";
        animation:swipeRight 1.5s infinite;
    }

    @keyframes swipeLeft{
        0%,100%{transform:translateX(0);}
        50%{transform:translateX(-6px);}
    }

    @keyframes swipeRight{
        0%,100%{transform:translateX(0);}
        50%{transform:translateX(6px);}
    }
}
@media (min-width: 769px){
  .works-swipe-ui,
  .works-swipe-ui span,
  .works-swipe-ui small{
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
  }
}
/* ===== Hide SWIPE on PC ===== */
@media screen and (min-width: 769px){
  body .works-swipe-ui{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    height:0 !important;
    width:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
  }
}

/* ===== Mobile TAP / SWIPE UI ===== */

.works-swipe-ui{
  display:none !important;
}

@media (max-width:768px){

  .works-swipe-ui{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    margin:18px auto 36px !important;
    text-align:center !important;
    gap:10px !important;
  }

  .works-tap{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    gap:2px !important;
    color:rgba(255,255,255,.6) !important;
    font-size:11px !important;
    font-weight:600 !important;
    letter-spacing:.15em !important;
  }

  .works-tap::before{
    content:"↑";
    display:block;
    margin-bottom:4px;
    animation:tapArrow 1.5s ease-in-out infinite;
  }

  .works-swipe-text{
    color:rgba(255,255,255,.8) !important;
    font-size:12px !important;
    font-weight:600 !important;
    letter-spacing:.22em !important;
  }

  .works-swipe-text::before{
    content:"← ";
    animation:swipeLeft 1.4s ease-in-out infinite;
    display:inline-block;
    margin-right:12px;
  }

  .works-swipe-text::after{
    content:" →";
    animation:swipeRight 1.4s ease-in-out infinite;
    display:inline-block;
    margin-left:12px;
  }

  @keyframes tapArrow{
    0%,100%{transform:translateY(0);opacity:.45;}
    50%{transform:translateY(-5px);opacity:1;}
  }

  @keyframes swipeLeft{
    0%,100%{transform:translateX(0);opacity:.45;}
    50%{transform:translateX(-6px);opacity:1;}
  }

  @keyframes swipeRight{
    0%,100%{transform:translateX(0);opacity:.45;}
    50%{transform:translateX(6px);opacity:1;}
  }
}
/* TAPの左右矢印を強制削除 */
@media (max-width:768px){

  .works-tap span::before,
  .works-tap span::after{
    content:none !important;
    display:none !important;
    animation:none !important;
  }

  .works-swipe-text::before{
    content:"← " !important;
    display:inline-block !important;
    margin-right:12px !important;
    animation:swipeLeft 1.4s ease-in-out infinite !important;
  }

  .works-swipe-text::after{
    content:" →" !important;
    display:inline-block !important;
    margin-left:12px !important;
    animation:swipeRight 1.4s ease-in-out infinite !important;
  }

}