@charset "utf-8";

/* =========================
   VARIABLES
   ========================= */
:root{
  --bg:#0e0e0e;
  --card:#212121;
  --text:#ffffff;
  --muted:#a8b0bf;
  --line:rgba(255,255,255,.12);

  /* CHAMPAGNE */
  --gold:#f0c56f;
  --gold2:#d0a24a;
  --gold3:#7b5522;

  --shadow:0 18px 55px rgba(0,0,0,.65);
  --shadow-soft:0 14px 38px rgba(0,0,0,.55);

  /* GOLD GRADIENT */
  --gold-gradient-icons: linear-gradient(
  180deg,
  #fff4d6 0%,
  #ffe8b0 32%,
  var(--gold) 68%,
  #e2b866 100%
);

--gold-gradient-text-light: linear-gradient(
  180deg,
  #fff9ea 0%,
  #fff1c8 40%,
  var(--gold) 75%,
  #e9c980 100%
);
	
  --page-max:1100px;
  --page-pad:0px;
}

@media (min-width:768px){
  :root{ --page-pad:34px; }
}

/* =========================
   RESET / BASE
   ========================= */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-optical-sizing:auto;
  font-weight:300;
  font-style:normal;
  font-variation-settings:"wdth" 100;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;

  background:#0e0e0e;

  color:var(--text);
  overflow-x:hidden;
  scroll-behavior:smooth;
  scrollbar-width:thin;
  scrollbar-color:#212121 var(--bg);
}

body::-webkit-scrollbar{width:18px}
body::-webkit-scrollbar-track{background:var(--bg)}
body::-webkit-scrollbar-thumb{background:#212121}

img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
button{color:inherit;border:0;background:none;cursor:pointer}
ul{list-style:none}
a{color:inherit;text-decoration:none}

/* =========================
   WRAP
   ========================= */
.ns-wrap{
  width:min(var(--page-max), 100%);
  margin:0 auto;
  padding:0 var(--page-pad) 40px;
}

/* =========================
   LANGUAGE
   ========================= */
.flag{position:relative}
.flag::before{
  content:"";
  display:flex;
  flex:0 0 24px;
  width:24px;height:18px;
  border-radius:5px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.flag--esp::before{background-image:url("../images/flag-esp.svg")}
.flag--eng::before{background-image:url("../images/flag-en.svg")}
.flag--jap::before{background-image:url("../images/flag-jp.svg")}

.ns-topbar__lang{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  padding:10px 10px 10px;
  cursor:pointer;
}

.ns-topbar__lang-subnav{
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%) translateY(-4px);
  background:transparent;
  border:0;
  box-shadow:none;
  opacity:0;
  pointer-events:none;
  transition:
    opacity .35s cubic-bezier(.22,.61,.36,1),
    transform .35s cubic-bezier(.22,.61,.36,1);
  z-index:3000;
}

.ns-topbar__lang-op{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  height:18px;
  transform:translateY(-4px);
}
.ns-topbar__lang:hover .ns-topbar__lang-subnav{
  opacity:1;
  transform:translateX(-50%) translateY(0);
  pointer-events:auto;
}

.ns-topbar__lang-op .flag::before{
  box-shadow:0 10px 22px rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.22);
}

/* =========================
   BELL + TEXT
   ========================= */
.icon-reservation{
  position:relative;
  display:inline-block;
  transform:translateX(-16px);
}

.ns-topbar__cta .icon-reservation::before,
.ns-topbar__cta .icon-reservation::after{
  content:"";
  position:absolute;
  top:-4px;
  left:-4px;
  width:38px;
  height:38px;

  -webkit-mask:url("../images/icons/icon-reservation.svg") no-repeat center/contain;
          mask:url("../images/icons/icon-reservation.svg") no-repeat center/contain;

  transition:opacity .75s cubic-bezier(.22,.61,.36,1);
}

.ns-topbar__cta .icon-reservation::after{
  background-color:#ffffff;
  opacity:1;
}

.ns-topbar__cta .icon-reservation::before{
  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
  opacity:0;
}

.ns-topbar__cta:hover .icon-reservation::after{
  opacity:0;
}

