/*
 * EMOREN HOME — Editorial Gate v2 · 260816
 * 실사 부모 / 실사 아동 + 큰 조앤 B·힐링이 / 앰배서더 5인.
 * 문 선택 동작은 index.html의 기존 게이트 핸들러를 그대로 사용한다.
 */

body.gate-page{
  --side-w:0px;
  --top-h:0px;
  background:#f4f2ed;
}
body.gate-page #site-side,
body.gate-page #site-header,
body.gate-page #side-backdrop{ display:none!important; }
body.gate-page #home-wrap{ left:0!important; padding:0!important; }
body.gate-page #stage-bg{ display:none!important; }
body.gate-page #stage-wrap{
  background:
    radial-gradient(50vw 34vw at 4% -4%,rgba(213,230,222,.72),transparent 68%),
    radial-gradient(48vw 32vw at 100% 2%,rgba(241,218,226,.66),transparent 68%),
    linear-gradient(145deg,#f8f7f3 0%,#f2f0eb 48%,#f7f3f4 100%)!important;
}
body.gate-page #stage-wrap::before,
body.gate-page #stage-wrap::after{ display:none!important; }

.gate{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:100%;
  min-height:100svh;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto auto;
  gap:clamp(10px,1.3vh,16px);
  padding:clamp(12px,1.6vh,20px) clamp(12px,1.7vw,26px) clamp(12px,1.6vh,20px);
  color:#202b2a;
  font-family:'Pretendard','Noto Sans KR',system-ui,sans-serif;
}

