@import url('/namako-rounded-font.css');

:root{--cream:#fff8e5;--ink:#53351e}body{margin:0;background:var(--cream);color:var(--ink)}
.header{box-sizing:border-box;max-width:1536px;margin:auto;padding:10px 3%;display:flex;align-items:center;gap:28px;border-bottom:2px solid #d9dfb0;position:sticky;top:0;z-index:30;background:var(--cream);font-family:"Yu Gothic",Meiryo,sans-serif;line-height:1.45}
.header a{text-decoration:none;color:inherit}.header .brand{width:210px;max-width:none;flex:none;font-size:inherit}.header .brand img{display:block;width:100%;height:auto}.header .desktop-nav{display:flex;align-items:center;justify-content:flex-end;gap:24px;flex:1;font-size:15px;font-weight:800}.header .contact-button{background:linear-gradient(#62ae24,#25800e);color:white;border:2px solid #4b9220;border-radius:40px;padding:10px 22px}.header .mobile-menu{display:none}.header a:focus-visible,.header summary:focus-visible{outline:3px solid #ef7b13;outline-offset:4px}
.namako-page-hero{box-sizing:border-box;position:relative;isolation:isolate;overflow:hidden;max-width:1536px;margin:0 auto;min-height:clamp(246px,24.6vw,378px);padding:clamp(28px,4.8vw,66px) 17% 28px 28%;background:none;border:0;border-radius:0;font-family:"Yu Gothic",Meiryo,sans-serif;color:#fffdf0;display:flex;flex-direction:column;justify-content:center;gap:24px}
.namako-page-hero::before{content:"";position:absolute;z-index:-1;inset:0;background-image:url('/namako-subpage-background.png');background-repeat:no-repeat;background-size:max(100%,1000px) auto;background-position:left bottom;background-position-y:calc(100% + max(0px,16.2vw));}
.namako-page-hero h1{box-sizing:border-box;margin:0;padding:14px 22px;border-radius:30px;background:rgba(37,73,106,.62);font-size:clamp(20px,2.05vw,30px);font-weight:800;line-height:1.3;color:#fffdf0;text-align:center;letter-spacing:.04em;overflow-wrap:anywhere}
.namako-page-hero .namako-page-description{box-sizing:border-box;margin:0 0 0 8%;padding:16px 22px;border-radius:24px;background:rgba(37,73,106,.62);font-size:clamp(14px,1.5vw,20px);line-height:1.65;color:#fffdf0;text-align:left;max-width:none;letter-spacing:normal}
.namako-page-hero--long{min-height:clamp(400px,40vw,614px)}
main{box-sizing:border-box}.namako-common-footer{max-width:1536px;margin:40px auto 0}.namako-common-footer img{width:100%;height:auto;display:block}.namako-common-footer .footer-line{display:flex;justify-content:center;align-items:center;gap:18px;padding:12px 4px;font-size:11px;white-space:nowrap;color:var(--ink)}.namako-common-footer a{color:inherit}
@media(max-width:1100px){.header{gap:14px}.header .desktop-nav{gap:14px;font-size:13px}.header .contact-button{padding:8px 14px}}
@media(max-width:700px){.header{position:relative;top:auto;padding:10px 16px;justify-content:space-between}.header .brand{width:170px;max-width:65%}.header .desktop-nav{display:none}.header .mobile-menu{display:block;position:relative}.header .mobile-menu summary{list-style:none;padding:8px 12px;border:1px solid #bfcd90;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer}.header .mobile-menu summary::-webkit-details-marker{display:none}.header .mobile-menu nav{position:absolute;right:0;top:48px;width:200px;padding:8px 16px;background:var(--cream);border:1px solid #bfcd90;border-radius:12px;box-shadow:0 8px 18px #53351e25}.header .mobile-menu nav a{display:block;padding:9px 0;border-bottom:1px solid #dfdfc7;font-size:14px}
.namako-page-hero{min-height:220px;padding:18px 12px 22px 46%;gap:14px;justify-content:flex-start}.namako-page-hero::before{background-size:820px auto;background-position:left bottom;background-position-y:calc(100% + 136px)}.namako-page-hero h1{font-size:clamp(17px,4.5vw,25px);padding:12px 9px;border-radius:18px;line-height:1.45}.namako-page-hero .namako-page-description{margin:0;padding:12px 10px;border-radius:16px;font-size:12px;line-height:1.65}.namako-page-hero--long{min-height:328px}.namako-common-footer .footer-line{gap:6px;font-size:clamp(6px,1.85vw,9px)}
}

.namako-page-hero::before{background-size:max(100%,1000px) auto;background-position:left top;background-position-y:calc(100% + max(100vw,1000px) * .1625183)}
@media(min-width:1536px){.namako-page-hero::before{background-size:1536px auto;background-position-y:calc(100% + 249.628px)}}
@media(max-width:700px){.namako-page-hero::before{background-size:820px auto;background-position-y:calc(100% + 133.265px)}}

.header,.namako-page-hero{font-family:"Zen Maru Gothic","Hiragino Maru Gothic ProN",sans-serif}
.header .desktop-nav,.header .mobile-menu summary,.namako-page-hero h1{font-weight:700}
.namako-page-hero .namako-page-description{font-weight:500;word-break:normal;overflow-wrap:anywhere}

/* Namako supplied menu icons: 20261014. Existing links and logo retained. */
.header .desktop-nav a:not(.contact-button),.header .mobile-menu nav a:not([href="/contact/"]){display:inline-flex;align-items:center;gap:6px}
.header nav a::before{content:"";display:none;width:46px;height:31px;flex:none;background-image:url('/namako-menu-icons-20261014.png');background-repeat:no-repeat;background-size:177.4px 88.7px;background-position:calc(var(--ix) * -1px) calc(var(--iy) * -1px)}
.header nav a:is([href="/"],[href="#top"]){--ix:14;--iy:0}
.header nav a:is([href="/#initiatives"],[href="#initiatives"],[href="/initiatives/"]){--ix:65;--iy:0}
.header nav a[href="/discography/"]{--ix:120;--iy:0}
.header nav a[href="/games/"]{--ix:14;--iy:31}
.header nav a[href="/free-materials/"]{--ix:65;--iy:31}
.header nav a:is([href="/#news"],[href="#news"]){--ix:120;--iy:31}
.header nav a[href="/activities/"]{--ix:14;--iy:60}
.header nav a:is([href="/#pickup"],[href="#pickup"]){--ix:120;--iy:60}
.header nav a:is([href="/"],[href="#top"],[href="/#initiatives"],[href="#initiatives"],[href="/initiatives/"],[href="/discography/"],[href="/games/"],[href="/free-materials/"],[href="/#news"],[href="#news"],[href="/activities/"],[href="/#pickup"],[href="#pickup"])::before{display:block}
.header .desktop-nav{gap:12px;flex-wrap:wrap;row-gap:6px}
@media(min-width:701px){.header .desktop-nav a:not(.contact-button){flex-direction:column;gap:1px;font-size:13px;white-space:nowrap}.header{gap:16px}}

.header nav a:is([href="/games/"],[href="/free-materials/"],[href="/#news"],[href="#news"])::before{height:29px}