.ns-topbar__cta:hover .icon-reservation::before{
  opacity:1;
}

.ns-topbar__cta{
  display:inline-flex;
  align-items:center;
  color:#fff;
  font-size:18px;
  letter-spacing:.06em;
  padding-right:0;
  margin-left:-6px;
}

.ns-topbar__cta .icon-reservation{
  display:inline-block;
  height:28px;
  width:34px;
  margin-right:2px;
  opacity:1;
  transform:translateX(-4px) translateY(-7px);
}

.ns-topbar__cta .icon-reservation::after{
  position:absolute;
  top:-4px;
  left:-4px;
  width:38px;
  height:38px;
}

.ns-topbar__cta:hover .icon-reservation::after{
  background:
    linear-gradient(
      180deg,
      #fff4d6 0%,
      #ffe8b0 32%,
      var(--gold) 68%,
      #e2b866 100%
    );
}

.ns-topbar__cta:hover{
  color:var(--gold);
  filter:none;
}

@media (max-width: 767px){
  .ns-topbar__cta b{
    display:none;
  }
  .ns-topbar__cta .icon-reservation{
    margin-right:-4px;
  }
}

/* =========================
   HAMBURGUER + DRAWER MENU
   ========================= */
.ns-topbar__bur .nav-icon{
  display:flex;
  position:relative;
  width:22px;
  height:3px;
  border-radius:2px;
  background:#fff;
}

/* DRAWER BASE */
.ns-drawer{
  position:fixed;
  inset:0;
  z-index:4000;
  pointer-events:none;
  opacity:0;
  transition:opacity .25s ease;
}

.ns-drawer__overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.65);
  backdrop-filter:blur(2px);
}

.ns-drawer__panel{
  position:absolute;
  top:0;
  right:0;
  height:100%;
  width:min(360px, 88vw);

  background:
    radial-gradient(
      900px 700px at 50% 10%,
      rgba(240,197,111,.10) 0%,
      rgba(240,197,111,0) 55%
    ),
    #0e0e0e;

  border-left:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 55px rgba(0,0,0,.75);

  transform:translateX(12px);
  transition:transform .35s cubic-bezier(.22,.61,.36,1);

  display:flex;
  flex-direction:column;
  padding:16px 14px 14px;
  outline:none;
}

/* OPEN STATE */
body._nav-open .ns-drawer{
  pointer-events:auto;
  opacity:1;
}

body._nav-open .ns-drawer__panel{
  transform:translateX(0);
}

/* DRAWER HEADER */
.ns-drawer__head{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  padding:6px 2px 12px;

  border-bottom:0;
  position:relative;
}

.ns-drawer__title{
  font:800 16px "Open Sans", sans-serif;
  letter-spacing:.16em;
  text-transform:uppercase;
  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 1px 0 rgba(0,0,0,.55))
    drop-shadow(0 6px 12px rgba(0,0,0,.65));
}

.ns-drawer__close{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.30);
  transition:border-color .25s ease, box-shadow .25s ease;
}

.ns-drawer__close:hover{
  border-color:rgba(240,197,111,.45);
  box-shadow:0 0 0 3px rgba(240,197,111,.14);
}

.ns-drawer__close-x{
  width:18px;
  height:18px;
  position:relative;
}

.ns-drawer__close-x::before,
.ns-drawer__close-x::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:18px;
  height:2px;
  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
  transform-origin:center;
}

.ns-drawer__close-x::before{
  transform:translate(-50%,-50%) rotate(45deg);
}

.ns-drawer__close-x::after{
  transform:translate(-50%,-50%) rotate(-45deg);
}

/* NAV LINKS */
.ns-drawer__nav{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:14px 2px 12px;
}

/* DIVIDERS (like screenshot) */
.ns-drawer__divider{
  height:0.5px;
  margin:14px 2px;

  background:linear-gradient(
    90deg,
    var(--gold2) 0%,
    var(--gold) 22%,
    #fff4d6 50%,
    var(--gold) 78%,
    var(--gold2) 100%
  );

  opacity:.95;
}

