:root{--paper:#f5f5f1;--ink:#151615;--muted:#767976;--line:#d4d7d1;--accent:#3447d4;--black:#121212;--gutter:clamp(22px,4.25vw,82px);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{background:var(--paper);color:var(--ink);font-family:Arial,"Helvetica Neue","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}button,a{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}img{display:block;width:100%}::selection{background:#c7d0ff;color:#141414}
.smallcaps{font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:500;line-height:1.5}.faint{color:var(--muted)}.section-wrap{padding:0 var(--gutter)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.header{height:78px;padding:0 var(--gutter);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:90;background:rgba(245,245,241,.96);backdrop-filter:blur(14px)}.brand{display:inline-block;font-size:28px;font-weight:750;letter-spacing:-.078em;line-height:1}.brand sup{font-size:10px;vertical-align:top;letter-spacing:0;display:inline-block;margin-left:3px;transform:translateY(0)}.nav{display:flex;align-items:center;gap:44px;margin-left:5vw}.nav a{font-size:12px;font-weight:550;position:relative;transition:opacity .25s}.nav a:after{content:"";height:1px;background:currentColor;position:absolute;left:0;bottom:-5px;width:0;transition:width .3s}.nav a:hover:after{width:100%}.header-right{display:flex;align-items:center;gap:22px}.header-local{font-size:10px;color:var(--muted)}.contact-link{font-size:11px;display:flex;align-items:center;gap:15px;border:1px solid #151515;border-radius:50px;padding:12px 15px;transition:background .25s,color .25s}.contact-link:hover{background:var(--ink);color:var(--paper)}.contact-link b{font-size:16px;line-height:0;font-weight:400}.menu-toggle{display:none;border:0;background:transparent;font-size:12px;align-items:center;gap:10px;color:var(--ink)}.menu-toggle span{display:flex;flex-direction:column;gap:5px}.menu-toggle i{width:23px;height:1px;background:var(--ink);display:block}
.hero{padding:39px var(--gutter) 80px;min-height:635px;display:flex;flex-direction:column;justify-content:space-between}.hero-top{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.hero-top-right{display:flex;gap:48px}.hero-heading{font-size:clamp(72px,10.15vw,198px);font-weight:620;letter-spacing:-.091em;line-height:.91;margin:72px 0 48px;white-space:nowrap;transform:translateX(-.013em)}.hero-heading span{display:block}.hero-heading em{font-style:normal;font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.09em}.hero-bottom{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:40px;padding-top:10px}.hero-thesis{font-size:clamp(16px,1.65vw,24px);letter-spacing:-.055em;max-width:660px;line-height:1.52;font-weight:480}.hero-bottom-right{display:flex;justify-content:space-between;align-items:flex-end;gap:40px}.hero-jp{max-width:360px;font-size:13px;line-height:1.9;color:#555a55;font-weight:400}.scroll-mark{white-space:nowrap;font-size:11px;display:flex;align-items:center;gap:16px}.scroll-mark svg{width:16px;height:35px}
.hero-feature{padding:0 var(--gutter)}.feature-grid{display:grid;grid-template-columns:1.65fr 1fr;gap:9px;height:min(49vw,690px);min-height:470px}.feature-right{display:grid;grid-template-rows:1fr 1fr;gap:9px;min-height:0}.photo{position:relative;overflow:hidden;background:#ddd;isolation:isolate}.photo>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease),filter .8s var(--ease)}.photo:hover>img{transform:scale(1.035)}.photo .photo-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;overflow:hidden}.photo-fallback strong{font-weight:650;line-height:.9;font-size:clamp(35px,5.5vw,96px);letter-spacing:-.07em}.photo-fallback p{font-size:11px;letter-spacing:.2em}.feature-grid .photo:nth-child(1){background:#1c241f;color:#e8e5d7}.feature-grid .photo:nth-child(1) .photo-fallback{background:#1c241f}.feature-right .photo:first-child .photo-fallback{background:#0b2c1b;color:#e9bd87}.feature-right .photo:last-child .photo-fallback{background:#e9b520;color:#242424}.photo .photo-meta{position:absolute;z-index:2;left:21px;right:21px;bottom:20px;color:#fff;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;font-size:11px;text-shadow:0 1px 15px rgba(0,0,0,.5)}.photo:after{content:"";position:absolute;inset:50% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.26));pointer-events:none;z-index:1}.photo-fallback+.photo-meta{z-index:3}.photo img.failed{display:none}.feature-caption{padding:14px 0 0;display:flex;justify-content:space-between;color:var(--muted);gap:15px}
.intro{padding:155px var(--gutter) 180px;display:grid;grid-template-columns:34% 1fr;gap:40px}.intro-label{display:flex;flex-direction:column;gap:30px;align-items:flex-start}.intro-label .sidenum{font-size:11px;color:var(--muted)}.intro-content h2{font-weight:550;letter-spacing:-.062em;font-size:clamp(38px,5.3vw,85px);line-height:1.14;margin:0 0 55px;max-width:1000px}.intro-content h2 em{font-family:Georgia,serif;font-weight:400;font-style:italic}.intro-bottom{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:80px}.intro-bottom p{font-size:14px;line-height:2.15;color:#565953;margin:0;max-width:440px}.text-link{display:inline-flex;align-items:center;justify-content:space-between;min-width:220px;border-bottom:1px solid var(--ink);padding:4px 0 13px;font-size:12px;letter-spacing:-.01em;transition:opacity .3s}.text-link:hover{opacity:.5}.text-link span:last-child{font-size:22px;line-height:.5}
.works{border-top:1px solid var(--ink);padding-top:25px}.section-brow{display:flex;justify-content:space-between;gap:40px;align-items:flex-start;margin-bottom:32px}.section-label{display:flex;align-items:center;gap:35px}.works-head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin:0 0 52px}.works-head h2{font-size:clamp(76px,11.2vw,170px);font-weight:550;letter-spacing:-.095em;line-height:.95;margin:0 0 -12px}.works-head .head-desc{max-width:240px;font-size:12px;line-height:1.65;text-align:left;color:#666b65}.filterbar{display:flex;gap:8px;flex-wrap:wrap;padding:20px 0 32px;border-top:1px solid var(--line)}.filterbar button{padding:10px 17px;border:1px solid transparent;border-radius:50px;font-size:11px;color:#6d706b;background:transparent;transition:.25s}.filterbar button:hover{color:var(--ink);border-color:var(--line)}.filterbar button.active{background:var(--ink);color:var(--paper)}.work-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:17px;row-gap:83px}.work-card{min-width:0;cursor:pointer}.work-card[hidden]{display:none}.work-card .card-image{aspect-ratio:1.43;position:relative;overflow:hidden;background:#ddd;color:#fff;isolation:isolate}.work-card .card-image .fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;padding:30px}.fallback .vis-word{font-weight:680;font-size:clamp(37px,5.4vw,80px);letter-spacing:-.075em;line-height:1.0;max-width:100%;overflow-wrap:normal;word-break:normal}.fallback .subword{font-size:12px;letter-spacing:.1em;line-height:1.5;margin-top:10px}.work-card .card-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1;transition:transform .75s var(--ease),opacity .35s}.work-card:hover .card-image img{transform:scale(1.037)}.work-card .card-image img.failed{display:none}.work-card .visit-icon{position:absolute;right:22px;top:20px;width:38px;height:38px;background:var(--paper);color:var(--ink);display:grid;place-items:center;z-index:3;border-radius:100%;font-size:20px;line-height:1;transform:translateY(7px);opacity:0;transition:opacity .2s,transform .35s var(--ease)}.work-card:hover .visit-icon{opacity:1;transform:translateY(0)}.work-card .card-details{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start;padding:15px 0 0}.work-card h3{margin:0;font-weight:590;font-size:clamp(22px,2.15vw,33px);line-height:1.18;letter-spacing:-.055em}.work-card .sub{color:#656b65;font-size:11px;line-height:1.6;margin-top:8px}.work-card .num{font-size:11px;color:#7a7d79}.work-card .card-arrow{font-size:14px;font-weight:400;transform:rotate(-45deg);display:inline-block;margin-left:8px}.works-more{padding:85px 0 143px;display:flex;justify-content:center}.big-outline-button{border:1px solid var(--ink);border-radius:60px;padding:22px 28px;display:inline-flex;gap:90px;justify-content:space-between;align-items:center;min-width:280px;font-size:12px;transition:background .25s,color .25s}.big-outline-button:hover{background:var(--ink);color:#fff}
.manifesto{background:#1c201d;color:#f3f2eb;padding:95px var(--gutter) 110px}.manifesto-top{display:flex;justify-content:space-between;align-items:center;padding-bottom:135px;color:#a6aaa2}.manifesto h2{font-size:clamp(48px,7.45vw,112px);font-weight:530;line-height:1.12;letter-spacing:-.08em;max-width:1350px;margin:0}.manifesto h2 em{font-family:Georgia,serif;font-weight:400;font-style:italic;color:#b4b8b0}.manifesto-bottom{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end;margin-top:90px}.manifesto-bottom p{font-size:14px;line-height:2.1;max-width:490px;color:#c7c9c1}.manifesto-bottom .text-link{border-color:#f3f2eb;justify-self:end;color:#f3f2eb;min-width:280px}
.services{padding:155px var(--gutter) 165px}.services-heading{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding-bottom:60px}.services-heading h2{font-size:clamp(48px,6.7vw,100px);letter-spacing:-.075em;font-weight:550;line-height:1;margin:0}.services-heading p{font-size:14px;max-width:420px;justify-self:end;line-height:2.1;margin:0}.service-rows{border-top:1px solid var(--ink)}.service-row{display:grid;grid-template-columns:13% 37% 1fr auto;align-items:center;border-bottom:1px solid var(--line);gap:20px;padding:27px 5px;transition:padding .35s,background .35s}.service-row:hover{padding-left:14px;padding-right:14px;background:#eceee8}.service-row span:nth-child(1){font-size:11px;color:#757972}.service-row strong{font-size:clamp(22px,3vw,44px);font-weight:500;letter-spacing:-.055em}.service-row span:nth-child(3){font-size:12px;color:#666b65}.service-row span:nth-child(4){font-size:23px}
.contact-section{background:#dfe3df;padding:55px var(--gutter) 45px}.contact-top{display:flex;align-items:center;justify-content:space-between;color:#626962}.contact-title{font-size:clamp(72px,11vw,170px);letter-spacing:-.09em;line-height:.94;font-weight:560;margin:130px 0 45px}.contact-title em{font-family:Georgia,serif;font-style:italic;font-weight:400}.contact-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;padding-bottom:75px}.contact-bottom p{font-size:13px;line-height:1.9;color:#565f57;margin:0;max-width:400px}.contact-cta-link{font-size:clamp(18px,2.6vw,38px);border-bottom:1px solid var(--ink);padding-bottom:9px;letter-spacing:-.035em;display:flex;gap:38px}.footer{background:#dfe3df;padding:26px var(--gutter) 30px;border-top:1px solid #bfc5bf;display:flex;justify-content:space-between;align-items:center;gap:20px}.footer p{margin:0;font-size:11px;color:#5a625b}.footer-links{display:flex;gap:30px}.footer-links a{font-size:11px}.prototype-label{position:fixed;bottom:17px;right:17px;z-index:50;background:#1c201d;color:#fff;border-radius:2px;padding:9px 12px;font-size:9px;letter-spacing:.11em;pointer-events:none}
.case-overlay{position:fixed;inset:0;z-index:110;background:#f5f5f1;overflow-y:auto;display:none}.case-overlay.is-open{display:block;animation:overlayFade .28s ease}.case-head{padding:22px var(--gutter);display:flex;justify-content:space-between;border-bottom:1px solid var(--line);align-items:center;position:sticky;top:0;background:#f5f5f1;z-index:4}.case-head button{border:1px solid var(--ink);background:transparent;border-radius:100%;font-size:25px;width:42px;height:42px;line-height:1}.case-inner{padding:65px var(--gutter) 110px}.case-inner .case-name{font-size:clamp(54px,8vw,125px);line-height:1;letter-spacing:-.085em;font-weight:540;margin:35px 0 55px}.case-images{display:grid;grid-template-columns:1.65fr 1fr;gap:10px;min-height:430px;height:50vw;max-height:650px}.case-images .photo{background:#b5b5b0}.case-intro{display:grid;grid-template-columns:1fr 1fr;gap:45px;padding:70px 0 110px}.case-intro h2{font-size:clamp(29px,3.3vw,54px);letter-spacing:-.065em;font-weight:550;line-height:1.35;margin:0}.case-intro p{max-width:570px;font-size:15px;line-height:2.1;color:#555a54;margin:0 0 30px}.case-intro .text-link{margin-top:20px}.case-modal-extra{border-top:1px solid var(--ink);padding-top:18px;font-size:11px;color:#777}.case-image-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(25px,6vw,75px);font-weight:660;letter-spacing:-.06em;background:#252b26;color:#eee}.case-images .photo img{z-index:1}
@keyframes overlayFade{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.hero-heading{font-size:10.4vw}.header-local{display:none}.hero{min-height:570px}.hero-bottom{grid-template-columns:1fr 42%}.hero-bottom-right{flex-direction:column;align-items:flex-end;gap:20px}.feature-grid{min-height:420px}.intro{grid-template-columns:28% 1fr}.intro-bottom{gap:35px}}
@media(max-width:760px){:root{--gutter:22px}.header{height:67px}.brand{font-size:25px}.nav{display:none;position:absolute;top:66px;left:0;right:0;margin:0;background:var(--paper);padding:30px var(--gutter) 40px;border-bottom:1px solid var(--line);flex-direction:column;gap:25px;align-items:flex-start}.nav.open{display:flex}.nav a{font-size:18px}.contact-link{display:none}.menu-toggle{display:flex}.hero{padding-top:24px;min-height:auto;padding-bottom:55px}.hero-top-right{gap:18px}.hero-top-right span:last-child{display:none}.hero-heading{font-size:clamp(58px,11.4vw,90px);letter-spacing:-.093em;white-space:normal;line-height:.97;margin:77px 0 54px}.hero-heading span{white-space:nowrap}.hero-bottom{display:block}.hero-thesis{font-size:19px;max-width:450px;line-height:1.55}.hero-bottom-right{flex-direction:row;align-items:flex-end;margin-top:30px}.hero-jp{max-width:265px;font-size:12px}.scroll-mark{font-size:0}.feature-grid{height:auto;min-height:0;grid-template-columns:1fr;gap:7px}.feature-grid>.photo{height:84vw;min-height:320px}.feature-right{grid-template-columns:1fr 1fr;grid-template-rows:none;gap:7px;height:45vw;min-height:165px}.feature-right .photo .photo-fallback strong{font-size:31px}.photo .photo-meta{font-size:9px;bottom:12px;left:12px;right:12px}.feature-caption{padding-top:12px}.intro{display:block;padding-top:110px;padding-bottom:120px}.intro-label{margin-bottom:45px;gap:8px}.intro-content h2{font-size:clamp(40px,8vw,64px);margin-bottom:36px}.intro-bottom{display:block}.intro-bottom p{font-size:13px;margin-bottom:35px}.works-head{display:block;margin-bottom:33px}.works-head h2{font-size:clamp(72px,14vw,104px);margin:0 0 15px}.works-head .head-desc{max-width:280px}.work-grid{grid-template-columns:1fr;row-gap:52px}.work-card .card-image{aspect-ratio:1.29}.fallback .vis-word{font-size:clamp(30px,8vw,56px)!important}.work-card h3{font-size:25px}.work-card .visit-icon{opacity:1;transform:none;width:30px;height:30px;font-size:16px;right:13px;top:13px}.works-more{padding:68px 0 100px}.manifesto{padding-top:55px;padding-bottom:70px}.manifesto-top{padding-bottom:100px}.manifesto h2{font-size:clamp(45px,8vw,74px)}.manifesto-bottom{display:block;margin-top:55px}.manifesto-bottom p{font-size:13px;margin-bottom:45px}.manifesto-bottom .text-link{min-width:100%}.services{padding:105px var(--gutter) 115px}.services-heading{display:block;padding-bottom:40px}.services-heading h2{margin:25px 0;font-size:64px}.services-heading p{font-size:13px}.service-row{grid-template-columns:36px 1fr 23px;gap:10px;padding:23px 0}.service-row strong{font-size:25px}.service-row span:nth-child(3){grid-column:2;grid-row:2;font-size:11px;line-height:1.6}.service-row span:nth-child(4){grid-column:3;grid-row:1}.contact-section{padding-top:38px}.contact-title{font-size:clamp(70px,12.5vw,110px);margin:100px 0 48px}.contact-bottom{display:block;padding-bottom:65px}.contact-bottom p{font-size:12px;margin-bottom:44px}.contact-cta-link{font-size:25px;display:flex;justify-content:space-between}.footer{flex-direction:column;align-items:flex-start;gap:15px}.footer-links{gap:18px}.case-inner{padding-top:28px}.case-inner .case-name{font-size:clamp(50px,11vw,86px);margin:25px 0}.case-images{display:block;height:auto;min-height:0}.case-images .photo{height:68vw;min-height:270px;margin-bottom:8px}.case-images .photo:nth-child(2){height:45vw;min-height:180px}.case-intro{display:block;padding:40px 0 80px}.case-intro h2{margin-bottom:30px}.case-intro p{font-size:13px}.prototype-label{bottom:9px;right:9px;font-size:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Concept 01 / Refinement: only optical typography calibration.
   The original composition, visual hierarchy, case grid, backgrounds,
   navigation and behavior are intentionally unchanged. */
.hero-heading {
  letter-spacing: -.067em;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}
.hero-heading em {
  letter-spacing: -.045em;
  font-kerning: normal;
}
@media (max-width:767px) {
  .hero-heading { letter-spacing: -.066em; }
  .hero-heading em { letter-spacing: -.043em; }
}


/* -------------------------------------------------------------------
   BLUEBERRY / EDITORIAL STUDY 03
   Built on the preferred concept 01. Microtypography, rhythm and actual
   content/navigation have been refined; no proprietary font is implied.
   ------------------------------------------------------------------- */
:root { --paper:#f5f5f1; --ink:#151615; --accent:#3447d4; }
html { scroll-padding-top:90px; }
body { font-kerning:normal; text-rendering:optimizeLegibility; }
.smallcaps, .faint, .header-local, .article-meta, .footer-bottom { font-variant-numeric:tabular-nums; }
.smallcaps { letter-spacing:.082em; }
a:focus-visible, button:focus-visible, [role="button"]:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
/* Typographic calibration: strong grotesk paired with a single calm serif accent. */
.brand { letter-spacing:-.069em; font-weight:750; font-kerning:normal; }
.brand sup { margin-left:5px; font-size:9px; letter-spacing:0; transform:translateY(1px); }
.hero-heading { letter-spacing:-.062em; font-kerning:normal; line-height:.93; }
.hero-heading em { letter-spacing:-.040em; font-kerning:normal; }
.hero-thesis { letter-spacing:-.042em; line-height:1.57; }
.intro-content h2 { letter-spacing:-.053em; line-height:1.16; }
.intro-content h2 em, .manifesto h2 em, .contact-title em { letter-spacing:-.033em; }
.works-head h2 { letter-spacing:-.078em; }
.work-card h3 { letter-spacing:-.034em; }
.service-row strong { letter-spacing:-.043em; }
/* Remove interface styling that overpowers the work. Preserve the v01 behavior. */
.filterbar { gap:4px; }
.filterbar button { border-radius:2px; padding:9px 14px; }
.filterbar button.active { background:none; color:var(--ink); border:1px solid var(--ink); }
.contact-link { border-radius:2px; padding:12px 14px; }
.big-outline-button { border-radius:2px; }
.work-card .visit-icon { border-radius:2px; width:34px; height:34px; }
/* Editorial writing section / designed as a journal index, not a card gallery */
.editorial { padding:53px var(--gutter) 145px; background:#eaece7; border-top:1px solid #d5d9d2; }
.editorial-top { display:flex; justify-content:space-between; gap:20px; padding-bottom:105px; }
.editorial-layout { display:grid; grid-template-columns:minmax(280px, .91fr) 1.09fr; gap:clamp(36px,6.8vw,125px); }
.editorial-lead { display:flex; flex-direction:column; align-items:flex-start; }
.editorial-lead h2 { margin:0; font-size:clamp(78px,10.8vw,165px); line-height:.82; letter-spacing:-.085em; font-weight:560; }
.editorial-period { color:var(--accent); }
.editorial-lead-jp { margin:44px 0 55px; color:#4a4f4b; font-size:15px; line-height:2.1; }
.editorial-all { min-width:250px; margin-top:auto; }
.editorial-articles { border-top:1px solid #202521; }
.editorial-article { display:block; padding:19px 0 31px; border-bottom:1px solid #bec5be; transition:padding .3s var(--ease),background .3s; }
.editorial-article:hover { padding-left:9px; padding-right:5px; }
.article-meta { display:flex; justify-content:space-between; gap:16px; font-size:10px; letter-spacing:.065em; color:#717970; }
.article-body { display:flex; justify-content:space-between; align-items:end; gap:15px; margin-top:21px; }
.article-body h3 { font-family:'Hiragino Kaku Gothic ProN','Yu Gothic','Noto Sans JP',sans-serif; font-weight:500; font-size:clamp(20px,2.2vw,30px); line-height:1.56; letter-spacing:-.042em; margin:0; }
.article-arrow { font-size:24px; line-height:1; transition:transform .3s var(--ease); transform:translateX(0); }
.editorial-article:hover .article-arrow { transform:translateX(6px); }
/* Complete original navigation, company details, legal pages and contact. */
.site-footer { background:#171d19; color:#ebece7; padding:74px var(--gutter) 26px; }
.footer-first { display:grid; grid-template-columns:1.24fr .88fr .72fr; column-gap:5vw; padding-bottom:135px; }
.brand-footer { color:#f4f4f0; font-size:43px; display:inline-block; }
.footer-identity { display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; }
.footer-identity p { margin:65px 0 0; font-size:clamp(25px,3vw,48px); line-height:1.1; font-weight:450; letter-spacing:-.058em; }
.footer-identity p span { font-family:Georgia,serif; font-weight:400; letter-spacing:-.048em; }
.footer-eyebrow { color:#939e95; display:block; margin-bottom:34px; }
.footer-link-list { display:grid; grid-template-columns:1fr 1fr; column-gap:29px; row-gap:14px; }
.footer-link-list a { display:flex; gap:12px; align-items:baseline; justify-content:space-between; font-size:16px; line-height:1.6; letter-spacing:-.024em; padding-bottom:12px; border-bottom:1px solid #424b44; transition:border-color .25s, color .25s; }
.footer-link-list a span { color:#9bada0; font-size:13px; }
.footer-link-list a:hover { border-color:#f3f4ec; color:#fff; }
.footer-contact address { font-size:13px; line-height:1.95; font-style:normal; color:#c7cfc7; }
.footer-contact>a { font-size:13px; display:flex; justify-content:space-between; gap:20px; border-bottom:1px solid #8b968e; padding:14px 0 12px; margin-top:31px; }
.footer-bottom { border-top:1px solid #424b44; padding-top:22px; display:flex; align-items:center; flex-wrap:wrap; gap:20px 34px; font-size:10px; letter-spacing:.017em; color:#9eaaa0; }
.footer-bottom a { color:#d5dad2; }
.footer-bottom a:nth-last-child(2) { margin-left:auto; }
.footer-bottom a:last-child { white-space:nowrap; }
/* iPhone and tablet: preserve proportions, avoid microtype below reasonable legibility. */
@media (max-width:1100px) {
  .nav { gap:23px; }
  .editorial-top { padding-bottom:70px; }
  .editorial-layout { gap:45px; }
  .footer-first { grid-template-columns:1fr 1fr; row-gap:55px; }
  .footer-identity { grid-column:1/-1; }
  .footer-identity p { margin-top:28px; }
}
@media (max-width:760px) {
  .hero-heading { letter-spacing:-.060em; line-height:.975; }
  .hero-heading em { letter-spacing:-.034em; }
  .hero-thesis { letter-spacing:-.031em; }
  .intro-content h2 { letter-spacing:-.043em; }
  .editorial { padding-top:32px; padding-bottom:95px; }
  .editorial-top { display:block; padding-bottom:70px; }
  .editorial-top span:last-child { display:block; margin-top:9px; }
  .editorial-layout { display:block; }
  .editorial-lead h2 { font-size:clamp(75px,18vw,118px); }
  .editorial-lead-jp { margin:35px 0 25px; font-size:13px; }
  .editorial-all { margin-bottom:58px; }
  .article-body h3 { font-size:clamp(19px,5.4vw,27px); }
  .article-meta { font-size:9px; }
  .site-footer { padding-top:60px; }
  .footer-first { display:block; padding-bottom:70px; }
  .footer-identity { margin-bottom:68px; }
  .brand-footer { font-size:38px; }
  .footer-identity p { font-size:37px; margin-top:32px; }
  .footer-navigation { margin-bottom:70px; }
  .footer-bottom { align-items:start; gap:16px; }
  .footer-bottom span:nth-child(2) { flex-basis:100%; }
  .footer-bottom a:nth-last-child(2) { margin-left:0; }
  .footer-bottom a:last-child { margin-left:auto; }
}
@media (max-width:370px) {
  .hero-heading { letter-spacing:-.061em; font-size:clamp(44px,13.3vw,51px); }
  .hero-heading em { letter-spacing:-.042em; }
  .contact-cta-link { font-size:clamp(18px,6.1vw,24px); gap:8px; }
  .footer-link-list { gap:10px 22px; }
  .footer-link-list a { font-size:14px; }
  .footer-bottom a:last-child { margin-left:0; }
}

/* WordPress integration: home only, visual design retained from v03 */
html { scroll-padding-top: 85px; }
body.home { margin:0; }
.work-card-link { display:block; color:inherit; text-decoration:none; }
.work-card-link:focus-visible, .photo:focus-visible, .footer-link-list a:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.work-card.is-unpublished .visit-icon{ display:none; }
.work-card.is-unpublished{ cursor:default; }
.work-card.is-unpublished .card-image img { transform:none; }
.work-card .unpublished-note { display:inline-block;font-size:10px;letter-spacing:.03em;color:var(--muted);margin-top:8px; }
.work-card[hidden] { display:none !important; }
body.admin-bar .header { top:32px; }
@media (max-width:782px) { body.admin-bar .header { top:46px; } }
@media(max-width:760px){ .hero-heading { letter-spacing:-.067em; } .hero-heading em {letter-spacing:-.045em;} }
@media(max-width:370px){ .hero-heading {font-size:clamp(44px,10.2vw,64px); letter-spacing:-.065em;} }

/* v04: WordPress Customizer + native menu integration. */
.nav-items{display:flex;align-items:center;gap:inherit;margin:0;padding:0;list-style:none}
.nav-items li{margin:0;padding:0;list-style:none}
.nav-items a{display:block}
.footer-link-list:is(ul){list-style:none;margin:0;padding:0}
.footer-link-list li{list-style:none;margin:0;padding:0}
.footer-link-list li a{display:block}
.footer-link-list li a::after{content:none;display:none}
/* No image provided: show an intentional typographic placeholder, never a broken-image icon. */
.photo:not(:has(img)) .photo-fallback,.card-image:not(:has(img)) .fallback{z-index:1}
@media(max-width:760px){.nav-items{display:flex;flex-direction:column;align-items:stretch;gap:0}}

.filterbar button[hidden]{display:none!important}

/* v05.2 / the official Blueberry SVG mark, kept in the parent theme as a single source of truth. */
.bbv5-site .header .brand,
.bbv5-site .footer-identity .brand{display:inline-flex;align-items:center;flex:0 0 auto;line-height:0;letter-spacing:normal}
.bbv5-site .header .brand img{display:block;width:clamp(130px,10.2vw,168px);height:auto;max-width:none}
.bbv5-site .footer-identity .brand img{display:block;width:clamp(155px,12vw,185px);height:auto;max-width:none}
/* Keep the rectangular outlined Contact treatment but do not append an arrow. */
.bbv5-site .header .contact-link{white-space:nowrap;justify-content:center;min-width:95px}
/* A single explicitly authored arrow is added to each footer link by the template. */
.bbv5-site .footer-navigation .footer-link-list a::after,
.bbv5-site .footer-navigation .footer-link-list li a::after{content:none!important;display:none!important}
.bbv5-site .footer-navigation .footer-link-list a{display:flex;align-items:baseline;justify-content:space-between;gap:18px}
.bbv5-site .footer-navigation .footer-link-list .bbv5-footer-arrow{display:inline-block;flex:0 0 auto;margin-left:auto;color:#9bada0;font-weight:400;font-size:13px;line-height:1}
@media(max-width:760px){
  .bbv5-site .header .brand img{width:132px}
  .bbv5-site .footer-identity .brand img{width:168px}
}

/* Keep the Contact CTA available on narrow screens without crowding the official mark. */
@media(max-width:760px){
  .bbv5-site .header{gap:10px}
  .bbv5-site .header .brand img{width:clamp(100px,27vw,128px)}
  .bbv5-site .header .header-right{gap:13px}
  .bbv5-site .header .header-local{display:none}
  .bbv5-site .header .contact-link{display:inline-flex;min-width:0;padding:9px 12px;font-size:11px;line-height:1.2}
  .bbv5-site .header .menu-toggle{font-size:0;gap:0}
}

/* v05.4: the homepage CTA links directly to the actual inquiry form. */
.contact-cta-link { justify-content:space-between; align-items:baseline; min-width:min(440px,100%); text-decoration:none; }
.contact-cta-link span:last-child { font-size:.72em; letter-spacing:0; }
@media(max-width:760px){.contact-cta-link { width:100%; min-width:0; font-size:clamp(23px,6vw,30px); }}

/* v05.4: long taxonomy labels must not collide with feature-card titles. */
.hero-feature .photo-meta > span:first-child { flex:1 1 55%; min-width:0; max-width:55%; overflow-wrap:break-word; line-height:1.45; }
.hero-feature .photo-meta > span:last-child { flex:1 1 45%; min-width:0; text-align:right; overflow-wrap:break-word; line-height:1.45; }
.editorial-article .article-meta { line-height:1.45; }

/* v05.7 / Column index teaser: preserve horizontal movement and add restrained blue title on hover. */
.bbv5-site .editorial-article .article-body h3{transition:color .23s ease}
.bbv5-site .editorial-article:hover .article-body h3,
.bbv5-site .editorial-article:focus-visible .article-body h3{color:var(--accent)}
@media(prefers-reduced-motion:reduce){.bbv5-site .editorial-article .article-body h3{transition:none}}

/* v05.13 / Directional navigation semantics
   → page-to-page, ↓ within-page, ↗ intentional contact/email CTAs.
   Non-links do not imply navigation. */
.bbv5-site .service-row .bbv5-service-check{display:flex;align-items:center;justify-content:center;color:#70766d;opacity:.9;line-height:0}
.bbv5-site .service-row .bbv5-service-check svg{display:block;width:19px;height:19px;flex:0 0 19px}
/* Editorial image cards are fully clickable; no corner arrows or duplicate cues. */
.bbv5-site .work-card .visit-icon{display:none!important}
.bbv5-site .footer-navigation .footer-link-list a::after,
.bbv5-site .footer-navigation .footer-link-list li a::after{content:none!important;display:none!important}
@media(prefers-reduced-motion:reduce){.bbv5-site .article-arrow{transition:none}}


/* v05.15 / Blueberry Gradient Detail System: only 02 Work Hover + 04 Contact CTA.
   These treatments are intentionally small accents; do not alter Hero, Column or section rules. */
:root {
  --bbv5-gradient-cool: linear-gradient(145deg, #081d5a 0%, #2320af 65%, #181137 100%);
  --bbv5-gradient-warm: linear-gradient(120deg, #121b18 0%, #162521 40%, #815f52 100%);
}
/* Keep the warm Work hover underline; v05.20 pauses secondary photo swapping. */
.bbv5-site .work-card .card-image::after,
.bbv5-site .bbv5-project .bbv5-project-image::after {
  content: "";
  position: absolute;
  z-index: 6;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: var(--bbv5-gradient-warm);
  opacity: 0;
  transform: scaleX(.22);
  transform-origin: left center;
  pointer-events: none;
  transition: opacity .45s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1);
}
@media (hover: hover) and (pointer: fine) {
  .bbv5-site .work-card:hover .card-image::after,
  .bbv5-site .bbv5-project:hover .bbv5-project-image::after {
    opacity: 1;
    transform: scaleX(1);
  }
}
/* Keyboard focus conveys the same affordance without requiring a mouse. */
.bbv5-site .work-card:focus-within .card-image::after,
.bbv5-site .bbv5-project:focus-visible .bbv5-project-image::after {
  opacity: 1;
  transform: scaleX(1);
}
/* Contact CTA: 140px cool underline at rest, quietly extends across the link on hover. */
.bbv5-site .contact-cta-link { position: relative; }
.bbv5-site .contact-cta-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: min(140px, 100%);
  height: 3px;
  background: var(--bbv5-gradient-cool);
  pointer-events: none;
  transition: width .5s cubic-bezier(.22,1,.36,1);
}
@media (hover: hover) and (pointer: fine) {
  .bbv5-site .contact-cta-link:hover::after { width: 100%; }
}
.bbv5-site .contact-cta-link:focus-visible::after { width: 100%; }
@media (prefers-reduced-motion: reduce) {
  .bbv5-site .work-card .card-image::after,
  .bbv5-site .bbv5-project .bbv5-project-image::after,
  .bbv5-site .contact-cta-link::after { transition: none !important; }
}


/* v05.16 / Editorial polish: restrained desktop link hierarchy and optical alignment. */
@media (min-width: 761px) {
  /* Match the About rule with the bottom of the adjacent Japanese copy. */
  .bbv5-site .intro-bottom { align-items: end; }
  .bbv5-site .intro-bottom > .text-link { align-self: end; }
  /* Consistent PC sizing for About / What we do / Read all columns. Mobile unchanged. */
  .bbv5-site .intro-bottom > .text-link,
  .bbv5-site .manifesto-bottom > .text-link,
  .bbv5-site .editorial-lead > .editorial-all.text-link {
    font-size: clamp(13px, .82vw, 14.5px);
    letter-spacing: -.012em;
  }
}
/* Footer logo-to-copy ratio and Hero-matched sans + serif typography. */
.bbv5-site .footer-identity .brand img {
  width: clamp(148px, 10.8vw, 173px);
}
.bbv5-site .footer-identity p {
  margin-top: 56px;
  font-family: Arial, "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Noto Sans JP", sans-serif;
  font-weight: 620;
  font-size: clamp(24px, 2.55vw, 41px);
  line-height: 1.035;
  letter-spacing: -.062em;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
}
.bbv5-site .footer-identity p .bbv5-footer-with {
  font-family: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
}
.bbv5-site .footer-identity p .bbv5-footer-passion {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-style: normal;
  letter-spacing: -.04em;
}
@media (min-width: 761px) and (max-width: 1100px) {
  .bbv5-site .footer-identity p { margin-top: 30px; }
}
@media (max-width: 760px) {
  .bbv5-site .footer-identity .brand img { width: 155px; }
  .bbv5-site .footer-identity p { margin-top: 29px; font-size: 34px; }
}


/* v05.20 / Footer identity: Quiet Dissolve, symbol by default.
   The authentic parent-theme wordmark appears only while scrolling down in the footer,
   and only while the header is hidden. Geometry is fixed to avoid layout shift. */
.bbv5-site .footer-identity .bbv5-footer-brand {
  position: relative;
  display: inline-block;
  width: clamp(148px, 10.8vw, 173px);
  height: 43px;
  flex: 0 0 auto;
  isolation: isolate;
  vertical-align: top;
}
.bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-wordmark,
.bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-icon {
  position:absolute;
  display:block;
  left:0;
  top:50%;
  transform-origin: left center;
  pointer-events:none;
  backface-visibility:hidden;
  object-fit:contain;
  will-change:opacity, transform;
}
.bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-wordmark {
  width: 100%;
  max-width:none;
  height:auto;
  opacity:0;
  transform:translateY(-52%) scale(.98);
  filter:blur(3px);
  transition: opacity .33s ease,
              transform .33s cubic-bezier(.2,.8,.2,1),
              filter .33s ease;
}
.bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-icon {
  width:46px;
  height:46px;
  max-width:none;
  opacity:1;
  transform:translateY(-50%) scale(1);
  filter:blur(0);
  transition: opacity .36s ease .055s,
              transform .4s cubic-bezier(.22,1,.36,1),
              filter .36s ease;
}
/* v05.20: scroll-down in footer reveals the wordmark only if the header is hidden.
   Scroll-up restores the symbol before the header returns. No hover swap. */
.bbv5-site .footer-identity .bbv5-footer-brand.is-wordmark img.bbv5-footer-wordmark { opacity:1; transform:translateY(-50%); filter:blur(0); }
.bbv5-site .footer-identity .bbv5-footer-brand.is-wordmark img.bbv5-footer-icon { opacity:0; transform:translateY(-50%) scale(.93); filter:blur(2px); }
.bbv5-site .footer-identity .bbv5-footer-brand:focus-visible { outline:2px solid #8fa8ee; outline-offset:5px; }
@media(max-width:760px) {
  .bbv5-site .footer-identity .bbv5-footer-brand { width:155px; height:41px; }
  .bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-icon { width:43px; height:43px; }
}
/* Mobile-only scroll reveal: transform is compositor-friendly and cannot shift layout.
   Without JS the underline remains a usable full-width link treatment. */
@media(max-width:760px) and (hover:none) {
  .bbv5-site .contact-cta-link::after { width:100%; transform:scaleX(1); transform-origin:left center; }
  .bbv5-site.bbv5-scroll-motion-ready .contact-cta-link::after {
    transform:scaleX(.38);
    transition:transform .7s cubic-bezier(.22,1,.36,1);
  }
  .bbv5-site.bbv5-scroll-motion-ready .contact-cta-link.bbv5-cta-revealed::after { transform:scaleX(1); }
}
@media(prefers-reduced-motion:reduce) {
  .bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-wordmark,
  .bbv5-site .footer-identity .bbv5-footer-brand img.bbv5-footer-icon,
  .bbv5-site .contact-cta-link::after { transition:none!important; filter:none!important; }
  .bbv5-site.bbv5-scroll-motion-ready .contact-cta-link::after { transform:scaleX(1); }
}


/* v05.21 / Touch-only, scroll-aware editorial affordances.
   Selected Work and Work archive share the same warm gradient. Featured Work is excluded.
   The line appears in the mobile reading zone and disappears when scrolled past.
   Column uses color only; all metadata, arrows and horizontal positions stay fixed.
   Desktop hover interactions remain unchanged. */
@media (max-width:760px) and (hover:none) {
  /* Featured Work has no touch/hover gradient, by editorial design. */
  .bbv5-site .work-card .card-image.is-bbv5-work-revealed::after,
  .bbv5-site .bbv5-project .bbv5-project-image.is-bbv5-work-revealed::after {
    opacity:1;
    transform:scaleX(1);
  }

  /* A blue title is the only touch response on Column; never move the row. */
  .bbv5-site .editorial-article:hover {padding-left:0;padding-right:0;}
  .bbv5-site .editorial-article:hover .article-arrow {transform:none;}
  .bbv5-site .editorial-article .article-body h3,
  .bbv5-site .bbv5-column-row .bbv5-column-heading h2,
  .bbv5-site .bbv5-column-row > h2 {
    transition:color .30s cubic-bezier(.22,1,.36,1);
  }
  .bbv5-site .editorial-article:hover .article-body h3,
  .bbv5-site .bbv5-column-row:hover .bbv5-column-heading h2,
  .bbv5-site .bbv5-column-row:hover > h2 {color:inherit;}
  .bbv5-site .editorial-article.is-bbv5-column-active .article-body h3,
  .bbv5-site .bbv5-column-row.is-bbv5-column-active .bbv5-column-heading h2,
  .bbv5-site .bbv5-column-row.is-bbv5-column-active > h2 {
    color:var(--accent);
  }
  .bbv5-site .bbv5-column-row:hover {color:var(--ink);}
  .bbv5-site .bbv5-column-row .bbv5-column-heading,
  .bbv5-site .bbv5-column-row .bbv5-row-arrow {
    transform:none!important;
    transition:none;
  }
}
@media (max-width:760px) and (hover:none) and (prefers-reduced-motion:reduce) {
  .bbv5-site .editorial-article .article-body h3,
  .bbv5-site .bbv5-column-row .bbv5-column-heading h2,
  .bbv5-site .bbv5-column-row > h2 {transition:none!important;}
}


/* v05.24 / HOME What we do: quiet mobile counterpart to the desktop hover.
   One row at a time, reading-line activated, reverses as it leaves the zone. */
@media (max-width:760px) and (hover:none) {
  .bbv5-site .services .service-row {
    transition:background-color .38s cubic-bezier(.22,1,.36,1),
               padding-left .38s cubic-bezier(.22,1,.36,1),
               padding-right .38s cubic-bezier(.22,1,.36,1);
  }
  .bbv5-site .services .service-row:hover:not(.is-bbv5-service-active) {
    background:transparent;
    padding-left:0;
    padding-right:0;
  }
  .bbv5-site .services .service-row.is-bbv5-service-active {
    background:#eceee8;
    padding-left:9px;
    padding-right:9px;
  }
  .bbv5-site .services .service-row .bbv5-service-check {
    transition:opacity .35s ease,color .35s ease,transform .35s ease;
    transform-origin:center center;
  }
  .bbv5-site .services .service-row.is-bbv5-service-active .bbv5-service-check {
    color:#2e3630;
    opacity:1;
    transform:scale(1.04);
  }
}
@media (max-width:760px) and (hover:none) and (prefers-reduced-motion:reduce) {
  .bbv5-site .services .service-row,
  .bbv5-site .services .service-row .bbv5-service-check {
    transition:none!important;
  }
}


/* v05.25 / Editorial simplification on mobile.
   Retain structural section labels, remove only redundant microcopy.
   Desktop composition remains exactly as in v05.24. */
@media (max-width:760px) {
  /* These captions are decorative; the featured visuals carry the content. */
  .bbv5-site .hero-feature .feature-caption { display:none; }
  /* Keep the numbered editorial label, drop the redundant manifesto tagline. */
  .bbv5-site .intro-label .sidenum { display:none; }
  /* Keep 02 / INDEX; the work headline and filter already identify the portfolio. */
  .bbv5-site .works .section-brow .section-label .faint,
  .bbv5-site .works .section-brow > .faint { display:none; }
  /* Rebalance the rhythm after removing auxiliary rows of text. */
  .bbv5-site .intro { padding-top:96px; }
  .bbv5-site .intro-label { margin-bottom:40px; }
  .bbv5-site .works .section-brow { margin-bottom:25px; }
}


/* v05.26 / Deliberate editorial hierarchy on the HOME page.
   Desktop: create air between the numbered capabilities label and its title.
   Mobile: retain only the structural manifesto label, consistent with the
   reduced microcopy in sections 01 / 02 from v05.25. */
@media (min-width:761px) {
  .bbv5-site .services-heading h2 { margin-top:clamp(22px,1.8vw,34px); }
}
@media (max-width:760px) {
  .bbv5-site .services-heading h2 { margin:29px 0 27px; }
  .bbv5-site .manifesto-top { align-items:flex-start; }
  .bbv5-site .manifesto-top > .smallcaps:last-child { display:none; }
}


/* v05.27 / Editorial label-to-heading rhythm.
 * One typographic spacing token for HOME 02–05, with a more compact mobile
 * reading cadence. Section 01 remains a deliberate two-column sidebar label.
 */
@media (min-width:761px) {
  .bbv5-site { --bbv5-home-label-gap:clamp(48px,4.2vw,72px); }
  .bbv5-site .works .section-brow { margin-bottom:var(--bbv5-home-label-gap); }
  .bbv5-site .manifesto .manifesto-top { padding-bottom:var(--bbv5-home-label-gap); }
  .bbv5-site .services .services-heading h2 { margin-top:var(--bbv5-home-label-gap); }
  .bbv5-site .editorial .editorial-top { padding-bottom:var(--bbv5-home-label-gap); }
}
@media (max-width:760px) {
  .bbv5-site { --bbv5-home-label-gap:36px; }
  .bbv5-site .works .section-brow { margin-bottom:var(--bbv5-home-label-gap); }
  .bbv5-site .manifesto .manifesto-top { padding-bottom:var(--bbv5-home-label-gap); }
  .bbv5-site .services .services-heading h2 { margin-top:var(--bbv5-home-label-gap); }
  .bbv5-site .editorial .editorial-top { padding-bottom:var(--bbv5-home-label-gap); }
  .bbv5-site .intro .intro-label { margin-bottom:var(--bbv5-home-label-gap); }
}
/* On small screens the Column section retains its structural 05 label;
   the decorative right-side tagline stays on desktop only. This also keeps
   the label-to-title spacing consistent with the preceding sections. */
@media (max-width:760px) {
  .bbv5-site .editorial .editorial-top > span:last-child { display:none; }
}