/* About portfolio: readable, compact collections that can grow by item. */
.site-head{background:rgba(21,56,44,.96);backdrop-filter:blur(12px)}
.head-inner{grid-template-columns:auto minmax(0,1fr) auto;gap:24px}
.head-actions{display:flex;align-items:center;gap:16px;white-space:nowrap;font-size:14px}
.back-to-mindhall{display:inline-flex;align-items:center;gap:7px;min-height:44px}
.back-to-mindhall:hover,.header-language:hover{color:#cee1d4}
.header-language{display:grid;place-items:center;min-width:38px;min-height:38px;border-left:1px solid rgba(255,255,255,.3);padding-left:16px;font-size:14px}
.service-tab{font-size:14px;padding:0 15px;color:#d1ded6}
.service-tab[aria-selected="true"]{color:#fff}
.service-tab small{display:none}
.personal-work-link{font-size:16px;line-height:1.8;color:var(--muted);padding:0 0 40px;margin-top:0}
.personal-work-link a{color:var(--moss);border-bottom:1px solid #a6b9ad;margin-left:8px}
.portfolio-intro{padding:124px 0 32px;background:var(--paper)}
.portfolio-label{display:block;font-size:15px;line-height:1.6;font-weight:600;color:var(--moss);letter-spacing:.02em}
.portfolio-intro :is(h1,.portfolio-main-title){font:400 clamp(34px,3.6vw,48px)/1.3 var(--serif);margin:12px 0 14px;text-wrap:balance}
.portfolio-intro>div>p{font-size:17px;line-height:1.75;color:var(--muted);margin:0}
.portfolio-jump{display:flex;gap:24px;flex-wrap:wrap;margin-top:22px}
.portfolio-jump a{font-size:16px;line-height:1.6;padding:3px 0;border-bottom:1px solid #9eb4a6;color:var(--moss)}
.portfolio-section{padding:34px 0 40px;scroll-margin-top:100px}
.portfolio-section-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:22px}
.portfolio-section-head h2{font:400 29px/1.4 var(--serif);margin:0}
.portfolio-section-head p{font-size:16px;line-height:1.6;color:var(--muted);margin:0}
.portfolio-products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.portfolio-product{min-width:0;background:#fff;border:1px solid var(--line);display:grid;grid-template-rows:220px 1fr}
.portfolio-product-image{display:block;overflow:hidden;background:#e5e9e2}
.portfolio-product-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.portfolio-product-image.contain{padding:15px;background:#eeeaf2}
.portfolio-product-image.contain img{object-fit:contain}
.portfolio-product-body{padding:26px 28px 24px;display:flex;flex-direction:column;align-items:flex-start}
.portfolio-product h3{font:400 27px/1.4 var(--serif);margin:10px 0 12px;text-wrap:pretty}
.portfolio-product p{font-size:17px;line-height:1.8;color:var(--muted);margin:0 0 18px}
.text-action{display:inline-flex;gap:6px;align-items:center;font-size:16px;font-weight:600;line-height:1.7;color:var(--moss);padding:2px 0;text-decoration:underline;text-decoration-color:#b5c6ba;text-underline-offset:5px}
.text-action:hover{color:var(--deep);text-decoration-color:var(--deep)}
.text-action.secondary{font-weight:400}
.portfolio-related{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:15px;line-height:1.8;margin-top:20px;padding-top:15px;border-top:1px solid var(--line);width:100%}
.portfolio-related>span{color:var(--muted)}
.portfolio-related a{color:var(--moss)}
.tools-section{background:#edf2ed}
.portfolio-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.portfolio-tool{display:grid;grid-template-columns:145px minmax(0,1fr);align-items:start;gap:24px;padding:26px;background:#fff;border:1px solid var(--line);min-width:0}
.tool-preview{display:block;background:#f4f0e6;overflow:hidden;border:1px solid var(--line)}
.miniapp-tool .tool-preview img{display:block;width:100%;height:auto}
.editor-tool .tool-preview{margin-top:24px;background:#eef1ed;aspect-ratio:1;display:flex;align-items:center}
.editor-tool .tool-preview img{width:100%;height:100%;object-fit:contain}
.tool-body{min-width:0}
.tool-body h3{font:400 29px/1.3 var(--serif);margin:8px 0 12px}
.tool-body p{font-size:17px;line-height:1.8;color:var(--muted);margin:0 0 14px}
.tool-tags{display:flex;gap:6px 14px;flex-wrap:wrap;font-size:15px;color:var(--moss);line-height:1.6;margin-bottom:16px}
.tool-actions{display:flex;gap:8px 20px;flex-wrap:wrap;margin-top:20px}
.miniapp-code summary{display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:16px;font-weight:600;color:var(--moss);padding:12px 0;cursor:pointer;border-top:1px solid var(--line);list-style:none}
.miniapp-code summary::-webkit-details-marker,.memory-work summary::-webkit-details-marker,.promotion-details summary::-webkit-details-marker{display:none}
.miniapp-code[open]>summary>span{transform:rotate(45deg)}
.miniapp-code-content{padding:10px 0 0}
.miniapp-code-content img{display:block;width:min(210px,100%);height:auto;background:white;margin:0 0 16px}
.miniapp-code-content p{font-size:16px}
.memory-section{background:var(--warm);padding:0}
.memory-work>summary{display:flex;justify-content:space-between;align-items:center;gap:35px;cursor:pointer;list-style:none;padding:34px 0}
.memory-work h2{font:400 31px/1.35 var(--serif);margin:8px 0 10px}
.memory-work summary p{font-size:17px;line-height:1.75;color:var(--muted);max-width:780px;margin:0}
.details-toggle{flex:none;display:flex;align-items:center;gap:14px;color:var(--moss);font-size:16px;font-weight:600;line-height:1.5}
.details-toggle i{font-style:normal;font-size:24px;font-weight:400;transition:transform .2s}
.memory-work[open] .details-toggle i,.promotion-details[open] .details-toggle i{transform:rotate(45deg)}
.memory-works-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;padding:0 0 24px}
.memory-works-grid article{min-width:0}
.memory-image{position:relative;display:block;width:100%;height:260px;border:0;background:#e8dfd0;padding:0;cursor:pointer;overflow:hidden;text-align:left;color:#fff}
.memory-image.proof-expand{top:auto;right:auto;box-shadow:none;min-height:0;justify-content:normal}.memory-image.proof-expand>span{display:block}
.memory-image img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.memory-works-grid article:first-child .memory-image.proof-expand{top:auto;right:auto;box-shadow:none;min-height:0;justify-content:normal}.memory-image.proof-expand>span{display:block}
.memory-image img{object-fit:contain;background:#fbf7ef}
.memory-image>span{position:absolute;bottom:12px;right:12px;padding:7px 12px;background:rgba(21,56,44,.94);font-size:15px;line-height:1.5}
.memory-works-grid h3{font:400 26px/1.4 var(--serif);margin:16px 0 9px}
.memory-works-grid p{font-size:17px;line-height:1.8;margin:0;color:var(--muted)}
.memory-method{display:flex;gap:12px 30px;justify-content:space-between;align-items:center;font-size:16px;line-height:1.75;color:var(--muted);padding:22px 0 30px;border-top:1px solid #d8cdbd;margin:0}
.portfolio-business-link{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-top:30px;padding-bottom:36px;font-size:16px;line-height:1.8;color:var(--muted)}
.promotion-case{background:#f3eee5;border:1px solid #e0d7c9;scroll-margin-top:100px}
.promotion-details>summary{padding:24px 28px;display:grid;grid-template-columns:1fr auto;gap:6px 25px;align-items:center;cursor:pointer;list-style:none}
.promotion-summary-title{grid-column:1;font:400 28px/1.4 var(--serif)}
.promotion-details .details-toggle{grid-column:2;grid-row:1/3}
.promotion-content{display:grid;grid-template-columns:190px minmax(0,1fr);gap:35px;padding:8px 28px 30px}
.promotion-frame{margin:0;min-width:0}
.promotion-frame img{display:block;width:100%;height:auto;max-height:290px;object-fit:contain;background:#e4ddd1}
.promotion-frame figcaption{font-size:15px;line-height:1.5;color:var(--muted);margin-top:10px}
.promotion-content h3{font:400 27px/1.45 var(--serif);margin:0 0 14px}
.promotion-content p{font-size:17px;line-height:1.8;color:var(--muted);margin:0 0 20px}
.promotion-flow{list-style:none;display:flex;gap:8px;flex-wrap:wrap;padding:0;margin:20px 0}
.promotion-flow li{font-size:16px;line-height:1.5;color:var(--moss)}
.promotion-flow li:not(:last-child):after{content:'→';margin-left:8px;color:#8a998e}
.promotion-offer{padding-top:15px;border-top:1px solid #d8cdbd}
.portfolio-section a:focus-visible,.portfolio-section button:focus-visible,.portfolio-section summary:focus-visible,.promotion-details summary:focus-visible,.head-actions a:focus-visible{outline:2px solid var(--moss);outline-offset:5px}
.head-actions a:focus-visible{outline-color:white}
@media(max-width:1100px){.head-inner{gap:14px}.service-tab{padding:0 10px;font-size:13px}.head-actions{gap:10px;font-size:13px}.portfolio-tool{grid-template-columns:110px minmax(0,1fr);gap:18px;padding:24px}.tool-body h3{font-size:27px}}
@media(max-width:850px){.head-inner{height:auto;min-height:108px;grid-template-columns:minmax(0,1fr) auto;gap:0 15px;padding-top:9px}.brand{min-height:42px}.head-actions{grid-column:2;grid-row:1}.service-nav-wrap{grid-column:1/-1;grid-row:2;width:100%;justify-self:stretch}.service-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));min-height:48px;height:48px}.service-tab{font-size:14px}.header-language{min-height:34px}.portfolio-intro{padding-top:142px}.portfolio-tools{grid-template-columns:1fr}.portfolio-tool{grid-template-columns:145px minmax(0,1fr)}.editor-tool .tool-preview{margin-top:0}.portfolio-section,.promotion-case{scroll-margin-top:130px}.portfolio-product{grid-template-rows:190px 1fr}.portfolio-product-body{padding:23px}.portfolio-product h3{font-size:25px}.memory-work>summary{gap:20px}.memory-method{align-items:flex-start;flex-direction:column}.portfolio-business-link{align-items:flex-start;flex-direction:column;gap:7px}.promotion-content{grid-template-columns:150px minmax(0,1fr);gap:25px}}
@media(max-width:600px){.head-inner{gap:0 8px}.brand span:last-child{display:inline;font-size:14px}.brand{gap:8px}.brand-mark{width:31px;height:31px}.back-to-mindhall{font-size:14px}.back-to-mindhall iconify-icon{display:none}.head-actions{gap:10px}.header-language{font-size:13px;padding-left:10px;min-width:26px}.service-tab{font-size:13px;white-space:normal;padding:0 5px;line-height:1.5}.portfolio-intro{padding-top:138px;padding-bottom:22px}.portfolio-intro :is(h1,.portfolio-main-title){font-size:34px;text-wrap:pretty}.portfolio-jump{gap:8px 20px;margin-top:18px}.portfolio-jump a{font-size:15px}.portfolio-section{padding:27px 0 30px}.portfolio-section-head{align-items:flex-start;flex-direction:column;gap:5px;margin-bottom:18px}.portfolio-section-head h2{font-size:27px}.portfolio-products{grid-template-columns:1fr;gap:18px}.portfolio-product{grid-template-rows:180px 1fr}.portfolio-product h3{font-size:26px}.portfolio-product-body{padding:23px}.portfolio-tool{grid-template-columns:100px minmax(0,1fr);gap:17px;padding:20px 17px}.tool-body h3{font-size:26px}.tool-body p{font-size:16px;line-height:1.75}.portfolio-label{font-size:15px}.tool-tags{font-size:15px;gap:5px 10px}.tool-actions{margin-top:12px}.memory-section{padding:0}.memory-work>summary{align-items:flex-start;flex-direction:column;padding:28px 0;gap:16px}.memory-work h2{font-size:28px}.memory-works-grid{grid-template-columns:1fr;gap:27px}.memory-image{height:240px}.memory-method{padding-bottom:26px}.promotion-details>summary{display:flex;align-items:flex-start;flex-direction:column;padding:24px;gap:8px}.promotion-summary-title{font-size:26px}.promotion-details .details-toggle{margin-top:5px}.promotion-content{grid-template-columns:1fr;padding:0 24px 26px}.promotion-frame{display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:end}.promotion-frame img{max-height:180px}.promotion-frame figcaption{margin:0}.promotion-content h3{font-size:25px}.personal-work-link{padding-bottom:30px}.personal-work-link a{margin-left:0;display:inline-block}}
@media(prefers-reduced-motion:reduce){.details-toggle i{transition:none}}

.portfolio-label .primary-note{font-weight:400;font-size:15px;color:var(--muted);margin-left:10px;display:inline-block}
.details-toggle .when-open{display:none}
details[open]>.details-toggle .when-closed,details[open]>summary .when-closed{display:none}
details[open]>summary .when-open{display:inline}