/* SECTION (accordion group) */
.ns-drawer__section{
  display:flex;
  flex-direction:column;
}

/* HEADER ROW (バスク地方 / ガリシア地方) */
.ns-drawer__section-head{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding:14px 6px 8px;

  background:transparent;
  border:0;
  box-shadow:none;
}

.ns-drawer__section-link{
  display:inline-flex;
  align-items:center;

  font-weight:800;
  letter-spacing:.10em;
  font-size:16px;

  background:linear-gradient(
    180deg,
    #f5e7c6 0%,
    var(--gold) 28%,
    var(--gold2) 58%,
    var(--gold3) 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 9px 16px rgba(0,0,0,.70));

  transition:filter .35s cubic-bezier(.22,.61,.36,1), opacity .35s cubic-bezier(.22,.61,.36,1);
}

.ns-drawer__section-link:hover{
  opacity:1;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 12px 20px rgba(0,0,0,.78));
}

/* GOLD BUTTON (right side) */
.ns-drawer__acc-btn{
  flex:0 0 20px;
  width:20px;
  height:20px;
  display:grid;
  place-items:center;

  border-radius:5px;
  border:1px solid rgba(255,255,255,.12);

  background:linear-gradient(
    180deg,
    #f5e7c6 0%,
    var(--gold) 28%,
    var(--gold2) 58%,
    var(--gold3) 100%
  );

  box-shadow:
    0 10px 22px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.18);

  transition:transform .35s cubic-bezier(.22,.61,.36,1);
}

.ns-drawer__acc-btn::after{
  content:"";
  width:8px;
  height:8px;
  border-right:2px solid #0e0e0e;
  border-top:2px solid #0e0e0e;
  transform:translateY(3px) rotate(-45deg);
  margin:0;
}

/* SUBMENU */
.ns-drawer__submenu{
  overflow:hidden;
  max-height:0;
  opacity:0;
  transform:translateY(-4px);

  transition:
    max-height .35s cubic-bezier(.22,.61,.36,1),
    opacity .25s ease,
    transform .35s cubic-bezier(.22,.61,.36,1);

  padding:0 10px;
}

.ns-drawer__sublink{
  display:block;
  padding:8px 12px 8px;
  font-size:14px;
  font-weight:500;
  letter-spacing:.10em;
  opacity:.92;

  background:transparent;
  border:0;

  transition:color .25s ease, opacity .25s ease;
}

.ns-drawer__sublink:hover{
  color:var(--gold);
  opacity:1;
}

/* OPEN STATE (set by JS) */
.ns-drawer__section._open .ns-drawer__submenu{
  max-height:260px;
  opacity:1;
  transform:translateY(0);
  padding:0px 10px 0px;
}

.ns-drawer__section._open .ns-drawer__acc-btn{
  transform:rotate(180deg);
}

/* PLAIN LINKS (公認ガイド / 利用規約) */
.ns-drawer__link{
  display:flex;
  align-items:center;
  justify-content:flex-start;

  padding:14px 8px 14px;

  background:transparent;
  border:0;
  box-shadow:none;

  font-weight:800;
  letter-spacing:.10em;
  font-size:16px;

  background:linear-gradient(
    180deg,
    #f5e7c6 0%,
    var(--gold) 28%,
    var(--gold2) 58%,
    var(--gold3) 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 9px 16px rgba(0,0,0,.70));

  transition:filter .35s cubic-bezier(.22,.61,.36,1), opacity .35s cubic-bezier(.22,.61,.36,1);
}

.ns-drawer__link:hover{
  opacity:1;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 12px 20px rgba(0,0,0,.78));
}

.ns-drawer__link--plain{
  padding-left:8px;
}

/* FOOT */
.ns-drawer__foot{
  margin-top:auto;
  padding:12px 2px 2px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;
  flex-direction:column;
  gap:12px;
}