/* header */
.gate-top{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:9px 11px 9px 16px;
  border:1px solid rgba(255,255,255,.92);
  border-radius:22px;
  background:rgba(255,255,255,.8);
  box-shadow:0 12px 36px rgba(47,55,52,.08),inset 0 1px 0 #fff;
  -webkit-backdrop-filter:blur(22px) saturate(1.12);
  backdrop-filter:blur(22px) saturate(1.12);
}
.gate-brand{ min-width:0; display:flex; align-items:center; gap:13px; }
.gate-brand img.gb-logo{
  width:auto;
  height:31px;
  display:block;
  filter:drop-shadow(0 5px 12px rgba(40,67,60,.12));
}
.gate-brandline{
  min-width:0;
  padding-left:13px;
  border-left:1px solid #deddd7;
  line-height:1.1;
}
.gate-brandline b{
  display:block;
  color:#6d746f;
  font-size:8.5px;
  font-weight:850;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.gate-brandline small{
  display:block;
  margin-top:4px;
  color:#969b96;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:-.01em;
}
.gate-award{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 13px 5px 6px;
  border:1px solid rgba(159,123,57,.24);
  border-radius:999px;
  background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(247,239,221,.9));
  box-shadow:0 6px 18px rgba(129,97,40,.08);
  white-space:nowrap;
}
.gate-award img{ width:26px; height:26px; object-fit:contain; display:block; }
.gate-award b{ display:inline-block; color:#6f5423; font-size:13.5px; line-height:1.05; font-weight:900; letter-spacing:-.025em; }
.gate-award span{ color:#9b8358; font-size:9.5px; font-weight:750; }
.gate-auth{ flex:none; display:flex; align-items:center; gap:8px; }
.gate-btn{
  min-height:42px;
  padding:0 18px;
  border-radius:13px;
  font:850 13.5px/1 inherit;
  letter-spacing:-.02em;
  cursor:pointer;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.gate-btn.ghost{
  color:#535e5b;
  border:1px solid #dedfdb;
  background:rgba(255,255,255,.86);
}
.gate-btn.ghost:hover{ color:#173e35; background:#fff; transform:translateY(-1px); }
.gate-btn.primary{
  color:#fff;
  border:1px solid #183f35;
  background:linear-gradient(135deg,#183f35,#295d4e);
  box-shadow:0 9px 22px rgba(24,63,53,.22),inset 0 1px 0 rgba(255,255,255,.18);
}
.gate-btn.primary:hover{ transform:translateY(-2px); box-shadow:0 14px 30px rgba(24,63,53,.29); }

/* two editorial entrance cards */
.gate-doors{
  min-height:clamp(430px,61vh,650px);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(12px,1.45vw,20px);
}
.gate-door{
  --door-accent:#1a8c68;
  --door-highlight:#91e8c5;
  --door-soft:#e5f2ed;
  --door-ink:#153e33;
  --door-shade:12,29,25;
  --door-bg:none;
  position:relative;
  isolation:isolate;
  min-width:0;
  min-height:100%;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:0;
  border:1px solid rgba(32,45,42,.11);
  border-radius:clamp(24px,2.15vw,34px);
  color:#fff;
  background:rgb(var(--door-shade));
  box-shadow:0 18px 48px rgba(32,39,37,.18),inset 0 1px 0 rgba(255,255,255,.24);
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  -webkit-appearance:none;
  appearance:none;
  transition:transform .38s cubic-bezier(.2,.8,.2,1),box-shadow .38s ease,border-color .38s ease;
}
.gate-door::before{
  content:'';
  position:absolute;
  z-index:0;
  inset:0;
  background-image:var(--door-bg);
  background-size:cover;
  background-position:var(--door-pos,center 38%);
  transform:scale(1.012);
  transition:transform 1s cubic-bezier(.2,.8,.2,1),filter .5s ease;
}
.gate-door::after{
  content:'';
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(var(--door-shade),.08) 0%,rgba(var(--door-shade),.02) 34%,rgba(var(--door-shade),.38) 58%,rgba(var(--door-shade),.88) 83%,rgba(var(--door-shade),.97) 100%),
    linear-gradient(90deg,rgba(var(--door-shade),.48) 0%,rgba(var(--door-shade),.16) 48%,transparent 76%);
}
.gate-door:hover{
  transform:translateY(-7px);
  border-color:rgba(32,45,42,.2);
  box-shadow:0 30px 72px rgba(47,55,52,.2),inset 0 1px 0 #fff;
}
.gate-door:hover::before{ transform:scale(1.06); filter:saturate(1.04) contrast(1.01); }
.gate-door:focus-visible{ outline:3px solid var(--door-accent); outline-offset:4px; }
.gate-door.guardian{
  --door-accent:#35ad82;
  --door-highlight:#98edcc;
  --door-soft:#e5f3ed;
  --door-ink:#164a3b;
  --door-shade:10,31,26;
  --door-bg:url('../gate-v2/guardian-parents-healingi-260821c.webp');
  --door-pos:center 39%;
}
.gate-door.academia{
  --door-accent:#df628f;
  --door-highlight:#ffb2cd;
  --door-soft:#fae9ef;
  --door-ink:#76344e;
  --door-shade:45,20,34;
  --door-bg:url('../gate-v2/academia-cast-integrated-260816.webp');
  --door-pos:center 38%;
}
.gate-door.guardian .gd-emblem{
  border-color:rgba(217,181,105,.62);
  background:linear-gradient(145deg,rgba(255,251,241,.94),rgba(224,231,238,.82));
  box-shadow:0 13px 32px rgba(7,28,48,.22),inset 0 1px 0 rgba(255,255,255,.95);
}
.gd-emblem{
  position:absolute;
  z-index:3;
  top:18px;
  left:18px;
  box-sizing:border-box;
  width:clamp(70px,7vw,96px);
  height:clamp(76px,7.5vw,104px);
  display:block;
  object-fit:contain;
  margin:0;
  padding:7px;
  border:1px solid rgba(255,255,255,.78);
  border-radius:22px;
  background:rgba(255,255,255,.68);
  box-shadow:0 12px 30px rgba(25,37,34,.13),inset 0 1px 0 rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(12px) saturate(1.1);
  backdrop-filter:blur(12px) saturate(1.1);
  filter:drop-shadow(0 7px 10px rgba(32,45,42,.12));
  transition:transform .38s cubic-bezier(.2,.8,.2,1);
}
.gate-door:hover .gd-emblem{ transform:translateY(-3px) rotate(-2deg); }
.gd-index{
  position:absolute;
  z-index:3;
  top:20px;
  right:20px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:32px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.65);
  border-radius:999px;
  color:#fff;
  background:rgba(20,29,27,.34);
  box-shadow:0 8px 20px rgba(20,29,27,.12);
  -webkit-backdrop-filter:blur(13px);
  backdrop-filter:blur(13px);
  font-size:9.5px;
  font-weight:900;
  letter-spacing:.14em;
}
.gd-index b{ font-size:11px; letter-spacing:.03em; }
.gate-door .gd-body{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:7px;
  padding:clamp(19px,2vw,28px) clamp(20px,2.35vw,32px) clamp(23px,2.2vw,30px);
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
}
.gate-door .gd-body::before{
  content:'';
  position:absolute;
  left:clamp(20px,2.35vw,32px);
  top:6px;
  width:54px;
  height:3px;
  border-radius:0 0 99px 99px;
  background:var(--door-accent);
}
.gd-kicker{
  display:flex;
  align-items:center;
  gap:8px;
  padding:0;
  border:0;
  border-radius:0;
  color:var(--door-highlight);
  background:none;
  font-size:9.5px;
  font-weight:950;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.gd-kicker::before{ content:''; width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 0 4px rgba(255,255,255,.12); }
.gd-title{
  color:#fff;
  font-size:clamp(27px,2.75vw,38px);
  font-weight:920;
  letter-spacing:-.055em;
  line-height:1.08;
  text-shadow:0 3px 18px rgba(0,0,0,.35);
}
.gd-title em{ color:var(--door-highlight); font-style:normal; }
.gd-desc{
  max-width:44ch;
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:clamp(11.5px,.98vw,13.5px);
  font-weight:650;
  line-height:1.55;
  letter-spacing:-.025em;
  word-break:keep-all;
  text-shadow:0 2px 12px rgba(0,0,0,.3);
}
.gd-chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:1px; }
.gd-chips span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  color:rgba(255,255,255,.9);
  background:rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  font-size:9.5px;
  font-weight:820;
}
.gd-chips span::before{ content:''; width:4px; height:4px; border-radius:50%; background:var(--door-highlight); }
.gd-go{
  min-height:43px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:7px;
  padding:0 18px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:13px;
  color:#fff;
  background:var(--door-accent);
  box-shadow:0 12px 28px rgba(var(--door-shade),.34),inset 0 1px 0 rgba(255,255,255,.18);
  font-size:12.5px;
  font-weight:900;
  letter-spacing:-.02em;
  transition:transform .25s ease,box-shadow .25s ease;
}
.gd-go i{ font-style:normal; font-size:15px; transition:transform .25s ease; }
.gate-door:hover .gd-go{ transform:translateY(-1px); }
.gate-door:hover .gd-go i{ transform:translateX(4px); }
.gd-sub{
  position:absolute;
  z-index:4;
  right:clamp(20px,2.35vw,32px);
  bottom:clamp(27px,2.4vw,34px);
  color:rgba(255,255,255,.72);
  font-size:10.5px;
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
}
.gd-sub::after{ content:''; display:block; width:100%; height:1px; margin-top:3px; background:currentColor; opacity:.28; }
.gd-sub:hover{ color:var(--door-highlight); }

/* ambassador: real five-person portrait + quiet editorial gold */
.gate-amb{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:clamp(106px,14.5vh,116px);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(10px,1.4vw,18px);
  padding:9px clamp(12px,1.55vw,22px);
  border:1px solid rgba(213,177,111,.3);
  border-radius:clamp(16px,1.45vw,21px);
  color:#352b20;
  background:linear-gradient(106deg,#25221d 0%,#2d2922 38%,#574833 72%,#796145 100%);
  box-shadow:0 17px 42px rgba(53,43,32,.16),inset 0 1px 0 rgba(255,255,255,.12);
  font-family:inherit;
  text-align:left;
  cursor:pointer;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease,border-color .3s ease;
}
.gate-amb::before{
  content:'';
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 2%,rgba(232,199,137,.13) 16%,rgba(232,199,137,.58) 50%,rgba(232,199,137,.15) 84%,transparent 98%) top / 100% 1px no-repeat,
    linear-gradient(90deg,transparent 7%,rgba(232,199,137,.08) 24%,rgba(232,199,137,.32) 57%,rgba(232,199,137,.09) 88%,transparent 98%) bottom / 100% 1px no-repeat,
    linear-gradient(90deg,rgba(37,34,29,.99) 0%,rgba(37,34,29,.98) 27%,rgba(37,34,29,.9) 37%,rgba(37,34,29,.7) 47%,rgba(37,34,29,.43) 57%,rgba(37,34,29,.19) 67%,rgba(37,34,29,.05) 79%,rgba(74,59,43,.06) 100%),
    radial-gradient(circle at 79% 44%,rgba(236,204,148,.13),transparent 38%);
}
.gate-amb::after{
  content:'';
  position:absolute;
  z-index:4;
  top:0;
  bottom:0;
  left:-45%;
  width:28%;
  pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(245,220,174,.12),transparent);
  transform:skewX(-16deg);
  animation:gateSheen 7s ease-in-out infinite;
}
@keyframes gateSheen{ 0%,67%{ left:-45%; } 94%,100%{ left:120%; } }
.gate-amb:hover{
  transform:translateY(-3px);
  border-color:rgba(210,176,116,.45);
  box-shadow:0 25px 56px rgba(53,43,32,.23),inset 0 1px 0 rgba(255,255,255,.14);
}
.gate-amb:focus-visible{ outline:3px solid #cba86a; outline-offset:4px; }
.gate-amb .ga-l{ position:relative; z-index:3; min-width:0; display:flex; align-items:center; gap:12px; }
.gate-amb .ga-ic{
  flex:none;
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(232,202,151,.38);
  border-radius:50%;
  color:#e5c785;
  background:rgba(255,255,255,.05);
  box-shadow:inset 0 0 0 5px rgba(255,255,255,.025);
  font-family:Georgia,serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
}
.gate-amb .ga-t{ min-width:0; }
.gate-amb .ga-k{ display:block; color:#d8b878; font-size:8.5px; font-weight:900; letter-spacing:.2em; text-transform:uppercase; }
.gate-amb .ga-h{ display:block; overflow:hidden; margin-top:3px; color:#fffdf8; font-size:clamp(14px,1.28vw,17px); font-weight:880; line-height:1.22; letter-spacing:-.035em; white-space:nowrap; text-overflow:ellipsis; }
.gate-amb .ga-h b{ color:#e5c785; }
.gate-amb .ga-d{ display:none; }
.ga-photo{
  position:absolute;
  z-index:1;
  top:0;
  right:clamp(76px,7vw,106px);
  bottom:0;
  width:clamp(500px,49vw,720px);
  min-height:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  opacity:.98;
  mix-blend-mode:normal;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.34) 7%,rgba(0,0,0,.67) 15%,rgba(0,0,0,.91) 24%,#000 30%,#000 94%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.34) 7%,rgba(0,0,0,.67) 15%,rgba(0,0,0,.91) 24%,#000 30%,#000 94%,transparent 100%);
  transition:opacity .3s ease;
}
.ga-photo img{ width:100%; height:100%; display:block; object-fit:cover; object-position:center 23%; filter:sepia(0) saturate(1.02) contrast(1.03) brightness(1.06); transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .3s ease; }
.gate-amb:hover .ga-photo{ opacity:1; }
.gate-amb:hover .ga-photo img{ transform:scale(1.025); filter:sepia(0) saturate(1.08) contrast(1.03) brightness(1.08); }
.gate-amb .ga-go{
  position:relative;
  z-index:3;
  flex:none;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:0 14px;
  border:1px solid rgba(232,202,151,.45);
  border-radius:13px;
  color:#f4dfb5;
  background:rgba(255,255,255,.07);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  font-size:11.5px;
  font-weight:900;
  white-space:nowrap;
  transition:background .25s ease,transform .25s ease;
}
.gate-amb .ga-go i{ font-style:normal; font-size:15px; }
.gate-amb:hover .ga-go{ color:#2e271e; background:#e7ca91; transform:translateX(3px); }

.gate-foot{
  min-height:19px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
  flex-wrap:wrap;
  padding-top:1px;
  color:#898f8c;
  font-size:10.5px;
  font-weight:720;
}
.gate-foot button{
  padding:0;
  border:0;
  color:#66716d;
  background:none;
  font:820 10.5px/1.3 inherit;
  text-decoration:none;
  cursor:pointer;
}
.gate-foot button::after{ content:''; display:block; height:1px; margin-top:3px; background:currentColor; opacity:.28; }
.gate-foot button:hover{ color:#173e35; }

@media(max-width:1100px){
  .gate-brandline{ display:none; }
  .gate-award{ margin-left:2px; }
  .gd-desc{ max-width:39ch; }
  .ga-photo{ width:clamp(430px,49vw,570px); }
}

@media(max-width:900px){
  .gate-award{ display:none; }
  .gate-doors{ min-height:420px; }
  .gate-door .gd-body{ padding-left:19px; padding-right:19px; }
  .gd-sub{ right:19px; }
  .ga-photo{ right:68px; width:min(48vw,440px); opacity:.95; }
}

@media(max-width:820px){
  .gate{ min-height:auto; padding:9px 9px 16px; gap:10px; }
  .gate-top{ min-height:52px; padding:7px 8px 7px 11px; border-radius:17px; }
  .gate-brand img.gb-logo{ height:26px; }
  .gate-btn{ min-height:38px; padding:0 12px; border-radius:11px; font-size:12px; }
  .gate-doors{ min-height:0; grid-template-columns:1fr; gap:11px; }
  .gate-door{ min-height:440px; border-radius:25px; }
  .gate-door::before{
    inset:0;
    height:auto;
    background-size:100% auto;
    background-repeat:no-repeat;
    background-position:var(--door-mobile-pos,center top);
    transform:none;
  }
  .gate-door::after{
    inset:0;
    height:auto;
    background:
      linear-gradient(180deg,rgba(var(--door-shade),.02) 0%,rgba(var(--door-shade),.06) 33%,rgba(var(--door-shade),.62) 55%,rgba(var(--door-shade),.94) 75%,rgb(var(--door-shade)) 100%),
      linear-gradient(90deg,rgba(var(--door-shade),.2),transparent 72%);
  }
  .gate-door.guardian{ --door-mobile-pos:center top; }
  .gate-door.academia{ --door-mobile-pos:center top; }
  .gd-emblem{ top:13px; left:13px; width:68px; height:74px; padding:6px; border-radius:17px; }
  .gd-index{ top:14px; right:14px; min-height:28px; padding:0 9px; font-size:8px; }
  .gate-door .gd-body{ min-height:0; padding:18px 17px 20px; border-radius:0; }
  .gate-door .gd-body::before{ left:17px; top:3px; }
  .gd-title{ font-size:27px; }
  .gd-desc{ max-width:48ch; font-size:11px; line-height:1.45; }
  .gd-chips span{ padding:4px 8px; font-size:8.8px; }
  .gd-go{ min-height:39px; margin-top:5px; padding:0 14px; font-size:11.5px; }
  .gd-sub{ right:17px; bottom:24px; font-size:9.5px; }
  .gate-amb{ min-height:78px; grid-template-columns:minmax(0,1fr) auto; gap:7px; padding:7px 9px; border-radius:17px; }
  .gate-amb .ga-l{ gap:8px; }
  .gate-amb .ga-ic{ width:34px; height:34px; font-size:9.5px; }
  .gate-amb .ga-h{ max-width:45ch; font-size:12.5px; white-space:nowrap; display:block; text-overflow:ellipsis; }
  .gate-amb .ga-k{ display:none; }
  .ga-photo{ right:36px; top:0; bottom:0; width:min(78vw,370px); opacity:.94; }
  .ga-photo img{ object-position:center 22%; }
  .gate-amb .ga-go{ width:34px; min-height:34px; justify-content:center; padding:0; border-radius:50%; }
  .gate-amb .ga-go span{ display:none; }
  .gate-foot{ gap:10px; font-size:9.5px; }
  .gate-foot button{ font-size:9.5px; }
}

@media(max-width:460px){
  .gate-auth{ gap:5px; }
  .gate-btn{ padding:0 10px; }
  .gate-door{ min-height:430px; }
  .gd-desc{ display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
  .gd-chips span:nth-child(3){ display:none; }
  .gd-sub{ max-width:118px; text-align:right; }
  .gate-amb{ min-height:74px; }
  .ga-photo{ right:30px; width:300px; opacity:.92; }
  .gate-amb .ga-h{ max-width:27ch; }
  .gate-foot>span{ width:100%; text-align:center; }
}

@media(prefers-reduced-motion:reduce){
  .gate-door,.gate-door::before,.gd-emblem,.gd-go,.gd-go i,.gate-amb,.ga-photo img,.gate-amb .ga-go{ transition:none!important; }
  .gate-amb::after{ animation:none!important; }
}