@charset "UTF-8";
/* 森口电竞：工作室首页与原有玻璃档案共用同一套阅读系统。 */
.wordmark-copy { display:flex; flex-direction:column; gap:8px; }
.wordmark-copy>small { font-size:12px; font-weight:400; letter-spacing:.04em; color:var(--muted); }
.is-studio { --bg:#f1f1e8; --ink:#1a2b24; --muted:#687067; --line:#d7dbcd; --accent:#345c42; --studio-green:#173d32; --studio-lime:#d0ef7c; --studio-font:"Bahnschrift","DIN Alternate",sans-serif; background:var(--bg); }
.is-studio #main { overflow:clip; }
.studio-wrap { width:min(1248px,calc(100% - 112px)); margin-inline:auto; }
.is-studio .site-header { position:relative; height:112px; padding-inline:max(56px,calc((100% - 1248px)/2)); }
.is-studio .wordmark { flex-direction:row; align-items:center; gap:12px; }
.is-studio .wordmark>.studio-logo { width:42px; height:42px; display:block; color:var(--studio-green); }
.studio-logo svg { display:block; width:100%; height:100%; }
.is-studio .wordmark>.wordmark-copy { font-family:var(--body); font-size:23px; font-weight:700; line-height:1; letter-spacing:.09em; gap:7px; }
.is-studio .wordmark-copy>small { font-family:var(--studio-font); font-size:9px; letter-spacing:.19em; }
.is-studio .site-header nav { gap:31px; }
.is-studio .site-header nav a { font-size:12px; padding-block:11px; }
.is-studio .site-header nav .nav-contact { border:1px solid #244c36; padding:12px 19px; color:var(--studio-green); display:flex; gap:25px; align-items:center; }
.is-studio .site-header nav .nav-contact::after { display:none; }
.is-studio .nav-contact:hover { background:var(--studio-lime); }
.studio-eyebrow { display:flex; align-items:center; gap:10px; margin:0; font-family:var(--studio-font),var(--body); font-size:11px; font-weight:400; letter-spacing:.1em; line-height:1.8; }
.studio-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:#47744b; flex-shrink:0; }
.studio-hero { display:grid; grid-template-columns:1fr 1.04fr; gap:36px 66px; padding-top:29px; padding-bottom:28px; }
.studio-hero-copy { align-self:center; padding-bottom:20px; }
.studio-hero h1 { font-size:clamp(42px,4.65vw,69px); line-height:1.32; font-weight:650; letter-spacing:-.06em; margin:23px 0 25px; }
.hero-underline { position:relative; isolation:isolate; white-space:nowrap; }
.hero-underline::after { content:""; position:absolute; inset:auto 7px 3px 0; height:17px; background:var(--studio-lime); z-index:-1; transform:rotate(-2deg); }
.hero-description { font-size:14px; color:#697267; line-height:2; margin:0; }
.hero-mobile-break { display:none; }
.hero-actions { display:flex; align-items:center; gap:30px; margin-top:31px; }
.studio-button { display:inline-flex; align-items:center; justify-content:space-between; gap:33px; min-height:50px; padding:14px 22px; background:var(--studio-green); color:#f7faec; font-size:12px; border:1px solid var(--studio-green); transition:background .25s,color .25s; }
.studio-button:hover { background:#295442; }
.studio-button>span { font-size:18px; line-height:1; }
.studio-text-link { display:inline-flex; align-items:center; gap:22px; font-size:12px; padding-block:13px; }
.studio-text-link:hover { text-decoration:underline; text-underline-offset:6px; }
.hero-caption { display:flex; align-items:center; gap:10px; color:#81877a; font-size:10px; margin-top:38px; }
.caption-line { width:23px; height:1px; background:#879478; }
.studio-board { position:relative; min-height:479px; background:#163c30; overflow:hidden; isolation:isolate; color:#ebf1d6; clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px)); }
.board-map { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.studio-board::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#0d251921,transparent 40%,#102e2099); z-index:-1; pointer-events:none; }
.board-topline { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:24px 25px; font-size:9px; font-family:var(--studio-font); letter-spacing:.1em; color:#d7e8bc; }
.board-topline>span:first-child { display:flex; align-items:center; gap:8px; }
.board-topline .studio-dot { width:5px; height:5px; background:#cbf36c; }
.board-watermark { position:absolute; top:55px; right:24px; font-size:120px; font-weight:800; letter-spacing:-.1em; line-height:1; color:#d5f89b; opacity:.08; writing-mode:vertical-rl; }
.board-mission { position:absolute; top:39%; left:25px; right:25px; display:flex; align-items:center; gap:15px; }
.mission-cross { font-family:var(--studio-font); font-size:37px; font-weight:200; color:var(--studio-lime); line-height:1; }
.board-mission small { display:block; font-family:var(--studio-font); letter-spacing:.14em; font-size:9px; color:#c0d8a5; }
.board-mission strong { display:block; font-size:26px; font-weight:500; letter-spacing:.02em; margin-top:10px; }
.board-coordinate { position:absolute; top:63%; left:27px; right:27px; display:flex; justify-content:space-between; gap:15px; color:#a9c79b; font-family:var(--studio-font); font-size:8px; letter-spacing:.06em; }
.board-bottom { position:absolute; inset:auto 25px 23px; display:flex; align-items:flex-end; justify-content:space-between; gap:18px; border-top:1px solid #d0ef7c44; padding-top:19px; }
.board-bottom small { display:block; font-family:var(--studio-font); font-size:9px; letter-spacing:.14em; color:#b0c79c; margin-bottom:6px; }
.board-bottom strong { font-family:var(--studio-font); font-size:45px; font-weight:400; line-height:1; }
.board-bottom strong>span { font-family:var(--body); font-size:10px; margin-left:6px; font-weight:400; color:#c3d7b2; }
.board-callsigns { display:flex; flex-direction:column; gap:8px; font-size:10px; }
.board-callsigns span { display:flex; align-items:center; gap:7px; }
.board-callsigns i { width:4px; height:4px; background:var(--studio-lime); transform:rotate(45deg); }
.studio-facts { grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr 1.3fr auto; align-items:center; border-top:1px solid var(--line); margin-top:12px; padding-top:23px; }
.studio-facts>div { display:flex; align-items:center; gap:15px; padding-inline:28px; border-left:1px solid var(--line); }
.studio-facts>div:first-child { padding-left:0; border:0; }
.studio-facts strong { font-family:var(--studio-font); font-size:35px; font-weight:400; letter-spacing:-.04em; white-space:nowrap; }
.studio-facts>div>span { display:flex; flex-direction:column; font-size:11px; gap:5px; }
.studio-facts small { color:#7b8475; font-size:9px; }
.studio-facts>a { font-size:11px; display:flex; gap:28px; padding-block:12px; }
.studio-strip { display:flex; justify-content:center; align-items:center; gap:42px; padding:21px 28px; margin-top:14px; overflow:hidden; white-space:nowrap; background:var(--studio-green); color:#d1e5af; font-family:var(--studio-font),var(--body); font-size:11px; letter-spacing:.08em; }
.studio-strip i { font-size:17px; color:var(--studio-lime); font-style:normal; }
.studio-services,.studio-about { padding-block:92px; scroll-margin-top:28px; }
.studio-section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:35px; margin-bottom:35px; }
.studio-section-head .studio-eyebrow,.studio-about .studio-eyebrow { color:#77866a; font-size:10px; }
.studio-section-head h2 { font-size:34px; font-weight:550; line-height:1.5; letter-spacing:-.035em; margin:12px 0 0; }
.studio-section-head h2>span { margin-left:7px; }
.studio-section-head>p { font-size:12px; line-height:1.9; color:#788071; margin:0 0 4px; }
.service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid #cbd2bf; }
.service-card { display:block; min-height:322px; padding:27px 29px 24px; background:#f5f5ed; transition:background .25s; }
.service-card+ .service-card { border-left:1px solid #cbd2bf; }
.service-card:hover { background:#e4ebd7; }
.service-card-featured { background:#e7edda; }
.service-top { display:flex; justify-content:space-between; align-items:flex-start; gap:15px; }
.service-top>span { font-family:var(--studio-font); font-size:9px; letter-spacing:.07em; color:#7a876a; }
.service-top>svg { width:42px; height:42px; color:#36583b; }
.service-card h3 { font-size:31px; font-weight:500; letter-spacing:.1em; margin:17px 0 13px; }
.service-card p { font-size:12px; line-height:1.95; margin:0; color:#6b7661; }
.service-tags { display:flex; gap:8px; margin-top:18px; }
.service-tags>span { font-size:9px; padding:4px 7px; background:#cad6b733; border:1px solid #b8c7a255; color:#657756; }
.service-link { display:flex; justify-content:space-between; align-items:center; font-size:11px; border-top:1px solid #bdc8b377; margin-top:25px; padding-top:18px; }
.service-link>span { font-size:19px; transition:transform .2s; }
.service-card:hover .service-link>span { transform:translate(3px,-3px); }
.service-footnote { font-size:10px; color:#818a77; margin:17px 0 0; }
.service-footnote>span { margin-right:8px; }
.studio-crew { padding:69px 0 74px; background:#e5e9db; scroll-margin-top:0; }
.crew-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.crew-member { min-width:0; }
.crew-portrait { position:relative; aspect-ratio:1; overflow:hidden; isolation:isolate; background:#2f4a38; color:#e9f0de; border-radius:12px; }
.crew-avatar { display:block; width:100%; height:100%; object-fit:cover; }
.crew-portrait::after { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 0 1px #ffffff38; background:linear-gradient(180deg,#102c2012,transparent 28%,transparent 68%,#102c2073); }
.crew-portrait-2 { background:#424d37; color:#c9d39f; }
.crew-portrait-3 { background:#304c49; color:#9ec9b9; }
.portrait-corner { position:absolute; top:16px; left:16px; z-index:1; padding:8px 11px; border:1px solid #ffffff50; border-radius:30px; background:#173d32b8; color:#f7faed; font-family:var(--studio-font); font-size:9px; letter-spacing:.11em; }
.portrait-bottom { position:absolute; inset:auto 16px 16px; z-index:1; display:flex; justify-content:space-between; align-items:center; gap:10px; padding:11px 12px; border:1px solid #ffffff47; border-radius:8px; background:#173d32ad; font-family:var(--studio-font); font-size:8px; letter-spacing:.08em; color:#f0f6e5; }
.crew-info { padding-top:18px; }
.crew-info h3 { font-size:17px; font-weight:550; margin:0 0 10px; overflow-wrap:anywhere; }
.crew-info>span { display:flex; justify-content:space-between; color:#7c8670; font-size:10px; }
.studio-journal { padding-top:84px; background:#eff0e5; scroll-margin-top:20px; }
.studio-journal .studio-section-head { margin-bottom:25px; }
.studio-journal .feature-stage { height:565px; min-height:500px; max-height:85svh; background:#eaece1; }
.studio-journal #glass-scene { mask-image:radial-gradient(ellipse 80% 90% at 50% 50%,#000 44%,transparent 100%); }
.studio-journal .feature-media { top:14%; bottom:17%; right:6%; }
.studio-journal .feature-copy h2 { font-size:25px; }
.studio-journal .archive-close { top:27px; }
.studio-journal .archive-navigation { left:max(56px,calc((100% - 1248px)/2)); bottom:54px; }
.studio-journal #feature-position { font-size:29px; }
.studio-journal .scene-guide { top:48px; font-size:10px; }
.studio-journal .show-articles { bottom:18px; }
.studio-journal .archive { width:min(1248px,calc(100% - 112px)); padding-block:42px 55px; }
.studio-journal .archive-head h2 { font-size:17px; }
.studio-journal .entry { min-height:73px; }
.studio-journal .entry-title { font-size:14px; }
.studio-journal .entry-category { font-size:11px; }
.studio-journal .post-meta time { font-size:10px; }
.studio-about { display:grid; grid-template-columns:1fr 1fr; gap:90px; }
.about-copy h2 { font-size:37px; font-weight:550; letter-spacing:-.035em; line-height:1.5; margin:16px 0 24px; }
.about-copy>p:not(.studio-eyebrow) { font-size:12px; color:#75806a; line-height:2.05; max-width:410px; margin:0 0 14px; }
.studio-timeline { list-style:none; padding:0; margin:15px 0 0; }
.studio-timeline li { position:relative; display:grid; grid-template-columns:95px 1fr; gap:24px; padding:2px 0 30px 22px; border-left:1px solid #cbd2be; }
.studio-timeline li:last-child { border-left-color:transparent; padding-bottom:0; }
.studio-timeline li::before { content:""; position:absolute; width:6px; height:6px; top:7px; left:-4px; border-radius:50%; background:#69854e; }
.studio-timeline .timeline-future::before { background:var(--bg); border:1px solid #69854e; width:7px; height:7px; left:-4.5px; }
.timeline-date { font-family:var(--studio-font); font-size:12px; line-height:1.8; color:#758466; }
.studio-timeline h3 { font-size:15px; line-height:1.6; font-weight:500; margin:0 0 9px; }
.studio-timeline h3>small { display:inline-block; font-size:8px; font-weight:400; padding:3px 5px; background:#e0e6d3; color:#6b7b58; vertical-align:middle; margin-left:8px; }
.studio-timeline p { font-size:11px; line-height:1.9; color:#859076; margin:0; }
.studio-contact { padding:36px 41px 25px; margin-bottom:45px; background:var(--studio-green); color:#eef3dd; scroll-margin-top:32px; }
.contact-kicker { display:flex; align-items:center; gap:8px; font-family:var(--studio-font); font-size:9px; letter-spacing:.1em; color:#bdcfaa; }
.contact-kicker .studio-dot { background:var(--studio-lime); }
.contact-main { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; margin-top:27px; }
.contact-main h2 { font-size:48px; letter-spacing:-.03em; line-height:1.35; font-weight:500; margin:0; }
.contact-details p { font-size:12px; line-height:1.9; margin:0 0 17px; color:#bfceaf; }
.contact-details .studio-button { background:var(--studio-lime); color:var(--studio-green); border-color:var(--studio-lime); }
.contact-pending { display:block; color:var(--studio-lime); font-size:11px; }
.contact-details .studio-text-link { padding-bottom:0; gap:33px; font-size:11px; }
.contact-bottom { display:flex; justify-content:space-between; gap:20px; border-top:1px solid #d0ef7c33; padding-top:18px; margin-top:35px; color:#a0b890; font-family:var(--studio-font),var(--body); font-size:9px; letter-spacing:.04em; }
.is-studio .site-footer { width:min(1248px,calc(100% - 112px)); font-size:10px; min-height:96px; }
.is-studio .site-footer>span { display:flex; align-items:center; gap:22px; }
.is-studio .site-footer small { font-family:var(--body); font-size:9px; color:#8a927e; }
.is-studio .site-footer .footer-archive { font-family:var(--body); font-size:10px; }
.is-studio .is-reading { background:var(--bg); }
.is-studio.reading-dark { --bg:#222b24; --ink:#e4ebd9; --muted:#a2af93; --line:#485340; }
.is-studio.reading-dark .studio-logo { color:#c4d6b1; }
.is-studio.reading-dark .site-header nav .nav-contact { color:#c4d6b1; border-color:#758867; }
@media (min-width:1500px) { .studio-hero h1 { font-size:72px; } .studio-board { min-height:515px; } }
@media (max-width:1050px) {
 .studio-wrap,.studio-journal .archive,.is-studio .site-footer { width:calc(100% - 64px); }
 .is-studio .site-header { padding-inline:32px; }
 .is-studio .site-header nav { gap:22px; }
 .studio-hero { gap:32px; }
 .studio-hero h1 { font-size:48px; }
 .studio-board { min-height:440px; }
 .board-mission strong { font-size:22px; }
 .board-topline { padding-inline:20px; font-size:8px; }
 .board-coordinate { font-size:7px; left:22px; right:22px; }
 .studio-facts>div { padding-inline:18px; gap:10px; }
 .studio-facts strong { font-size:28px; }
 .studio-facts>a { gap:15px; }
 .studio-strip { gap:25px; font-size:9px; }
 .service-card { padding:24px 21px; }
 .service-card p { font-size:11px; }
 .studio-about { gap:45px; }
 .studio-timeline li { grid-template-columns:80px 1fr; gap:15px; }
 .studio-journal .archive-navigation { left:32px; }
}
@media (max-width:700px) {
 .studio-wrap,.studio-journal .archive,.is-studio .site-footer { width:calc(100% - 40px); }
 .is-studio .site-header,.is-studio.is-home .site-header,.is-studio.is-reading .site-header { height:auto; min-height:87px; padding:17px 20px; gap:14px; align-items:flex-start; flex-wrap:wrap; }
 .is-studio .wordmark { gap:9px; }
 .is-studio .wordmark>.studio-logo { width:34px; height:34px; }
 .is-studio .wordmark>.wordmark-copy { font-size:20px; }
 .is-studio.is-home .wordmark-copy>small { display:block; font-size:7px; letter-spacing:.17em; }
 .is-studio .site-header nav { gap:18px; flex:1 1 auto; justify-content:flex-end; align-self:center; }
 .is-studio .site-header nav a { font-size:10px; padding-block:9px; }
 .is-studio .site-header nav .nav-contact { padding:8px 10px; gap:12px; }
 .studio-hero { padding-top:29px; padding-bottom:24px; display:flex; flex-direction:column; gap:30px; }
 .studio-hero-copy { width:100%; padding-bottom:0; }
 .studio-hero h1 { font-size:clamp(43px,8.2vw,56px); margin:18px 0 21px; }
 .studio-eyebrow { font-size:10px; }
 .hero-description { font-size:12px; }
 .hero-actions { margin-top:24px; gap:25px; }
 .studio-button { font-size:11px; min-height:47px; padding:13px 18px; gap:25px; }
 .studio-text-link { font-size:11px; gap:15px; }
 .hero-caption { margin-top:24px; font-size:9px; }
 .studio-board { width:100%; min-height:365px; }
 .board-mission { top:37%; }
 .board-mission strong { font-size:25px; }
 .board-watermark { font-size:97px; }
 .board-coordinate { top:60%; font-size:7px; }
 .board-bottom { padding-top:14px; bottom:20px; }
 .board-bottom strong { font-size:37px; }
 .board-callsigns { gap:6px; font-size:9px; }
 .studio-facts { width:100%; display:grid; grid-template-columns:.8fr .9fr 1.15fr; margin-top:0; padding-top:20px; }
 .studio-facts>div { flex-direction:column; align-items:flex-start; gap:9px; padding-inline:15px; }
 .studio-facts>div>span { font-size:10px; gap:5px; }
 .studio-facts strong { font-size:27px; }
 .studio-facts small { font-size:8px; }
 .studio-facts>a { display:none; }
 .studio-strip { margin-top:0; gap:25px; padding:18px 20px; justify-content:flex-start; font-size:9px; }
 .studio-services,.studio-about { padding-block:57px; }
 .studio-section-head { flex-direction:column; align-items:flex-start; gap:14px; margin-bottom:25px; }
 .studio-section-head h2 { font-size:27px; margin-top:10px; }
 .studio-section-head h2>span { margin-left:4px; }
 .studio-section-head>p { font-size:11px; }
 .service-grid { grid-template-columns:1fr; }
 .service-card { padding:24px; min-height:0; }
 .service-card+.service-card { border-left:0; border-top:1px solid #cbd2bf; }
 .service-card h3 { margin-top:1px; font-size:28px; }
 .service-top>svg { width:38px; height:38px; }
 .service-card p { font-size:12px; }
 .service-tags { margin-top:14px; }
 .service-link { margin-top:21px; padding-top:15px; }
 .service-footnote { font-size:9px; line-height:1.8; }
 .studio-crew { padding-block:48px; }
 .crew-grid { grid-template-columns:1fr; gap:28px; }
 .crew-portrait { aspect-ratio:1; }
   .crew-info h3 { font-size:17px; margin-bottom:9px; }
 .crew-info { padding-top:14px; }
 .studio-journal { padding-top:53px; }
 .studio-journal .feature-stage { height:650px; min-height:610px; max-height:none; }
 .studio-journal .feature-media { width:auto; left:0; right:0; top:auto; height:295px; bottom:90px; }
 .studio-journal .feature-copy h2 { font-size:21px; }
 .studio-journal .archive-navigation { left:24px; right:24px; bottom:70px; }
 .studio-journal #feature-position { font-size:20px; }
 .studio-journal .archive-close { top:18px; }
 .studio-journal .show-articles { bottom:12px; }
 .studio-journal .scene-guide { display:none; }
 .studio-journal .archive { padding-block:30px 40px; }
 .studio-journal .archive-head { gap:12px; }
 .studio-journal .archive-head h2 { font-size:17px; }
 .studio-journal .entry { padding-block:17px; }
 .studio-about { grid-template-columns:1fr; gap:25px; }
 .about-copy h2 { font-size:32px; margin-bottom:20px; }
 .about-copy>p:not(.studio-eyebrow) { font-size:12px; }
 .studio-timeline { margin-left:3px; }
 .studio-timeline li { grid-template-columns:86px 1fr; }
 .studio-timeline h3 { font-size:14px; }
 .studio-contact { padding:27px 24px 22px; margin-bottom:27px; }
 .contact-main { grid-template-columns:1fr; gap:25px; margin-top:23px; }
 .contact-main h2 { font-size:42px; }
 .contact-details p { font-size:11px; }
 .contact-bottom { flex-direction:column; gap:10px; font-size:8px; margin-top:27px; }
 .is-studio .site-footer { min-height:93px; gap:15px; }
 .is-studio .site-footer>span { flex-direction:column; align-items:flex-start; gap:7px; }
 .is-studio .site-footer>div { gap:11px; }
 .is-studio .site-footer small { font-size:8px; }
}
@media (max-width:460px) {
 .is-studio .site-header { padding-bottom:12px; }
 .is-studio .site-header nav { flex-basis:100%; justify-content:space-between; gap:15px; padding-top:7px; border-top:1px solid #d7dbcd88; margin-top:3px; }
 .is-studio .site-header nav .nav-contact { padding:7px 11px; }
 .studio-hero { padding-top:17px; }
 .studio-hero h1 { font-size:45px; }
 .hero-underline::after { height:12px; bottom:0; }
 .hero-mobile-break { display:block; }
 .hero-actions { gap:22px; }
 .studio-button { gap:18px; }
 .studio-facts>div { padding-inline:13px; }
 .studio-facts strong { font-size:25px; }
 .studio-facts small { font-size:7px; }
}

/* Frosted surfaces retain an opaque fallback when backdrop filtering is absent. */
.is-studio .site-header nav { padding:7px 9px 7px 23px; gap:28px; border:1px solid #ffffffb0; border-radius:50px; background:#e9eddf; box-shadow:0 5px 22px #27483308,inset 0 1px 0 #ffffffc9; }
.is-studio .site-header nav .nav-contact { border-radius:30px; border-color:#234c3629; background:#ffffff5c; }
.studio-services { position:relative; isolation:isolate; }
.studio-services::before { content:""; position:absolute; width:360px; height:360px; right:-110px; bottom:-75px; z-index:-1; background:radial-gradient(circle,#cbe39f5c,transparent 68%); pointer-events:none; }
.service-grid { border:0; gap:14px; }
.service-card { position:relative; border:1px solid #ffffffc4; border-radius:16px; background:#f3f5ea; box-shadow:0 6px 22px #243f2c05,inset 0 1px 0 #ffffff; }
.service-card+.service-card { border:1px solid #ffffffc4; }
.service-card-featured { background:#e5ecd5; }
.service-card:hover { background:#e7eedb; }
.studio-contact { border:1px solid #d0ef7c2b; border-radius:18px; box-shadow:inset 0 1px 0 #ffffff12; background:radial-gradient(ellipse at 95% 0,#b8e57712,transparent 55%),var(--studio-green); }
.studio-button { border-radius:8px; box-shadow:inset 0 1px 0 #ffffff17; }
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
 .is-studio .site-header nav { background:#f9fbf28c; -webkit-backdrop-filter:blur(16px) saturate(135%); backdrop-filter:blur(16px) saturate(135%); }
 .service-card { background:#fafcf070; -webkit-backdrop-filter:blur(14px) saturate(120%); backdrop-filter:blur(14px) saturate(120%); }
 .service-card-featured { background:#dce9c57a; }
 .service-card:hover { background:#e8efdcaa; }
 .portrait-corner,.portrait-bottom { background:#173d3273; -webkit-backdrop-filter:blur(12px) saturate(135%); backdrop-filter:blur(12px) saturate(135%); }
}
.studio-scroll-progress { position:fixed; inset:0 0 auto; height:2px; z-index:100; background:#789b4a; transform:scaleX(0); transform-origin:left center; pointer-events:none; }
.studio-button>span,.studio-text-link>span { display:inline-block; }
.service-card:focus-visible,.studio-button:focus-visible,.studio-text-link:focus-visible { outline:2px solid #6b8c3d; outline-offset:5px; }
@media (prefers-reduced-motion:no-preference) {
 .studio-motion .hero-underline::after { transform-origin:left center; animation:studio-highlight .8s .32s cubic-bezier(.2,.7,.2,1) both; }
 .studio-motion .studio-board[data-map-active] .board-topline .studio-dot { animation:studio-signal 3.2s ease-out infinite; }
 .studio-motion .board-map { transform:translate3d(var(--board-x,0px),var(--board-y,0px),0) scale(1.045); transition:transform .85s cubic-bezier(.2,.7,.2,1); }
 .studio-button { transition:background .25s,color .25s,transform .3s,box-shadow .3s; }
 .service-card { transition:background .3s,transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s; }
 .studio-button>span,.studio-text-link>span { transition:transform .3s; }
 .crew-avatar { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
 .studio-strip i { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 .service-card:hover { transform:translateY(-5px); box-shadow:0 14px 28px #243f2c0c,inset 0 1px 0 #fff; }
 .studio-button:hover { transform:translateY(-2px); box-shadow:0 6px 18px #173d3218; }
 .studio-button:hover>span,.studio-text-link:hover>span { transform:translate(2px,-2px); }
 .crew-member:hover .crew-avatar { transform:scale(1.04); }
 .studio-strip:hover i { transform:rotate(90deg); }
}
@keyframes studio-highlight { from { transform:rotate(-2deg) scaleX(0); } to { transform:rotate(-2deg) scaleX(1); } }
@keyframes studio-signal { 0%,100% { box-shadow:0 0 0 0 #d0ef7c00; } 20% { box-shadow:0 0 0 0 #d0ef7c55; } 65% { box-shadow:0 0 0 8px #d0ef7c00; } }
@media (max-width:1050px) { .is-studio .site-header nav { gap:20px; padding-left:18px; } }
@media (max-width:700px) {
 .is-studio .site-header nav { gap:16px; padding:5px 7px 5px 16px; }
 .service-grid { gap:12px; }
 .service-card { border-radius:13px; }
 .is-studio .site-header nav,.service-card { -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
 .portrait-corner,.portrait-bottom { -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
 .studio-services::before { width:240px; height:300px; right:-75px; bottom:0; }
}
@media (max-width:460px) {
 .is-studio .site-header nav { gap:10px; padding:5px 7px 5px 15px; margin-top:0; border:1px solid #ffffffb0; }
 .is-studio .site-header nav .nav-contact { padding:8px 12px; }
}
@media (prefers-reduced-motion:reduce) {
 .studio-button,.studio-button>span,.studio-text-link>span,.service-card,.service-link>span,.crew-avatar,.board-map,.studio-strip i { transition:none; }
 .studio-motion .hero-underline::after,.studio-motion .board-topline .studio-dot { animation:none; }
 .studio-motion .board-map { transform:none; }
}
.studio-logo img { display:block; width:100%; height:100%; }
.crew-meta { display:flex; justify-content:space-between; align-items:center; gap:12px; min-height:25px; font-size:10px; color:#7c8670; }
.crew-role-founder { display:inline-flex; padding:5px 9px; border:1px solid #afc29170; border-radius:20px; background:#d7e8bf80; color:#385635; }
.crew-index { font-family:var(--studio-font); font-size:8px; letter-spacing:.06em; }
.studio-values { display:flex; align-items:center; gap:15px; margin-top:25px; }
.studio-values img { flex-shrink:0; }
.studio-values strong { display:block; font-size:12px; font-weight:500; letter-spacing:.04em; }
.studio-values small { display:block; margin-top:8px; color:#849073; font-family:var(--studio-font); font-size:8px; letter-spacing:.13em; }
.is-studio.reading-dark .studio-logo { padding:3px; border-radius:8px; background:#e5ebd6; }
.is-studio.reading-dark .site-header nav { background:#304233; border-color:#c1d5af26; box-shadow:inset 0 1px 0 #c1d5af12; }
.is-studio.reading-dark .site-header nav .nav-contact { background:#bacbab12; }

/* Water, five stars and a quiet path through the journal. */
.studio-hero { position:relative; isolation:isolate; }
.studio-hero>div { position:relative; z-index:1; }
.hero-water { position:absolute; inset:-30px -80px 70px; width:calc(100% + 160px); height:calc(100% - 40px); z-index:0; pointer-events:none; opacity:.92; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 85%,transparent); }
.hero-caption { flex-wrap:wrap; }
.water-hint { display:inline-flex; gap:6px; align-items:center; font-size:9px; color:#8c977d; opacity:.8; }
.water-hint>span { font-size:18px; }
.studio-rating { display:inline-flex; align-items:center; gap:4px; color:inherit; line-height:1; font-family:Arial,sans-serif; letter-spacing:0; white-space:nowrap; }
.rating-star { position:relative; display:inline-block; font-size:12px; color:currentColor; }
.rating-star-base { opacity:.22; }
.rating-star-fill { position:absolute; inset:0 auto 0 0; width:var(--star-fill,100%); overflow:hidden; }
.portrait-bottom .studio-rating { color:#d0ef7c; gap:6px; }
.portrait-bottom .rating-star { font-size:12px; }
.contact-bottom>span:last-child { display:flex; align-items:center; gap:12px; }
.journal-help { position:absolute; inset:auto max(56px,calc((100% - 1248px)/2)) 17px; display:flex; align-items:center; justify-content:space-between; gap:20px; z-index:6; font-size:11px; color:#66715d; border-top:1px solid #7a8b6324; padding-top:14px; }
.journal-help>span { display:flex; align-items:center; gap:10px; }
.journal-help small { font-size:10px; color:#89927c; margin-left:10px; }
.journal-help>a { display:inline-flex; align-items:center; gap:18px; padding:10px 16px; border:1px solid #ffffffba; border-radius:30px; background:#f4f7e8dc; color:#385137; box-shadow:0 3px 14px #173d3208; }
.journal-help>a:focus-visible { outline:2px solid #678645; outline-offset:3px; }
.journal-wheel { width:12px; height:18px; border:1px solid currentColor; border-radius:8px; position:relative; }
.journal-wheel::before { content:''; position:absolute; width:2px; height:5px; border-radius:2px; background:currentColor; top:3px; left:4px; }
.studio-journal .feature-stage { height:610px; max-height:none; }
.studio-journal .archive-navigation { bottom:94px; }
.studio-journal .show-articles { display:none; }
.studio-journal .scene-guide { display:none; }
.studio-journal .feature-media { bottom:23%; }
.studio-journal #archive { scroll-margin-top:30px; }
.is-studio .site-footer .footer-admin { font-size:10px; color:#768069; }
@media (prefers-reduced-motion:no-preference) {
 .studio-rating .rating-star { transition:color .25s,transform .3s; }
 .crew-member:hover .rating-star { animation:studio-star .6s calc(var(--star) * 65ms) ease both; }
 .studio-motion #feature-stage[data-journal-focus="true"] .journal-wheel::before { animation:studio-wheel 1.5s ease-in-out infinite; }
 .journal-help>a>span { transition:transform .3s; }
 .journal-help>a:hover>span { transform:translateY(3px); }
 .studio-button { position:relative; overflow:hidden; isolation:isolate; }
 .studio-button::after { content:''; position:absolute; inset:-100% auto -100% -55%; width:30%; background:linear-gradient(90deg,transparent,#ffffff20,transparent); transform:rotate(24deg) translateX(0); transition:left .65s; pointer-events:none; }
 .studio-button:hover::after { left:130%; }
 .studio-timeline li::before { transition:box-shadow .35s,transform .35s; }
 .studio-timeline li:hover::before { box-shadow:0 0 0 5px #afc98d38; transform:scale(1.15); }
}
@keyframes studio-star { 50% { transform:translateY(-2px); color:#e7f8ba; } }
@keyframes studio-wheel { 0%,100% { transform:translateY(0); opacity:.5; } 50% { transform:translateY(5px); opacity:1; } }
@media (max-width:1050px) { .journal-help { left:32px; right:32px; } }
@media (max-width:700px) {
 .hero-water { inset:0 -20px 90px; width:calc(100% + 40px); height:calc(100% - 90px); }
 .water-hint { display:none; }
 .studio-journal .feature-stage { height:690px; }
 .studio-journal .archive-navigation { bottom:122px; }
 .studio-journal .feature-media { bottom:150px; }
 .journal-help { left:20px; right:20px; bottom:20px; font-size:10px; gap:12px; }
 .journal-help>span { flex-wrap:wrap; gap:8px; max-width:160px; }
 .journal-help small { margin-left:20px; font-size:9px; }
 .journal-help>a { padding:11px 13px; gap:8px; flex-shrink:0; }
 .journal-wheel { display:none; }
 .contact-bottom>span:last-child { flex-wrap:wrap; }
}
@media (pointer:coarse),(prefers-reduced-motion:reduce) { .water-hint { display:none; } }
/* Customer notes drift across a quiet water surface. */
.studio-reviews { padding:72px 0 24px; overflow:hidden; }
.reviews-heading-action { display:flex; align-items:center; gap:30px; }
.review-open { display:inline-flex; align-items:center; gap:22px; border:1px solid #7b91684d; border-radius:30px; padding:13px 20px; background:#f8faefb3; color:#385137; font:inherit; font-size:12px; cursor:pointer; white-space:nowrap; }
.review-open>span { font-size:18px; }
.reviews-water { position:relative; margin:20px auto 0; padding:20px 0 24px; min-height:185px; background:radial-gradient(ellipse at 50% 100%,#c5ddba55,transparent 68%); }
.review-streams { display:grid; gap:22px; }
.review-lane { display:flex; align-items:flex-start; gap:26px; overflow-x:auto; padding:12px 24px 22px; }
.review-bottle { position:relative; width:248px; flex-shrink:0; box-sizing:border-box; border:1px solid #ffffffce; border-radius:31px; background:#f9fbf0ed; color:#385137; box-shadow:0 5px 16px #2c4f3208,inset 0 1px 0 #fff; transition:border-radius .32s ease,background .32s ease,box-shadow .32s ease,border-color .32s ease; }
.review-peek { display:block; width:100%; padding:12px 17px; border:0; border-radius:inherit; background:transparent; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.review-peek:focus-visible { outline:2px solid #88a367; outline-offset:-4px; }
.review-heading { display:flex; justify-content:space-between; align-items:center; gap:9px; min-width:0; }
.review-target { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; font-weight:600; line-height:1.4; }
.review-bottle .studio-rating,.review-stars { flex-shrink:0; color:#799b45; font-size:11px; letter-spacing:1px; white-space:nowrap; }
.review-preview { display:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-height:1.5em; margin-top:5px; color:#7b8b70; font-size:11px; line-height:1.5; transition:max-height .32s ease,margin-top .32s ease,opacity .22s ease,transform .32s ease; }
.review-details { display:grid; grid-template-rows:1fr; opacity:1; transition:grid-template-rows .32s ease,opacity .28s ease; }
.review-details-inner { min-height:0; overflow:hidden; }
.review-details p { margin:0 17px 12px; max-height:11.4em; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; font-size:12px; line-height:1.9; white-space:pre-wrap; overflow-wrap:anywhere; }
.review-details p:focus-visible { outline:1px solid #88a367; outline-offset:2px; }
.review-details small { display:block; margin:0 17px 17px; color:#8c9782; font-size:9px; }
.reviews-enhanced .review-preview { display:block; }
.reviews-enhanced .review-details { grid-template-rows:0fr; opacity:0; pointer-events:none; }
.reviews-enhanced .review-bottle.is-open { z-index:5; border-color:#a5ba8e99; border-radius:22px; background:#f9fbf2f5; box-shadow:0 14px 36px #2c4f321c,inset 0 1px 0 #fff; }
.reviews-enhanced .is-open .review-preview { max-height:0; margin-top:0; opacity:0; transform:translateY(-4px); }
.reviews-enhanced .is-open .review-details { grid-template-rows:1fr; opacity:1; pointer-events:auto; }
.reviews-animated { padding:14px 0 180px; mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.reviews-animated .review-lane { position:relative; display:block; height:66px; padding:0; overflow:visible; }
.reviews-animated .review-bottle { position:absolute; top:0; left:0; animation:review-drift var(--drift-time,24s) linear var(--drift-delay,0s) infinite; animation-play-state:paused; }
.reviews-drifting .reviews-animated .review-bottle { animation-play-state:running; }
.reviews-drifting .reviews-animated .review-bottle.is-open { animation-play-state:paused; }
.reviews-pause-hint { text-align:center; font-size:10px; color:#8b9881; margin:16px 20px 0; letter-spacing:.05em; line-height:1.8; }
.reviews-pause-hint>span { font-size:16px; margin-right:9px; }
.reviews-empty { display:flex; flex-direction:column; align-items:center; padding:5px 20px 10px; color:#8b9f76; }
.reviews-empty svg { transform:rotate(14deg); }
.reviews-empty p { font-size:13px; color:#556c49; margin:16px 0 8px; }
.reviews-empty small { font-size:10px; color:#8b9881; }
.review-dialog { width:min(490px,calc(100% - 32px)); max-height:calc(100dvh - 40px); overflow:auto; box-sizing:border-box; padding:38px; border:1px solid #ffffffdf; border-radius:24px; background:#f5f8ebf5; color:#30472e; box-shadow:0 30px 100px #173d3233; }
.review-dialog::backdrop { background:#233a2c42; backdrop-filter:blur(8px); }
.review-dialog h2 { font-size:25px; letter-spacing:-.03em; margin:12px 0; }
.review-dialog-intro { font-size:11px; line-height:1.8; color:#819074; margin-bottom:25px; }
.review-close { position:absolute; right:18px; top:14px; background:transparent; border:0; color:#69805a; font-size:25px; cursor:pointer; }
#review-form { display:grid; gap:16px; }
#review-form label { display:grid; gap:9px; font-size:11px; }
#review-form select,#review-form textarea { width:100%; box-sizing:border-box; border:1px solid #83986c35; border-radius:9px; padding:12px; background:#fffffaad; font:inherit; font-size:12px; color:#385137; }
#review-form textarea { resize:vertical; min-height:108px; line-height:1.8; }
#review-form select:focus,#review-form textarea:focus { outline:2px solid #9ebc7955; border-color:#78975a; }
.review-submit-help { font-size:10px; line-height:1.8; color:#839177; margin:0; }
#review-submit { border:0; cursor:pointer; justify-content:center; width:100%; }
#review-submit:disabled { opacity:.5; cursor:wait; }
#review-status { font-size:11px; line-height:1.8; color:#527638; margin:0; }
#review-status.is-error { color:#9b5144; }
@supports (backdrop-filter:blur(1px)) { .review-bottle { backdrop-filter:blur(10px); background:#f8fbefdf; } .review-dialog { backdrop-filter:blur(20px); background:#f5f8ebe8; } }
@keyframes review-drift { from { transform:translateX(-100%); } to { transform:translateX(calc(var(--drift-distance,1600px) - 100%)); } }
@media (max-width:700px) {
 .studio-reviews { padding-top:40px; }
 .reviews-heading-action { width:100%; justify-content:space-between; gap:14px; }
 .review-open { padding:10px 14px; font-size:10px; gap:9px; }
 .review-bottle { width:230px; }
 .review-dialog { padding:30px 22px; }
 .review-streams { gap:18px; }
}
@media (prefers-reduced-motion:reduce) {
 .review-bottle,.review-preview,.review-details { transition:none; }
 .reviews-animated { padding:0; mask-image:none; }
 .reviews-animated .review-lane { display:flex; height:auto; padding:12px 24px 22px; overflow-x:auto; }
 .reviews-animated .review-bottle { position:relative; animation:none; transform:none; }
}