.ns-drawer__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:36px;
  padding:0 16px;
  margin-top:30px;

  width:58%;
  max-width:260px;
  align-self:center;

  border-radius:0;
  font-weight:800;
  letter-spacing:.10em;
  font-size:12px;
  color:#0e0e0e;

  background:linear-gradient(180deg,#ffe0a8 0%,var(--gold) 28%,var(--gold2) 58%,var(--gold3) 100%);
  box-shadow:0 12px 26px rgba(0,0,0,.55);

  transition:transform .35s cubic-bezier(.22,.61,.36,1), filter .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s cubic-bezier(.22,.61,.36,1);
}

@media (hover:hover){
  .ns-drawer__cta:hover{
    transform:translateY(-1px);
    filter:saturate(1.05);
    box-shadow:0 16px 34px rgba(0,0,0,.60);
  }
}

.ns-drawer__social{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:flex-start;
  opacity:.96;
  margin-top:20px;
}

.ns-drawer__mail .mailto{
  text-decoration:underline;
  font-weight:800;
  font-size:14px;
  letter-spacing:.06em;
}

/* =========================
   TOPBAR
   ========================= */
.ns-topbar{
  position:sticky;
  top:0;
  z-index:1000;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  height:60px;
  padding:0 14px;

  background:linear-gradient(
    90deg,
    rgba(0,0,0,.88) 0%,
    rgba(0,0,0,.78) 35%,
    rgba(0,0,0,.55) 60%,
    rgba(0,0,0,.25) 80%,
    rgba(0,0,0,0) 100%
  );
}

@media (max-width: 767px){
  .ns-topbar{
    position:fixed;
    left:0;
    right:0;
    top:0;
    width:100%;
    padding:0 10px;
    gap:6px;
  }

  .ns-topbar__logo{
    padding-left:48px;
    flex:1 1 auto;
    min-width:0;
    margin-left:-8px;
  }

  .ns-topbar__mark{
    width:56px;
    height:auto;
  }


  .ns-topbar__word{
    font-size:clamp(15px, 4.6vw, 19px);
    white-space:nowrap;
  }

  .ns-topbar__tagline{
    font-size:9.5px;
    letter-spacing:.01em;
    -webkit-text-stroke:0px rgba(0,0,0,0);
    transform:scaleX(.94);
    transform-origin:left center;
  }

  .ns-topbar__cta{
    display:none;
  }

  .ns-topbar__nav{
    gap:0;
    flex:0 0 auto;
  }

  .ns-topbar__nav > *:not(:last-child)::after{
    display:none;
  }

  .ns-topbar__lang{
    padding:0;
    height:36px;
    width:36px;
    margin-right:-12px;
  }

  .ns-topbar__bur{
    width:36px;
    height:36px;
  }
}

.ns-topbar__logo{
  position:relative;
  display:flex;
  align-items:stretch;
  gap:0;
  opacity:.92;
  padding-left:65px;
  height:60px;
  margin-left:-12px;
}

.ns-topbar__logo::after{
  content:"";
  position:absolute;
  left:14px;
  bottom:0;
  width:calc(100% + 24px);
  height:1px;
  background:var(--gold2);
  opacity:1;

  -webkit-mask-image:linear-gradient(
    90deg,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 72%,
    rgba(0,0,0,.55) 84%,
    rgba(0,0,0,.20) 92%,
    rgba(0,0,0,0) 100%
  );
  mask-image:linear-gradient(
    90deg,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 72%,
    rgba(0,0,0,.55) 84%,
    rgba(0,0,0,.20) 92%,
    rgba(0,0,0,0) 100%
  );
}

.ns-topbar__logo::before{
  content:"";
  position:absolute;
  inset:0;
  background:transparent;
  z-index:-1;
}

.ns-topbar::after{
  content:"";
  position:absolute;
  left:0;
  width:300px;
  bottom:0;
  height:1px;
  background:
    linear-gradient(
      90deg,
      var(--gold) 0%,
      var(--gold2) 65%,
      #ffe0a8 80%,
      transparent 100%
    );
  opacity:.95;
  pointer-events:none;
}

.ns-topbar__mark{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:72px;
  height:auto;
  opacity:.95;

  display:flex;
  align-items:stretch;
}

.ns-topbar__mark img{
  display:none;
}

