@import url('fonts/zen-maru.css');

.language-picker{position:relative;flex:none}
.language-picker summary{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 14px;list-style:none;cursor:pointer;border:1px solid var(--purple);border-radius:15px 20px 14px 19px;background:var(--white);font-size:12px;font-weight:800;box-shadow:2px 4px 8px #32203e14;transform:rotate(-3deg);transition:background 150ms ease,transform 180ms var(--ease)}
.language-picker summary::before{content:'';position:absolute;left:18px;top:-6px;width:27px;height:11px;background:#bce4f1d9;transform:rotate(-12deg);pointer-events:none}
.language-picker summary::-webkit-details-marker{display:none}
.language-picker summary::marker{content:''}
.language-picker summary:hover,.language-picker[open] summary{background:var(--lilac);transform:rotate(0)}
.language-picker summary:active{transform:rotate(0) scale(.97)}
.language-picker summary:focus-visible{outline:3px solid var(--hotpink);outline-offset:5px}
.language-globe{width:17px;height:17px}
.language-chevron{width:11px;height:11px;transition:transform 160ms var(--ease)}
.language-picker[open] .language-chevron{transform:rotate(180deg)}
.language-paper{position:absolute;top:calc(100% + 16px);left:0;z-index:30;width:228px;padding:20px 13px 12px;background:var(--white);box-shadow:3px 9px 25px #32203e2b;transform:rotate(-1deg);transform-origin:top left}
.language-paper::before{content:'';position:absolute;top:-9px;left:76px;width:77px;height:20px;background:#f4dc72ba;transform:rotate(7deg)}
.language-note{display:block;font-size:15px;color:var(--purple);text-align:center;margin-bottom:10px;line-height:1.6}
.site-header .language-list{display:flex;flex-direction:column;gap:3px;width:100%;border:0;order:initial}
.site-header .language-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:44px;padding:9px 12px;font-size:14px;font-weight:600;border-radius:3px;line-height:1.4;text-decoration:none;transition:background 150ms ease}
.site-header .language-list a:hover{background:var(--paper);text-decoration:none}
.site-header .language-list a[aria-current=page]{background:var(--pink);font-weight:800}
.language-code{font-family:Manrope,'Zen Maru Gothic',sans-serif;font-size:10px;color:var(--muted)}
.language-link[aria-current=page] .language-code{font-size:18px;line-height:1;color:var(--ink)}
.language-picker [lang=ja]{font-family:'Zen Maru Gothic',sans-serif}

html[lang=ja] body{font-family:Manrope,'Zen Maru Gothic',sans-serif}
html[lang=ja] h1,html[lang=ja] h2,html[lang=ja] .idea-paper h3{font-family:'Zen Maru Gothic',sans-serif;font-weight:700;letter-spacing:-.025em;line-height:1.4}
html[lang=ja] .hand,html[lang=ja] .heartmade{font-family:'Shantell Sans','Zen Maru Gothic',sans-serif}
html[lang=ja] .hero-note{font-size:16px}
html[lang=ja] .hero-copy{font-size:21px;line-height:1.7}
html[lang=ja] .section-heading p,html[lang=ja] .about-copy p{line-height:1.9}
html[lang=ja] .sticker-frog>.hand{font-size:15px}
html[lang=ja] .hero-caption{font-size:12px}
html[lang=ja] .margin-note{font-family:'Zen Maru Gothic',sans-serif;font-size:22px}
html[lang=ja] .custom-intro h2{font-size:clamp(32px,3.7vw,48px)}
.custom-section{grid-template-columns:repeat(2,minmax(0,1fr))}
.custom-intro,.idea-paper{min-width:0}
html:not([lang=el]) .custom-star{right:0;top:-88px;font-size:80px;line-height:1}
html[lang=ja] .idea-paper label{line-height:1.6}
html:not([lang=el]) .card-title{flex-wrap:wrap}
html:not([lang=el]) .card-title h3{overflow-wrap:anywhere}
html:not([lang=el]) .privacy-main h1{overflow-wrap:anywhere}
html:not([lang=el]) .hero-note{max-width:100%}

@media(max-width:1100px){.site-header{padding-inline:30px}.language-picker summary{padding-inline:9px}.header-cta{gap:10px}}
@media(max-width:800px){.site-header{padding-inline:22px}.language-picker summary{font-size:12px;padding:8px 10px;gap:7px}.language-globe{width:16px;height:16px}.language-chevron{width:10px;height:10px}}
@media(max-width:680px){.site-header{padding-inline:19px}.header-cta{font-size:12px;padding:9px 12px;gap:9px;min-height:44px}.header-cta svg{width:19px;height:19px}.language-picker summary{min-height:44px}.language-paper{top:calc(100% + 13px)}}
@media(max-width:600px){
 .custom-section{grid-template-columns:minmax(0,1fr)}
 .language-picker summary{padding:8px 10px}.language-paper{width:216px}.language-note{font-size:14px}
 html:not([lang=el]) .hero-note{font-size:12px;margin-left:-12px;padding-inline:10px}
 html:not([lang=el]) .hero-copy{font-size:18px;line-height:1.6}
 html:not([lang=el]) .sticker-frog>.hand{font-size:10px;margin-left:-8px}
 html:not([lang=el]) .hero-caption{font-size:10px}
 html:not([lang=el]) .card-title h3{min-height:38px}
 html[lang=ja] .hero-note{font-size:11px}
 html[lang=ja] .hero-copy{font-size:17px;line-height:1.8}
 html[lang=ja] .hero-caption{font-size:11px}
 html[lang=ja] .custom-intro h2{font-size:32px}
 html:not([lang=el]) .custom-star{right:0;top:-51px;font-size:52px;line-height:1}
 html[lang=ja] .hero-sticker .hand{font-size:11px}
 html[lang=ja] .section-heading h2,html[lang=ja] .print-section h2{font-size:30px}
 html[lang=ja] .about-copy h2{font-size:34px}
 html[lang=ja] .idea-paper h3{font-size:21px}
 html[lang=ja] .privacy-main h1{font-size:30px}
 .idea-paper .button{gap:12px;white-space:normal}
}
@media(max-width:359px){.site-header{padding-inline:14px}.header-cta{font-size:11px;padding-inline:9px;gap:6px}.custom-intro h2{font-size:30px;overflow-wrap:anywhere}.custom-star{right:0;top:-51px;font-size:52px;line-height:1}}
@media(prefers-reduced-motion:reduce){.language-picker *{transition:none!important}}
