@charset "UTF-8";
@import url("https://fonts.cdnfonts.com/css/04b03");
@import url("https://cdn.jsdelivr.net/npm/galmuri/dist/galmuri.css");
@font-face {
  font-family: "morris9";
  src: url("./css/fonts/morris9.woff") format("woff"), url("./css/fonts/morris9.ttf") format("truetype");
  font-weight: normal;
}

html, body { height:100dvh; margin:0; padding:0; }

:root{
  --pill-bg:#5a4038;
  --pill-lite:#e6cdb4;
  --pill-dark:#2c1d19;
  --enter-shift-x:0px;
  --enter-shift-y:0px;
  --logo-max:clamp(420px, 34vw, 680px);
  --pill-h:34px;
  --pill-pad-x:16px;
}

.wrapper{ position:relative; width:100vw; height:100dvh; overflow:hidden; }
.wrapper > .inner{ position:static; width:100%; height:100%; text-align:center; }

.index-logo{
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%, -50%) translate(var(--enter-shift-x), var(--enter-shift-y));
  transform-origin:50% 50%;
  margin:0; padding:0;
  display:flex; flex-direction:column; align-items:center; gap:12px;
  z-index:5;
}
.index-logo img{ display:block; width:var(--logo-max); height:auto; max-width:none; filter:drop-shadow(0 18px 40px rgba(0,0,0,.45)); }
.index-logo p{ display:inline-block; margin:0; padding:0; }
.index-logo a,
.index-logo a:link,
.index-logo a:visited,
.index-logo a:hover,
.index-logo a:active{ color:inherit !important; text-decoration:none; display:inline-flex; flex-direction:column; align-items:center; gap:12px; }

.txt-default{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:420px;
  height:var(--pill-h);
  padding:0 var(--pill-pad-x);
  margin:0 6px;
  font-family:"Galmuri14","04b03","morris9",sans-serif;
  font-size:14px;
  line-height:1;
  letter-spacing:.02em;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
  background:none !important;
  border:0 !important;
  isolation:isolate;
  white-space:nowrap;
}
.txt-default::before{
  content:"";
  position:absolute; inset:0;
  background:var(--pill-bg);
  border-radius:9999px;
  box-shadow:inset 0 0 0 1px var(--pill-dark), 0 3px 0 var(--pill-dark);
  z-index:-1; pointer-events:none;
}
.txt-default::after{
  content:"";
  position:absolute; inset:-2px;
  border-radius:9999px;
  background:transparent;
  box-shadow:0 0 0 2px var(--pill-lite), 0 0 0 3px var(--pill-dark);
  z-index:-2; pointer-events:none;
}

@media (max-width:640px){
  :root{ --logo-max:clamp(320px, 48vw, 520px); }
}

/* 박스 가로 확장 + 텍스트 정중앙 */
:root{
  --pill-w: 560px;   
  --pill-pad-x: 22px;
}

.txt-default{
  min-width: var(--pill-w);
  padding: 0 var(--pill-pad-x) !important;
  display: inline-flex;
  align-items: center;   /* 세로 중앙 */
  justify-content: center;/* 가로 중앙 */
  text-align: center;
}

/* 텍스트 중앙 보정(박스는 그대로) */
:root{ --pill-text-shift: 9px; }          

.txt-default{
  display:inline-flex; align-items:center; justify-content:center;
  transform: translateY(var(--pill-text-shift));         
}
.txt-default::before,
.txt-default::after{
  transform: translateY(calc(var(--pill-text-shift) * -1));
}