.ns-topbar__mark::after{
  content:"";
  position:absolute;
  inset:0;

  background:#ffffff;

  -webkit-mask:url("../images/logo.svg") no-repeat center / contain;
          mask:url("../images/logo.svg") no-repeat center / contain;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.55))
    drop-shadow(0 10px 18px rgba(0,0,0,.70));
}

.ns-topbar__word-wr{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:1px;
  min-width:0;
}

.ns-topbar__word{
  font:300 24px "Open Sans", sans-serif;
  text-transform:uppercase;
  line-height:1;
  position:relative;

  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  color:var(--text);

  filter:
    drop-shadow(0 1px 0 rgba(0,0,0,.55))
    drop-shadow(0 6px 12px rgba(0,0,0,.65));
}

.ns-topbar__tagline{
  display:block;
  font-family:"Noto Sans JP", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.13em;
  line-height:1.15;
  opacity:1;

  background:none;
  -webkit-background-clip:initial;
  background-clip:initial;
  color:var(--text);

  text-shadow:
    0 1px 0 rgba(0,0,0,.35);

  -webkit-text-stroke:0px rgba(0,0,0,0);

  transform:scaleX(.94);
  transform-origin:left center;

  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
}

.ns-topbar__word span{
  font-weight:700;
}

.ns-topbar__nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  opacity:.92;
  padding:0;
  height:60px;
}

.ns-topbar__nav a{transition:color .25s ease, opacity .25s ease}
.ns-topbar__nav a:hover:not(.ns-topbar__cta){color:var(--gold);opacity:1}

/* =========================
   HEADER VERTICAL SEPARATORS
   ========================= */
.ns-topbar__nav > *{
  position:relative;
}

.ns-topbar__nav > *:not(:last-child)::after{
  content:"";
  position:absolute;
  right:-9px;
  top:50%;
  width:1px;
  height:20px;
  transform:translateY(-50%);
  background:rgba(255,255,255,.28);
}

.ns-topbar__bur{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  width:44px;
  padding:0;
}

.ns-topbar__bur .nav-icon,
.ns-topbar__bur .nav-icon::before,
.ns-topbar__bur .nav-icon::after{
  background:#fff;
  transition:background .75s cubic-bezier(.22,.61,.36,1);
}

.ns-topbar__bur .nav-icon::before,
.ns-topbar__bur .nav-icon::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:3px;
  border-radius:2px;
}

.ns-topbar__bur .nav-icon::before{top:-8px}
.ns-topbar__bur .nav-icon::after{bottom:-8px}

.ns-topbar__bur .nav-icon::before{top:-8px;background:#fff}
.ns-topbar__bur .nav-icon::after{bottom:-8px;background:#fff;transition:background-color .35s ease-in-out}

.ns-topbar__bur:hover .nav-icon,
.ns-topbar__bur:hover .nav-icon::before,
.ns-topbar__bur:hover .nav-icon::after{
  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
}

/* =========================
   BUTTONS (GLOBAL)
   ========================= */
.ns-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:38px;
  padding:0 18px;
  border-radius:0;
  font-weight:800;
  letter-spacing:.08em;
  font-size:13px;
  box-shadow:0 12px 26px rgba(0,0,0,.55);
  transition:transform .2s ease, filter .2s ease, box-shadow .2s ease;
  margin-top:10px;
}

.ns-btn--gold{
  background:linear-gradient(
    180deg,
    #f5e7c6 0%,
    var(--gold) 28%,
    var(--gold2) 58%,
    var(--gold3) 100%
  );
  color:#0e0e0e;
  text-shadow:none;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 9px 16px rgba(0,0,0,.70));
}

