.site-header{position:fixed;inset:0 0 auto;z-index:100;height:0;border:0;background:none;backdrop-filter:none}
.site-header .header-inner{min-height:0;padding:0;display:block}
.site-header .wordmark{display:none}
.site-header .mobile-menu-btn{display:block;position:fixed;right:24px;top:20px;z-index:103;width:48px;height:48px;border-radius:50%;background:#f8f7f2ed;border:1px solid #20251f22;font-size:26px;line-height:1;box-shadow:0 2px 14px #0000000a}
.site-header .lang-switch{position:fixed;top:30px;right:92px;z-index:103;background:#f8f7f2ed;padding:6px 10px;border-radius:20px}
.site-header .nav{display:none;position:fixed;top:82px;left:auto;right:24px;width:min(360px,calc(100vw - 48px));max-height:calc(100svh - 110px);overflow:auto;background:#f8f7f2;border:1px solid #dcdcd2;padding:26px 30px;box-shadow:0 15px 40px #00000016;flex-direction:column;align-items:stretch;gap:5px}
.site-header .nav.open{display:flex}
.site-header .nav a{padding:12px 0}
.hero{height:100svh;min-height:500px;padding:0;display:flex;align-items:center;justify-content:center}
.hero::before{inset:0;background-size:cover;background-position:center}
.hero::after{background:#00000010}
.garden-visual-logo{margin:0;padding:20px;font-size:clamp(48px,8vw,100px);line-height:1.05;letter-spacing:-.045em;text-align:center;color:#fff;font-weight:700}
.hero-photo-credit{bottom:18px;right:20px;top:auto;font-size:8px}
.garden-introduction{padding:65px 0}
.garden-introduction .hero-copy{max-width:800px;margin:0 auto;font-size:17px;line-height:2.2;text-align:center}
.garden-flow{display:grid;grid-template-columns:1fr;gap:0;max-width:920px;margin:35px auto}
.garden-flow .process-step{display:grid;grid-template-columns:110px 1fr;gap:30px;padding:30px 0;border-bottom:1px solid var(--line);align-items:start}
.garden-flow .step-no{padding-top:5px;font-size:12px}
.garden-flow h3{font-size:19px;margin:0 0 12px}
.garden-flow p{font-size:13px;line-height:2;max-width:650px;margin:0}
.flow-option{display:inline-block;padding:3px 10px;background:#eadbc2;font-size:10px;margin-bottom:10px}
@media(max-width:640px){.site-header .mobile-menu-btn{right:16px;top:16px}.site-header .lang-switch{right:76px;top:26px}.site-header .nav{right:16px;top:76px;width:calc(100vw - 32px)}.hero{height:100svh;min-height:450px;padding:0}.hero::before{inset:0;background-position:50% 35%}.hero::after{background:#00000010}.garden-visual-logo{font-size:clamp(48px,12vw,76px)}.garden-introduction{padding:40px 0}.garden-introduction .hero-copy{font-size:14px;text-align:left}.garden-flow .process-step{grid-template-columns:70px 1fr;gap:15px;padding:25px 0}.garden-flow h3{font-size:17px}}

.work-samples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:50px 32px}
.work-sample{min-width:0}.work-sample-image{position:relative;aspect-ratio:3/2;overflow:hidden;background:#e7e2d8}.work-sample-image img{display:block;width:100%;height:100%;object-fit:cover}.work-sample-badge{position:absolute;bottom:14px;left:14px;background:#f8f7f2ed;padding:6px 10px;font-size:9px;letter-spacing:.08em}.work-sample-meta{padding:22px 0;border-bottom:1px solid var(--line)}.work-sample-meta h3{font-size:23px;line-height:1.6;margin:10px 0}.work-sample-meta p{font-size:13px;line-height:2;margin:0}.work-sample-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:100%;background:#e6ded0;color:#687066}.work-sample-placeholder span{font-size:28px;letter-spacing:.15em}.work-sample-placeholder small{font-size:10px;letter-spacing:.15em}@media(max-width:640px){.work-samples{grid-template-columns:1fr;gap:35px}.work-sample-meta h3{font-size:21px}}

/* Swipeable work gallery. */
.work-samples{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,calc((100% - 56px)/2.15));gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;padding:0 0 22px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#879182 #e3e4da}
.work-sample{scroll-snap-align:start}.work-samples:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
@media(max-width:700px){.work-samples{grid-template-columns:none;grid-auto-columns:84%;gap:20px}}

.work-tags{display:flex;flex-wrap:wrap;gap:7px 12px;padding:0;margin:18px 0 0;list-style:none}.work-tags li{font-size:11px;line-height:1.8;color:#687066;background:#e8ebe2;padding:3px 9px;border-radius:3px}

/* Smaller mobile work cards, gently looping without changing their shape. */
@media(max-width:700px){
.work-samples{position:relative;grid-auto-columns:clamp(205px,62vw,255px);gap:18px;scrollbar-width:none;padding-bottom:12px}
.work-samples::-webkit-scrollbar{display:none}
.work-samples.is-auto-moving{scroll-snap-type:none;scroll-behavior:auto}
.work-sample-meta{padding:15px 0}
.work-sample-meta h3{font-size:17px;line-height:1.6;margin:8px 0}
.work-sample-meta p{font-size:11px;line-height:1.9}
.work-sample-meta .section-no{font-size:9px}
.work-sample-badge{font-size:8px;left:9px;bottom:9px;padding:4px 7px}
.work-tags{gap:5px 6px;margin-top:12px}.work-tags li{font-size:9px;padding:2px 6px}
}
@media(prefers-reduced-motion:reduce){.work-samples{scroll-behavior:auto}}

/* Each work example is a single, lightly framed card. */
.work-sample{display:flex;flex-direction:column;background:#fffefa;border:1px solid #dcdcd2;border-radius:10px;overflow:hidden;box-shadow:0 3px 12px #20251f08}
.work-sample .work-sample-image{flex-shrink:0}
.work-sample .work-sample-meta{flex:1;padding:22px 20px 24px;border-bottom:0}
@media(max-width:700px){.work-sample .work-sample-meta{padding:16px 14px 18px}}

/* Reveal the small brand logo after the opening photograph. */
.site-header .wordmark{display:block;position:fixed;left:24px;top:17px;z-index:103;padding:8px 12px;background:#f8f7f2f2;border-radius:3px;font-size:21px;line-height:.95;letter-spacing:-.055em;opacity:0;visibility:hidden;transform:translateY(-8px);pointer-events:none;transition:opacity .25s,transform .25s,visibility .25s}
.site-header.has-scroll-logo .wordmark{opacity:1;visibility:visible;transform:none;pointer-events:auto}
@media(max-width:640px){.site-header .wordmark{left:16px;top:14px;font-size:18px;padding:8px}}
@media(prefers-reduced-motion:reduce){.site-header .wordmark{transition:none}}

/* Full-width backdrop behind the fixed logo, language switch and menu. */
.site-header::before{content:'';position:fixed;top:0;left:0;right:0;height:86px;background:rgba(248,247,242,.96);border-bottom:1px solid #dcdcd2;backdrop-filter:blur(12px);pointer-events:none}
.site-header .wordmark,.site-header .lang-switch,.site-header .mobile-menu-btn{background:transparent;box-shadow:none}
.site-header .mobile-menu-btn{border-color:transparent}
@media(max-width:640px){.site-header::before{height:78px}}

.site-header::before{opacity:0;transform:translateY(-100%);transition:opacity .25s,transform .25s}
.site-header.has-scroll-logo::before{opacity:1;transform:translateY(0)}
@media(prefers-reduced-motion:reduce){.site-header::before{transition:none}}

.site-header .lang-switch,.site-header .mobile-menu-btn{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s,visibility .25s}
.site-header.has-scroll-logo .lang-switch,.site-header.has-scroll-logo .mobile-menu-btn{opacity:1;visibility:visible;pointer-events:auto}
.site-header:not(.has-scroll-logo) .nav{display:none}
@media(prefers-reduced-motion:reduce){.site-header .lang-switch,.site-header .mobile-menu-btn{transition:none}}

#idea.story-section{display:block}#idea .story-content{max-width:960px;margin:0 auto;width:100%}


.text-scenes .shell{max-width:1000px}.text-scenes-intro{max-width:760px;margin-bottom:45px}.text-scenes h2{font-size:clamp(28px,4vw,40px);line-height:1.6;margin:0 0 30px}.text-scenes-intro h3{font-size:clamp(20px,3vw,27px);line-height:1.8;margin:0 0 25px}.text-scenes p{font-size:14px;line-height:2.2;margin:0 0 16px}.text-scene{padding:32px 0;border-top:1px solid var(--line)}.text-scene h3{font-size:18px;letter-spacing:.05em;line-height:1.7;margin:0 0 15px}.text-scene-name{margin-bottom:12px}.text-scenes .text-scene-examples{font-size:12px;margin-bottom:0;color:var(--muted)}@media(max-width:640px){.text-scenes p{font-size:13px}.text-scene h3{font-size:16px}.text-scene{padding:26px 0}}

.garden-visual-brand{position:relative;z-index:1;text-align:center;padding:0 24px}.garden-visual-brand .garden-visual-logo{padding:0}.garden-visual-tagline{color:#fff;font-size:clamp(13px,1.5vw,20px);line-height:1.9;letter-spacing:.07em;margin:26px 0 0}@media(max-width:640px){.garden-visual-tagline{font-size:13px;letter-spacing:.02em;margin-top:22px}}

.garden-brand-intro{padding:75px 0 45px}.garden-brand-intro .shell{max-width:1000px}.garden-brand-intro h2{font-size:clamp(25px,3.3vw,38px);line-height:1.8;letter-spacing:.025em;margin:0 0 18px}.garden-brand-intro p{font-size:15px;line-height:2.3;max-width:800px;margin:0 0 20px}.garden-brand-intro .brand-intro-english{font-size:14px;letter-spacing:.05em;margin-bottom:40px}.garden-making .shell{max-width:1000px}.garden-making> .shell>h2{font-size:clamp(26px,3vw,36px);line-height:1.7;margin:0 0 45px}.garden-making-list article{padding:32px 0;border-top:1px solid var(--line)}.garden-making-list h3{font-size:22px;line-height:1.8;margin:0 0 22px}.garden-making-list p{font-size:14px;line-height:2.3;max-width:800px;margin:0 0 18px}.garden-making-list p:last-child{margin-bottom:0}@media(max-width:640px){.garden-brand-intro{padding:45px 0 25px}.garden-brand-intro p,.garden-making-list p{font-size:13px}.garden-brand-intro h2{font-size:24px}.garden-making-list h3{font-size:19px}.garden-making-list article{padding:26px 0}}

.garden-brand-intro p{margin-bottom:6px;line-height:2}
.garden-brand-intro p:last-child{margin-bottom:0}

/* Text-only scenes in a manually swipeable gallery, matching WORK. */
.text-scenes-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,calc((100% - 56px)/2.15));gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:0 0 22px;scrollbar-width:thin;scrollbar-color:#879182 #e3e4da}
.text-scenes-list .text-scene{min-width:0;scroll-snap-align:start;padding:26px 22px;background:#fffefa;border:1px solid #dcdcd2;border-radius:10px;box-shadow:0 3px 12px #20251f08}
.text-scenes-list .text-scene h3{font-size:15px;line-height:1.8;overflow-wrap:anywhere;margin-bottom:18px}
.text-scenes-list .text-scene p{font-size:13px;line-height:2}
.text-scenes-list .text-scene-name{font-size:16px}
.text-scenes-list .text-scene-examples{font-size:11px}
.text-scenes-list:focus-visible{outline:2px solid var(--ink);outline-offset:6px}
@media(max-width:700px){.text-scenes-list{grid-auto-columns:clamp(230px,72vw,310px);gap:18px}.text-scenes-list .text-scene{padding:23px 18px}.text-scenes-list .text-scene p{font-size:12px}.text-scenes-list .text-scene h3{font-size:14px}}

.scene-use-tags{display:flex;flex-wrap:wrap;gap:7px 6px;list-style:none;padding:0;margin:20px 0 0}.scene-use-tags li{display:inline-block;background:#fff;border:1px solid #e2e2e2;border-radius:11px;padding:3px 10px;font-size:11px;line-height:1.7;font-style:normal;color:#555b52;max-width:100%;overflow-wrap:anywhere}@media(max-width:700px){.scene-use-tags{gap:6px;margin-top:17px}.scene-use-tags li{font-size:10px;padding:3px 9px}}

.garden-preparing{display:inline-block;margin-top:22px;padding:10px 24px;background:rgba(248,247,242,.72);border:1px solid rgba(255,255,255,.65);border-radius:0;color:#343e35;font-size:13px;font-weight:500;letter-spacing:.12em;line-height:1.6}
@media(max-width:640px){.garden-preparing{margin-top:18px;padding:9px 21px;font-size:12px}}