.ns-btn--dark{
  background:#000;
  border:1.5px solid transparent;
  color:#fff;
  box-shadow:0 12px 26px rgba(0,0,0,.55);

  transition:
    background-image .28s cubic-bezier(.22,.61,.36,1),
    color .28s cubic-bezier(.22,.61,.36,1),
    box-shadow .28s cubic-bezier(.22,.61,.36,1);

  background-image:
    linear-gradient(#000, #000),
    linear-gradient(
      180deg,
      #fff4d6 0%,
      #ffe8b0 32%,
      var(--gold) 68%,
      #e2b866 100%
    );
  background-origin:border-box;
  background-clip:padding-box, border-box;
}

@media (hover:hover){
  .ns-btn--dark:hover{
    color:#0e0e0e;
    box-shadow:
      0 16px 34px rgba(0,0,0,.60),
      0 0 0 3px rgba(240,197,111,.12);

    border:1.5px solid transparent;
    background-image:
      linear-gradient(
        180deg,
        #f5e7c6 0%,
        var(--gold) 28%,
        var(--gold2) 58%,
        var(--gold3) 100%
      );
    background-origin:border-box;
    background-clip:border-box;
  }
}

/* =========================
   SOCIAL ICONS (GLOBAL)
   ========================= */
.social-icon{
  display:inline-block;
  width:20px;
  height:20px;
  text-indent:-500px;
  overflow:hidden;

  background:linear-gradient(
    180deg,
    #f5e7c6 0%,
    var(--gold) 28%,
    var(--gold2) 58%,
    var(--gold3) 100%
  );

  transition:filter .35s cubic-bezier(.22,.61,.36,1);
}

.social--fb{-webkit-mask:url("../images/icons/icon-facebook.svg") no-repeat center/contain;mask:url("../images/icons/icon-facebook.svg") no-repeat center/contain}
.social--x {-webkit-mask:url("../images/icons/icon-twitter.svg")  no-repeat center/contain;mask:url("../images/icons/icon-twitter.svg")  no-repeat center/contain}
.social--in{-webkit-mask:url("../images/icons/icon-instagram.svg") no-repeat center/contain;mask:url("../images/icons/icon-instagram.svg") no-repeat center/contain}
.social--yt{-webkit-mask:url("../images/icons/icon-youtube.svg")   no-repeat center/contain;mask:url("../images/icons/icon-youtube.svg")   no-repeat center/contain}
.social--mail{-webkit-mask:url("../images/icons/icon-mail.svg")    no-repeat center/contain;mask:url("../images/icons/icon-mail.svg")    no-repeat center/contain}

.social-icon:hover{
  filter:
    drop-shadow(0 0 6px rgba(240,197,111,.55))
    drop-shadow(0 10px 18px rgba(0,0,0,.65));
}

/* =========================
   ICONS (GLOBAL)
   ========================= */
.ns-ico{
  position:relative;
  display:block;
  width:80px;
  height:80px;
  transform:translateY(-4px);
}

.ns-ico::after{
  content:"";
  position:absolute;
  inset:0;

  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );

  -webkit-mask-repeat:no-repeat;
          mask-repeat:no-repeat;
  -webkit-mask-position:center;
          mask-position:center;
  -webkit-mask-size:contain;
          mask-size:contain;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 12px 22px rgba(0,0,0,.75));
}

/* ASIGNACIÓN DE SVGs */
.ns-ico--japanese::after{
  -webkit-mask-image:url("../images/icons/icon-jap.svg");
          mask-image:url("../images/icons/icon-jap.svg");
}

.ns-ico--licensed::after{
  -webkit-mask-image:url("../images/icons/icon-licensed.svg");
          mask-image:url("../images/icons/icon-licensed.svg");
}

.ns-ico--private::after{
  -webkit-mask-image:url("../images/icons/icon-private.svg");
          mask-image:url("../images/icons/icon-private.svg");
}

.ns-ico--flex::after{
  -webkit-mask-image:url("../images/icons/icon-flex.svg");
          mask-image:url("../images/icons/icon-flex.svg");
}

.ns-ico--pintxo::after{
  -webkit-mask-image:url("../images/icons/icon-pintxo.svg");
          mask-image:url("../images/icons/icon-pintxo.svg");
}

.ns-ico--wine::after{
  -webkit-mask-image:url("../images/icons/icon-wine.svg");
          mask-image:url("../images/icons/icon-wine.svg");
}

/* =========================
   MINI BUTTON (GLOBAL)
   ========================= */
.ns-mini-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:2px;
  height:30px;
  padding:0 18px;
  border-radius:0;
  background:#000;
  border:1.5px solid transparent;
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
  box-shadow:0 12px 22px rgba(0,0,0,.45);
  margin-top:56px;

  transition:
    background-image .28s cubic-bezier(.22,.61,.36,1),
    color .28s cubic-bezier(.22,.61,.36,1),
    box-shadow .28s cubic-bezier(.22,.61,.36,1);

  background-image:
    linear-gradient(#000, #000),
    linear-gradient(
      180deg,
      #fff4d6 0%,
      #ffe8b0 32%,
      var(--gold) 68%,
      #e2b866 100%
    );
  background-origin:border-box;
  background-clip:padding-box, border-box;
}

.ns-mini-btn__arrow{
  width:10px;
  height:10px;
  position:relative;
}

.ns-mini-btn__arrow::after{
  content:"";
  position:absolute;
  inset:0;
  border-right:2px solid currentColor;
  border-top:2px solid currentColor;
  transform:rotate(45deg);
  opacity:.95;
}

@media (hover:hover){
  .ns-mini-btn:hover{
    color:#0e0e0e;
    box-shadow:
      0 16px 34px rgba(0,0,0,.60),
      0 0 0 3px rgba(240,197,111,.12);

    border:1.5px solid transparent;
    background-image:
      linear-gradient(
        180deg,
        #f5e7c6 0%,
        var(--gold) 28%,
        var(--gold2) 58%,
        var(--gold3) 100%
      );
    background-origin:border-box;
    background-clip:border-box;
  }
}

/* =========================
   FOOTER
   ========================= */
.ns-footer{
  margin-top:18px;
  border-top:0;
}

.ns-footer::before{
  content:"";
  display:block;
  height:2px;
  background:linear-gradient(
    90deg,
    var(--gold2) 0%,
    var(--gold) 22%,
    #fff4d6 50%,
    var(--gold) 78%,
    var(--gold2) 100%
  );
  opacity:.95;
}

.ns-footer__top{
  padding:18px 0 16px;
}

.ns-footer__cols{
  display:grid;
  grid-template-columns:1fr;
  gap:18px;
  align-items:start;
  padding-left:16px;
  padding-right:16px;
}

@media (min-width:900px){
  .ns-footer__cols{
    grid-template-columns:1fr 1fr 1.6fr;
    gap:26px;
    padding-left:28px;
    padding-right:28px;
  }
}

.ns-footer__ttl-wr{
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:12px;
}

.ns-footer__ttl-line{
  flex:1 1 auto;
  height:1px;
  background:linear-gradient(
    90deg,
    rgba(230,200,143,.95) 0%,
    rgba(199,161,90,.65) 55%,
    rgba(199,161,90,0) 100%
  );
}

.ns-footer__ttl{
  font-weight:800;
  letter-spacing:.16em;
  font-size:14px;
  opacity:1;
  margin-bottom:0;
  text-transform:none;

  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 9px 16px rgba(0,0,0,.70));
}

.ns-footer__list{
  display:flex;
  flex-direction:column;
  gap:8px;
  font-size:13px;
  opacity:.90;
  text-shadow:
    0 1px 0 rgba(0,0,0,.26),
    0 10px 20px rgba(0,0,0,.40);
}

.ns-footer__list a{transition:color .25s ease}
.ns-footer__list a:hover{color:var(--gold)}

.ns-footer__col--right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:14px;
}

.ns-footer__right-top{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
}

.ns-footer__social{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:flex-end;
  opacity:.96;
}

.ns-footer__thumb{
  width:320px;
  max-width:100%;
  border-radius:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 14px 34px rgba(0,0,0,.55);
}

.ns-footer__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.ns-footer__mail .mailto{
  text-decoration:none;
  font-weight:200;
  font-size:14px;
  letter-spacing:.06em;
}

.ns-footer__bottom{
  padding:18px 0 10px;
  text-align:center;
  opacity:1;
  font-size:14px;
  letter-spacing:.06em;

  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 50%,
    var(--gold) 75%,
    #e2b866 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  border-top:2px solid transparent;
  border-image:linear-gradient(
    90deg,
    var(--gold2) 0%,
    var(--gold) 22%,
    #fff4d6 50%,
    var(--gold) 78%,
    var(--gold2) 100%
  ) 1;
}

/* =========================
   FOOTER LEGAL
   ========================= */
.main-foo__legal{
  font-weight:700;

  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 32%,
    var(--gold) 68%,
    #e2b866 100%
  );
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;

  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.65))
    drop-shadow(0 9px 16px rgba(0,0,0,.70));

  transition:filter .35s ease-in-out;
}

/* MOBILE */
@media (max-width: 767px){
  .main-foo__legal{
    line-height:1.6;
    padding-top:6px;
    padding-bottom:34px;
    text-align:center;
  }

  .main-foo__legal > ul{
    align-items:center;
  }

  .ns-footer__mail{
    margin-bottom:8px;
  }
}

.main-foo__legal > ul{
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* DESKTOP */
@media (min-width:768px){
  .main-foo__legal{
    margin-top:36px;
    padding:18px 0 28px;
  }

  .main-foo__legal > ul{
    flex-direction:row;
    justify-content:center;
    gap:60px;
  }
}

/* =========================
   TO TOP
   ========================= */
.to-top{
  display:none;
}

@media (min-width: 900px){
	.to-top{
	position:fixed;
	right:calc(
	  (100vw - min(var(--page-max), 100vw)) / 2 - 120px);

	bottom:26px;
	z-index:900;

	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;

	gap:10px;

    background:transparent;
    border:0;
    box-shadow:none;

    opacity:0;
    transform:translateY(14px);
    pointer-events:none;
    cursor:pointer;

    transition:
      opacity .35s ease,
      transform .35s ease,
      filter .35s ease;
  }

  .to-top._is-visible{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
  }

  .to-top__arrow-wr{
    width:28px;
    height:28px;
    display:grid;
    place-items:center;
    transform:translateY(10px);
  }

  .to-top__arrow{
    position:relative;
    width:20px;
    height:20px;
  }

  .to-top__arrow::after{
    content:"";
    position:absolute;
    inset:0;

    background:linear-gradient(
      180deg,
      #fff4d6 0%,
      #ffe8b0 32%,
      var(--gold) 68%,
      #e2b866 100%
    );

    -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M6.5%2014.5%2012%209l5.5%205.5%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%273%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E") no-repeat center/contain;
    mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M6.5%2014.5%2012%209l5.5%205.5%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%273%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E") no-repeat center/contain;

    filter:
      drop-shadow(0 2px 0 rgba(0,0,0,.55))
      drop-shadow(0 10px 18px rgba(0,0,0,.65));
  }

  .to-top__txt{
    font-family:"Noto Sans JP",serif;
    font-weight:400;
    font-size:15px;
    letter-spacing:.10em;
    white-space:nowrap;

    background:var(--gold-gradient-text-light);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;

    text-shadow:
      0 1px 0 rgba(0,0,0,.28),
      0 10px 18px rgba(0,0,0,.45);
  }

  .to-top::after{
    content:"";
    display:block;
    width:2px;
    height:74px;

    margin-left:auto;
    margin-right:auto;

    background:linear-gradient(
      180deg,
      rgba(240,197,111,.98) 0%,
      rgba(240,197,111,.65) 55%,
      rgba(33,33,33,0) 100%
    );

    opacity:.95;
    pointer-events:none;
  }
}

/* =========================
   LINE FLOATING BUTTON
   ========================= */
.line-float{
  position:fixed;
  right:22px;
  bottom:20px;
  z-index:500;
  width:64px;
  height:64px;
  background:transparent;
  border-radius:50%;
  box-shadow:0 18px 55px rgba(0,0,0,.55);
  transition:transform .2s ease-in-out;
  display:grid;
  place-items:center;
}
.line-float__ico{
  width:64px;
  height:64px;
  background:url("../images/icons/icon-line.svg") no-repeat center/contain;
}
@media (max-width: 767px){
  .line-float{
    width:54px;
    height:54px;
    right:16px;
    bottom:16px;
  }
  .line-float__ico{
    width:54px;
    height:54px;
  }
}
@media (hover:hover){
  .line-float:hover{transform:translateY(-2px)}
}