/*
  Hansalim NC Reservation – Design Stabilization v8
  Scope: visual hierarchy, common header, cards, buttons, filters, calendar and mobile behavior.
*/
:root{
  --hs-bg:#f5f1e8;
  --hs-bg-deep:#eee9dd;
  --hs-card:#fffdf8;
  --hs-card-strong:#fff;
  --hs-line:#ded8ca;
  --hs-line-soft:rgba(23,59,52,.10);
  --hs-text:#123b33;
  --hs-muted:#68776f;
  --hs-primary:#0f684f;
  --hs-primary-dark:#0a4b3a;
  --hs-primary-soft:#edf6f1;
  --hs-accent:#93c76a;
  --hs-warn:#fff6d9;
  --hs-warn-line:#eed486;
  --hs-danger:#a83d3a;
  --hs-danger-soft:#fff0ed;
  --hs-info:#e9f4f2;
  --hs-shadow:0 18px 45px rgba(0,40,27,.075);
  --hs-shadow-soft:0 10px 26px rgba(0,40,27,.055);
  --hs-radius-xl:32px;
  --hs-radius-lg:24px;
  --hs-radius-md:18px;
  --hs-radius-sm:14px;
}

html{background:var(--hs-bg);}
body{
  background:
    radial-gradient(circle at 10% -10%, rgba(147,199,106,.18), transparent 32%),
    radial-gradient(circle at 90% 0%, rgba(15,104,79,.08), transparent 34%),
    var(--hs-bg) !important;
  color:var(--hs-text) !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body::selection{background:rgba(147,199,106,.34);}

/* Common header */
.site-header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  background:rgba(245,241,232,.91) !important;
  backdrop-filter:saturate(1.15) blur(16px) !important;
  border-bottom:1px solid rgba(18,59,51,.10) !important;
}
.site-header.is-scrolled{box-shadow:0 8px 24px rgba(0,40,27,.08);}
.site-header .nav{
  min-height:76px;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  padding:12px 0 !important;
}
.site-header .brand{gap:12px !important;}
.site-header .brand-logo,
.site-header .brand-mark{
  width:46px !important;
  height:46px !important;
  border-radius:14px;
  object-fit:contain;
}
.site-header .brand-text,
.site-header .brand-title{
  color:var(--hs-text) !important;
  font-weight:900 !important;
  letter-spacing:-.035em;
}
.site-header .brand-text strong,
.site-header .brand-title{font-size:20px !important;line-height:1.12;}
.site-header .brand-text span{font-size:12px !important;color:var(--hs-muted) !important;margin-top:3px;}
.site-header .nav-links{
  align-items:center !important;
  gap:6px !important;
}
.site-header .nav-links > a,
.site-header .mini-link-btn{
  min-height:38px;
  padding:0 12px !important;
  border-radius:999px;
  font-size:14px !important;
  font-weight:850 !important;
  color:var(--hs-text) !important;
  transition:background .16s ease,color .16s ease,border-color .16s ease,transform .16s ease;
}
.site-header .nav-links > a:hover,
.site-header .nav-links > a.active,
.site-header .nav-links > a[aria-current="page"]{
  background:rgba(15,104,79,.09);
  color:var(--hs-primary) !important;
}
.site-header .mini-link-btn{
  border:1px solid rgba(18,59,51,.14) !important;
  background:#fffdf8 !important;
}
.site-header .mini-link-btn.primary,
.site-header .auth-mini-actions .mini-link-btn:first-child:last-child{
  background:var(--hs-primary) !important;
  color:#fff !important;
  border-color:var(--hs-primary) !important;
}
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  width:46px;
  height:46px;
  border:1px solid rgba(18,59,51,.14);
  border-radius:16px;
  background:#fffdf8;
  color:var(--hs-text);
  cursor:pointer;
}
.nav-toggle span{display:block;width:21px;height:2px;background:currentColor;border-radius:999px;transition:.18s ease;}
.site-header.is-nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.site-header.is-nav-open .nav-toggle span:nth-child(2){opacity:0}
.site-header.is-nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Page rhythm */
.wrap,.page,.page-shell{padding-top:32px !important;padding-bottom:64px !important;}
.wrap{width:min(calc(100% - 32px),1120px) !important;max-width:1120px !important;}
.container{width:min(calc(100% - 32px),1200px) !important;}
.card,.panel,.content-card,.simple-card,.menu-card,.embed-wrap,.hero-card,.reservation-item,.filter-panel,.cancel-modal-card,.confirm-modal-card,.day-detail,.month-list{
  border-color:var(--hs-line-soft) !important;
  box-shadow:var(--hs-shadow-soft) !important;
}
.card,.panel,.content-card,.simple-card,.menu-card,.hero-card{
  background:linear-gradient(180deg,var(--hs-card) 0%, #fcfaf5 100%) !important;
  border-radius:var(--hs-radius-xl) !important;
}
.card{padding:32px 28px !important;}
.card + .card{margin-top:24px !important;}
.title,.hero-copy h1,.page-hero h1,.section-title{
  color:var(--hs-text) !important;
  letter-spacing:-.045em !important;
  font-weight:950 !important;
}
.title{font-size:clamp(34px,4.4vw,54px) !important;margin-bottom:12px !important;}
.desc,.muted,.field-help,.reservation-meta{color:var(--hs-muted) !important;}
.desc{font-size:16px !important;line-height:1.75 !important;max-width:940px;}

/* Buttons */
.btn,.secondary,.danger,.tab-btn,.mini-link-btn,.carousel-nav{
  border-radius:999px !important;
  font-weight:850 !important;
}
.btn,.secondary,.danger,.tab-btn{
  min-height:46px !important;
  padding:0 18px !important;
  border:1px solid rgba(18,59,51,.14) !important;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease, border-color .16s ease;
}
.btn:hover,.secondary:hover,.danger:hover,.tab-btn:hover,.mini-link-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px rgba(0,40,27,.08);}
.btn-primary,.tab-btn.active{
  background:linear-gradient(180deg,var(--hs-primary),var(--hs-primary-dark)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 13px 28px rgba(15,104,79,.18) !important;
}
.secondary,.btn-secondary{
  background:#fffdf8 !important;
  color:var(--hs-text) !important;
}
.danger,.btn-danger{
  color:var(--hs-danger) !important;
  border-color:rgba(168,61,58,.24) !important;
  background:var(--hs-danger-soft) !important;
}
.btn:disabled,.secondary:disabled,.danger:disabled{opacity:.58 !important;transform:none !important;box-shadow:none !important;}
.actions{gap:10px !important;}

/* Forms */
.field span,.field-label{color:var(--hs-text) !important;font-weight:900 !important;}
.field input,.field select,.field textarea,
.input,
.form-grid input:not([type="radio"]):not([type="checkbox"]),
.form-grid select,.form-grid textarea,
.section-grid input:not([type="radio"]):not([type="checkbox"]),
.section-grid select,.section-grid textarea{
  background:#fff !important;
  border:1px solid rgba(18,59,51,.16) !important;
  border-radius:17px !important;
  min-height:54px !important;
  box-shadow:0 1px 0 rgba(255,255,255,.7) inset;
}
.field input:focus,.field select:focus,.field textarea:focus,
.form-grid input:not([type="radio"]):not([type="checkbox"]):focus,
.form-grid select:focus,.form-grid textarea:focus,
.section-grid input:not([type="radio"]):not([type="checkbox"]):focus,
.section-grid select:focus,.section-grid textarea:focus{
  border-color:rgba(15,104,79,.58) !important;
  box-shadow:0 0 0 4px rgba(15,104,79,.10) !important;
}
.filter-panel{
  background:#fffaf1 !important;
  border-radius:24px !important;
  padding:20px !important;
}
.filter-check{
  background:#fff !important;
  border:1px solid rgba(18,59,51,.10);
  border-radius:16px;
  padding:0 14px;
}
input[type="checkbox"],input[type="radio"]{accent-color:var(--hs-primary);}

/* Lists and cards */
.my-list{gap:18px !important;}
.reservation-item{
  border-radius:24px !important;
  padding:20px !important;
  background:#fff !important;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.reservation-item:hover{transform:translateY(-2px);box-shadow:var(--hs-shadow) !important;border-color:rgba(15,104,79,.22) !important;}
.reservation-item h3{color:var(--hs-text) !important;font-weight:950 !important;letter-spacing:-.02em;}
.inline-actions{gap:8px !important;}
.badge-status{
  display:inline-flex !important;
  align-items:center;
  border-radius:999px !important;
  padding:5px 10px !important;
  font-weight:950 !important;
  background:var(--hs-primary-soft) !important;
  color:var(--hs-primary-dark) !important;
}
.badge-status.waiting{background:var(--hs-warn) !important;color:#765400 !important;}
.badge-status.cancelled{background:#eeeeea !important;color:#74756f !important;}

/* Result and definition lists */
.result{border-top-color:rgba(18,59,51,.10) !important;}
.info{
  padding:18px;
  border-radius:22px;
  background:#fffdf8;
  border:1px solid rgba(18,59,51,.08);
}
.info dt{color:var(--hs-muted) !important;}
.info dd{color:var(--hs-text) !important;}

/* Calendar */
.calendar-head{align-items:center !important;}
.calendar-legend{gap:10px !important;}
.legend-chip{
  background:#fff !important;
  border-color:rgba(18,59,51,.13) !important;
  box-shadow:0 8px 16px rgba(0,40,27,.035);
}
.calendar-grid{gap:10px !important;}
.weekday{color:#7a8178 !important;}
.day{
  background:#fff !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:18px !important;
  box-shadow:0 4px 12px rgba(0,40,27,.025);
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease;
}
.day:hover{transform:translateY(-1px);border-color:rgba(15,104,79,.34) !important;box-shadow:0 10px 20px rgba(0,40,27,.06);}
.day.selected{outline:none !important;border-color:var(--hs-primary) !important;box-shadow:0 0 0 3px rgba(15,104,79,.18),0 10px 24px rgba(0,40,27,.08) !important;}
.day.has-booking{background:linear-gradient(180deg,#fff6d6,#fff9e8) !important;border-color:#e6ce74 !important;}
.day.has-any-booking:not(.has-booking){background:#f9fbf9 !important;border-style:solid !important;}
.day-num{font-weight:950 !important;}
.tag{
  max-width:100%;
  border-radius:10px !important;
  padding:4px 7px !important;
  font-size:11px !important;
  font-weight:850 !important;
  overflow:hidden;
  text-overflow:ellipsis;
}
.tag:not(.other):not(.wait):not(.more){background:#ddf2e6 !important;color:#0b5a42 !important;}
.tag.wait{background:#fff0ed !important;color:var(--hs-danger) !important;}
.tag.other{background:#edf0ed !important;color:#526159 !important;}
.tag.more{background:#e6ebe7 !important;color:#526159 !important;}
.day-detail,.month-list{
  background:#fff !important;
  border-radius:22px !important;
  padding:18px 20px !important;
}
.day-detail h3,.month-list h3{font-weight:950 !important;color:var(--hs-text) !important;}
.conflict-box{
  background:var(--hs-warn) !important;
  border-color:var(--hs-warn-line) !important;
  border-radius:20px !important;
}

/* Messages and modals */
.msg{border-radius:18px !important;font-weight:700;}
.msg.success{background:#eef8f1 !important;color:#195f39 !important;border-color:#cce9d5 !important;}
.msg.warn{background:var(--hs-warn) !important;color:#715200 !important;border-color:var(--hs-warn-line) !important;}
.msg.error{background:var(--hs-danger-soft) !important;color:var(--hs-danger) !important;border-color:rgba(168,61,58,.24) !important;}
.cancel-modal,.confirm-modal{backdrop-filter:blur(4px);}
.cancel-modal-card,.confirm-modal-card{
  background:#fffdf8 !important;
  border-radius:30px !important;
}
.cancel-policy,.confirm-notice{
  border-radius:22px !important;
}

/* Admin */
.topbar{align-items:center !important;}
.status-card,.toolbar{
  background:#fffdf8 !important;
  border-radius:24px !important;
}
.user-card{
  border-radius:24px !important;
  background:#fff !important;
  transition:transform .16s ease, box-shadow .16s ease;
}
.user-card:hover{transform:translateY(-2px);box-shadow:var(--hs-shadow) !important;}
.tab-btn.active{background:var(--hs-primary) !important;}
.search-box input{background:#fff !important;border-radius:999px !important;}

/* Main/site pages */
.hero{background:linear-gradient(180deg,#f4efe3 0%, #f9f6ed 100%) !important;}
.cta-card{box-shadow:var(--hs-shadow) !important;}
.footer-links-strip{background:#ede7da;border-top:1px solid rgba(18,59,51,.08);}
.footer-links-inner{display:flex;gap:18px;flex-wrap:wrap;padding:18px 0;}
.footer-links-inner a{font-weight:800;color:var(--hs-text);}
.footer{background:#092f25;color:#fff;padding:34px 0;}
.muted-light{color:rgba(255,255,255,.74);}

@media (max-width: 920px){
  .site-header .nav{flex-wrap:wrap;min-height:68px;}
  .nav-toggle{display:flex !important;margin-left:auto;}
  .site-header .nav-links{
    display:none !important;
    width:100%;
    flex-direction:column;
    align-items:stretch !important;
    gap:8px !important;
    padding:8px 0 4px;
  }
  .site-header.is-nav-open .nav-links{display:flex !important;}
  .site-header .nav-links > a,
  .site-header .nav-links .mini-link-btn{
    width:100%;
    min-height:44px;
    justify-content:flex-start !important;
    padding:0 14px !important;
    background:#fffdf8;
    border:1px solid rgba(18,59,51,.08);
  }
  .top-auth-area,.auth-mini-actions{width:100%;}
  .auth-mini-actions{display:grid !important;grid-template-columns:1fr;}
  .wrap,.page{width:min(calc(100% - 22px),1120px) !important;padding-top:22px !important;}
  .card{padding:24px 18px !important;border-radius:24px !important;}
  .filter-grid{grid-template-columns:1fr 1fr !important;}
  .my-list{grid-template-columns:1fr !important;}
}

@media (max-width: 640px){
  .site-header .brand-logo,.site-header .brand-mark{width:40px !important;height:40px !important;}
  .site-header .brand-text strong,.site-header .brand-title{font-size:17px !important;}
  .site-header .brand-text span{display:none;}
  .container,.wrap{width:min(calc(100% - 18px),1120px) !important;}
  .title{font-size:32px !important;}
  .grid,.form-grid,.section-grid,.filter-grid,.info{grid-template-columns:1fr !important;}
  .actions,.inline-actions,.confirm-actions{justify-content:stretch !important;}
  .actions .btn,.actions .secondary,.actions .danger,.inline-actions button,.inline-actions a,.confirm-actions .btn{width:100%;}
  .calendar-grid{gap:6px !important;}
  .day{min-height:76px !important;padding:8px !important;border-radius:14px !important;}
  .tag{font-size:10px !important;padding:3px 5px !important;}
}


/* ------------------------------------------------------------------
   Hansalim NC Reservation – Design Stabilization v9
   Scope: main page, facility page, header/buttons/cards/calendar readability.
   Function logic remains based on v7; this layer is visual/layout only.
------------------------------------------------------------------- */
:root{
  --v9-green:#113b2e;
  --v9-green-2:#1f684f;
  --v9-sage:#8faf95;
  --v9-ivory:#f7f5ef;
  --v9-sand:#e9e3d3;
  --v9-wood:#b9824c;
  --v9-ink:#183b32;
  --v9-muted:#64746b;
  --v9-line:rgba(24,59,50,.13);
  --v9-card:#fffdf8;
  --v9-shadow:0 18px 48px rgba(17,59,46,.10);
  --v9-radius:26px;
}
body{
  background:linear-gradient(180deg,#f7f5ef 0%,#f3efe5 100%) !important;
}
.container{width:min(calc(100% - 48px),1280px) !important;}
.site-header{background:rgba(255,253,248,.92) !important;}
.site-header .nav{min-height:72px !important;}
.site-header .brand-logo{width:44px !important;height:44px !important;border-radius:16px !important;}
.brand-subtitle{display:block;font-size:11px;color:var(--v9-muted);font-weight:700;letter-spacing:-.01em;margin-top:2px;}
.site-header .nav-links > a.nav-cta,
.site-header .nav-links > a[href$="reserve.html"],
.site-header .nav-links > a[href="../pages/reserve.html"]{
  background:var(--v9-green) !important;color:#fff !important;border:1px solid var(--v9-green) !important;padding:0 18px !important;
}
.site-header .nav-links > a.nav-cta:hover{background:#0c2f25 !important;color:#fff !important;}

.v9-home-hero{position:relative;min-height:520px;display:flex;align-items:center;overflow:hidden;background:#eef2e8;border-bottom:1px solid var(--v9-line);}
.v9-hero-media{position:absolute;inset:0;}
.v9-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(247,245,239,.98) 0%,rgba(247,245,239,.88) 34%,rgba(247,245,239,.18) 63%,rgba(247,245,239,.03) 100%);}
.v9-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;}
.v9-hero-content{position:relative;z-index:1;padding:88px 0;}
.v9-kicker,.v9-small-label{margin:0 0 14px;color:var(--v9-green-2);font-size:14px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;}
.v9-home-hero h1,.v9-sub-hero h1{margin:0 0 18px;color:var(--v9-green);font-weight:950;letter-spacing:-.07em;line-height:1.05;}
.v9-home-hero h1{font-size:clamp(46px,6vw,82px);}
.v9-sub-hero h1{font-size:clamp(40px,5.2vw,70px);}
.v9-hero-lead,.v9-sub-hero p{font-size:clamp(18px,2vw,24px);line-height:1.65;color:#23463d;max-width:620px;margin:0;}
.v9-hero-actions,.v9-inline-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;align-items:center;}
.v9-section{padding:72px 0;}
.v9-section-head h2{margin:0 0 12px;color:var(--v9-green);font-size:clamp(34px,4vw,52px);letter-spacing:-.055em;line-height:1.12;font-weight:950;}
.v9-section-head p{margin:0;color:var(--v9-muted);font-size:17px;}
.v9-facility-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:36px;}
.v9-facility-card{background:#fff;border:1px solid var(--v9-line);border-radius:24px;overflow:hidden;box-shadow:var(--v9-shadow);transition:transform .16s ease,box-shadow .16s ease;}
.v9-facility-card:hover{transform:translateY(-4px);box-shadow:0 24px 54px rgba(17,59,46,.15);}
.v9-facility-card img{width:100%;height:188px;object-fit:cover;}
.v9-facility-card>div{padding:20px 20px 22px;}
.v9-card-kicker{margin:0 0 7px;color:var(--v9-green-2);font-size:12px;font-weight:900;}
.v9-facility-card h3{margin:0 0 8px;color:var(--v9-green);font-size:23px;font-weight:950;letter-spacing:-.04em;}
.v9-facility-card p{margin:0;color:var(--v9-muted);font-size:15px;line-height:1.65;min-height:48px;}
.v9-facility-card a{display:inline-flex;margin-top:16px;color:var(--v9-green);font-weight:900;}
.v9-value-band{padding:0 0 72px;}
.v9-value-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:linear-gradient(180deg,#eef4e9,#e8efe2);border:1px solid rgba(17,59,46,.10);border-radius:24px;box-shadow:0 10px 28px rgba(17,59,46,.07);overflow:hidden;}
.v9-value-grid div{padding:26px 28px;border-right:1px dashed rgba(17,59,46,.18);}
.v9-value-grid div:last-child{border-right:0;}
.v9-value-grid strong{display:block;color:var(--v9-green);font-size:20px;font-weight:950;margin-bottom:7px;}
.v9-value-grid span{display:block;color:var(--v9-muted);font-size:15px;line-height:1.6;}
.v9-home-split{display:grid;grid-template-columns:1.15fr .85fr;gap:24px;}
.v9-mini-panel{background:#fff;border:1px solid var(--v9-line);border-radius:26px;box-shadow:var(--v9-shadow);padding:34px;}
.v9-mini-panel-muted{background:linear-gradient(180deg,#f5f1e6,#eee6d5);}
.v9-mini-panel h2{margin:0 0 12px;color:var(--v9-green);font-size:36px;letter-spacing:-.05em;}
.v9-mini-panel h3{margin:0 0 12px;color:var(--v9-green);font-size:30px;letter-spacing:-.04em;}
.v9-mini-panel p{margin:0;color:var(--v9-muted);font-size:16px;line-height:1.75;}

.v9-sub-hero{background:linear-gradient(90deg,#f8f6f0 0%,#eff4ef 100%);border-bottom:1px solid var(--v9-line);}
.v9-sub-hero-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:46px;align-items:center;min-height:360px;padding:44px 0;}
.v9-sub-hero figure{margin:0;border-radius:0 0 0 56px;overflow:hidden;box-shadow:0 22px 58px rgba(17,59,46,.16);height:310px;}
.v9-sub-hero figure img{width:100%;height:100%;object-fit:cover;}
.v9-facility-layout{display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:start;}
.v9-section-side h2{margin:0 0 14px;color:var(--v9-green);font-size:clamp(28px,3.4vw,42px);line-height:1.15;letter-spacing:-.055em;font-weight:950;}
.v9-section-side p{margin:0 0 24px;color:var(--v9-muted);font-size:16px;line-height:1.75;}
.v9-photo-rail{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:14px;overflow-x:auto;padding-bottom:8px;}
.v9-photo-rail figure{position:relative;margin:0;border-radius:18px;overflow:hidden;min-height:190px;background:#eee;box-shadow:0 14px 34px rgba(17,59,46,.10);}
.v9-photo-rail img{width:100%;height:100%;object-fit:cover;}
.v9-photo-rail span{position:absolute;top:10px;left:10px;z-index:1;display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;border-radius:9px;background:var(--v9-green);color:#fff;font-weight:950;}
.v9-info-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-top:26px;}
.v9-info-row article{background:#fff;border:1px solid var(--v9-line);border-radius:18px;padding:20px 18px;box-shadow:0 10px 24px rgba(17,59,46,.06);}
.v9-info-row strong{display:block;color:var(--v9-green);font-size:18px;font-weight:950;}
.v9-info-row span{display:block;margin-top:5px;color:var(--v9-muted);font-size:14px;}
.v9-floorplan-section{padding-top:24px;}
.v9-floorplan-grid{display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:start;}
.v9-floorplan-card{margin:0;background:#fff;border:1px solid var(--v9-line);border-radius:24px;box-shadow:var(--v9-shadow);padding:22px;}
.v9-floorplan-card img{width:100%;height:auto;object-fit:contain;}
.v9-meeting-grid{display:grid;grid-template-columns:260px 1fr;gap:34px;align-items:start;}
.v9-meeting-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
.v9-meeting-card{background:#fff;border:1px solid var(--v9-line);border-radius:22px;overflow:hidden;box-shadow:var(--v9-shadow);}
.v9-meeting-card img{width:100%;height:170px;object-fit:cover;}
.v9-meeting-card div{padding:20px;}
.v9-meeting-card h3{margin:0 0 10px;color:var(--v9-green);font-size:22px;letter-spacing:-.04em;}
.v9-meeting-card p{margin:0 0 18px;color:var(--v9-muted);font-size:15px;line-height:1.65;}
.v9-bottom-cta{padding:34px 0 70px;}
.v9-bottom-cta-inner{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;background:linear-gradient(135deg,#113b2e,#0c2f25);color:#fff;border-radius:28px;padding:36px 44px;}
.v9-bottom-cta h2{margin:0 0 8px;font-size:28px;letter-spacing:-.04em;}
.v9-bottom-cta p{margin:0;color:rgba(255,255,255,.78);}
.v9-bottom-cta .btn-secondary{background:#f8f4e9 !important;}
.v9-intro-copy{max-width:980px !important;background:#fff;border:1px solid var(--v9-line);border-radius:30px;box-shadow:var(--v9-shadow);padding:48px !important;}
.v9-intro-copy p{font-size:19px;line-height:2.05;color:#25493f;margin:0 0 30px;}
.v9-center-logo{display:flex;justify-content:center;margin-top:34px;}
.v9-center-logo img{max-width:360px;opacity:.92;}

/* Calendar readability v9 */
.calendar-grid{gap:12px !important;}
.day{min-height:116px !important;padding:12px !important;border-radius:18px !important;background:#fff !important;}
.day.has-booking{background:linear-gradient(180deg,#fff4c6,#fff9e7) !important;border-color:#d7bf66 !important;}
.day.has-any-booking:not(.has-booking){background:#f5f8f5 !important;border-color:rgba(17,59,46,.18) !important;}
.tag{font-size:11px !important;line-height:1.25 !important;border-radius:9px !important;}
.day-detail,.month-list{border:1px solid var(--v9-line) !important;box-shadow:0 12px 30px rgba(17,59,46,.07) !important;}

/* Lookup/admin cards v9 */
.reservation-item,.user-card,.status-card,.toolbar{border-radius:22px !important;border-color:var(--v9-line) !important;}
.filter-panel{background:#fffaf1 !important;border:1px solid var(--v9-line) !important;}

@media (max-width:1100px){
  .v9-facility-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .v9-info-row{grid-template-columns:repeat(3,minmax(0,1fr));}
  .v9-meeting-cards{grid-template-columns:1fr;}
}
@media (max-width:820px){
  .container{width:min(calc(100% - 24px),1280px) !important;}
  .v9-home-hero{min-height:520px;}
  .v9-hero-media::after{background:linear-gradient(180deg,rgba(247,245,239,.92) 0%,rgba(247,245,239,.78) 52%,rgba(247,245,239,.12) 100%);}
  .v9-sub-hero-grid,.v9-facility-layout,.v9-floorplan-grid,.v9-meeting-grid,.v9-home-split,.v9-bottom-cta-inner{grid-template-columns:1fr;}
  .v9-sub-hero figure{height:240px;border-radius:28px;}
  .v9-photo-rail{grid-template-columns:repeat(5,220px);}
  .v9-value-grid{grid-template-columns:1fr 1fr;}
  .v9-value-grid div:nth-child(2n){border-right:0;}
  .v9-facility-grid{grid-template-columns:1fr;}
  .v9-info-row{grid-template-columns:1fr 1fr;}
  .v9-bottom-cta-inner{padding:28px;}
}
@media (max-width:560px){
  .v9-home-hero h1{font-size:42px;}
  .v9-info-row,.v9-value-grid{grid-template-columns:1fr;}
  .v9-value-grid div{border-right:0;border-bottom:1px dashed rgba(17,59,46,.18);}
  .v9-value-grid div:last-child{border-bottom:0;}
  .v9-intro-copy{padding:28px !important;}
  .day{min-height:84px !important;}
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – Design Stabilization v10
   Scope: new hero ratio, simplified header/footer/actions, minimal pictograms,
   mypage/admin profile controls, and page-wide visual consistency.
------------------------------------------------------------------- */
.site-header .nav-links{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
}
.site-header .nav-links > a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
  height:42px !important;
  padding:0 14px !important;
  border-radius:999px !important;
  position:relative !important;
  top:auto !important;
  transform:none !important;
}
.site-header .nav-links > a.active,
.site-header .nav-links > a[aria-current="page"]{
  background:rgba(15,104,79,.10) !important;
  box-shadow:inset 0 0 0 1px rgba(15,104,79,.04) !important;
}
.site-header .nav-links > a.nav-cta{
  min-width:88px !important;
  height:42px !important;
}
.top-auth-area{display:inline-flex;align-items:center;gap:8px;margin-left:2px;}
.auth-mini-actions{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;}
.user-mini-chip{display:inline-flex;align-items:center;height:36px;padding:0 12px;border-radius:999px;background:#edf5ec;color:var(--hs-primary-dark);font-size:13px;font-weight:900;white-space:nowrap;}
.site-header .mini-link-btn{display:inline-flex !important;align-items:center !important;justify-content:center !important;height:36px !important;min-height:36px !important;padding:0 12px !important;line-height:1 !important;}

.footer-links-strip.is-moved-to-footer{display:none !important;}
.footer-grid{display:grid;grid-template-columns:1fr auto;align-items:start;gap:24px;}
.footer-policy-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center;}
.footer-policy-links a{display:inline-flex;align-items:center;min-height:38px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);color:rgba(255,255,255,.88);font-size:13px;font-weight:850;background:rgba(255,255,255,.05);}
.footer-policy-links a:hover{background:rgba(255,255,255,.12);color:#fff;}

.v9-home-hero{min-height:clamp(520px,56vw,760px) !important;background:#e8f0e8 !important;}
.v9-hero-media img{object-fit:cover !important;object-position:center center !important;}
.v9-hero-media::after{background:linear-gradient(90deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.78) 34%,rgba(247,245,239,.18) 63%,rgba(247,245,239,.03) 100%) !important;}
.v9-hero-content{padding:clamp(88px,9vw,140px) 0 !important;}
.v9-hero-lead{font-weight:700;}
.v9-section-head p{max-width:720px;margin:0 auto !important;line-height:1.7;}

.hs-picto{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:12px;background:#eef5ec;color:var(--v9-green);flex:0 0 auto;}
.hs-picto svg{width:23px;height:23px;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;fill:none;}
.v9-facility-card .card-title-row,.v9-info-row article,.v9-meeting-card h3{display:flex;align-items:center;gap:10px;}
.v9-facility-card .card-title-row{margin-bottom:8px;}
.v9-facility-card .card-title-row h3{margin:0;}
.v9-info-row article{justify-content:flex-start;align-items:center;}
.v9-info-row article .hs-picto{width:38px;height:38px;}
.v9-info-row article strong{display:block;}
.v9-info-row article span:not(.hs-picto){display:block;}

.v10-page-header-actions,.top-actions.v10-simple{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.v10-page-header-actions .btn,.top-actions.v10-simple .btn{height:42px;}

.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px;}
.profile-grid .field.full{grid-column:1/-1;}
.profile-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:22px;}
.profile-note{margin-top:14px;color:var(--hs-muted);line-height:1.7;}
.admin-password-modal{position:fixed;inset:0;background:rgba(0,0,0,.42);display:none;align-items:center;justify-content:center;padding:18px;z-index:1200;backdrop-filter:blur(4px);}
.admin-password-modal.show{display:flex;}
.admin-password-card{width:min(520px,100%);background:#fffdf8;border:1px solid rgba(18,59,51,.12);border-radius:28px;box-shadow:0 24px 70px rgba(0,0,0,.24);padding:26px;}
.admin-password-card h2{margin:0 0 10px;color:var(--hs-text);font-size:26px;font-weight:950;}

@media (max-width:1080px){
  .site-header .nav{align-items:center !important;}
  .site-header .nav-links{gap:6px !important;}
  .site-header .nav-links > a{height:38px !important;padding:0 10px !important;font-size:13px !important;}
}
@media (max-width:920px){
  .top-auth-area,.auth-mini-actions{width:100%;}
  .auth-mini-actions{display:grid !important;grid-template-columns:1fr 1fr;gap:8px;}
  .user-mini-chip{grid-column:1/-1;justify-content:center;}
  .footer-grid{grid-template-columns:1fr;}
  .footer-policy-links{justify-content:flex-start;}
}
@media (max-width:640px){
  .v9-home-hero{min-height:560px !important;}
  .v9-hero-media::after{background:linear-gradient(180deg,rgba(247,245,239,.94) 0%,rgba(247,245,239,.82) 48%,rgba(247,245,239,.30) 100%) !important;}
  .profile-grid{grid-template-columns:1fr;}
  .auth-mini-actions{grid-template-columns:1fr;}
}


/* ------------------------------------------------------------------
   Hansalim NC Reservation – Design Stabilization v11
   Scope: hero ratio, typography spacing, reserve calendar, floor cards,
   page hero images, mypage centering and active header alignment.
------------------------------------------------------------------- */
:root{
  --v11-hero-ratio: 16 / 9;
}
.title,.hero-copy h1,.page-hero h1,.section-title,
.v9-home-hero h1,.v9-sub-hero h1,.v9-section-head h2,
.v9-mini-panel h2,.v9-intro-copy h1,.reserve-calendar-head h2{
  letter-spacing:-.028em !important;
}
.v9-home-hero h1,.v9-sub-hero h1{
  letter-spacing:-.035em !important;
  word-spacing:.02em;
}
.site-header .nav-links > a,
.site-header .mini-link-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  vertical-align:middle !important;
  height:40px !important;
  line-height:1 !important;
  padding-top:0 !important;
  padding-bottom:1px !important;
}
.site-header .nav-links > a.active,
.site-header .nav-links > a[aria-current="page"]{
  transform:translateY(0) !important;
}
.wrap{margin-left:auto !important;margin-right:auto !important;}
.page-mypage-v11 .wrap{width:min(calc(100% - 48px),1120px) !important;margin:42px auto 72px !important;padding-top:0 !important;}
.page-mypage-v11 .card{width:100%;}

/* Main hero: keep wide image visible without square-like cropping */
.v9-home-hero{
  min-height:auto !important;
  display:block !important;
  background:linear-gradient(180deg,#f7f5ef 0%,#eef4ed 100%) !important;
  padding:70px 0 !important;
}
.v9-home-hero .container.v9-hero-content{
  display:grid;
  grid-template-columns:minmax(320px,.85fr) minmax(480px,1.15fr);
  gap:56px;
  align-items:center;
  padding:0 !important;
}
.v9-hero-media{
  position:relative !important;
  inset:auto !important;
  order:2;
  width:100%;
  aspect-ratio:var(--v11-hero-ratio);
  border-radius:0 0 0 64px;
  overflow:hidden;
  box-shadow:0 24px 60px rgba(17,59,46,.16);
  background:#e8efe6;
}
.v9-hero-media::after{display:none !important;}
.v9-hero-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.v9-hero-content > .v9-kicker,
.v9-hero-content > h1,
.v9-hero-content > .v9-hero-lead,
.v9-hero-content > .v9-hero-actions{
  grid-column:1;
}
.v9-hero-content > .v9-hero-media{grid-column:2;grid-row:1 / span 4;}
.v9-home-hero h1{font-size:clamp(46px,5.2vw,76px) !important;}
.v9-hero-lead{font-size:clamp(18px,1.7vw,24px) !important;}

/* Page hero image treatment */
.v9-sub-hero figure img{object-fit:cover;object-position:center center;}
.page-intro-v9 .v9-sub-hero figure img,
.page-facility-v9 .v9-sub-hero figure img{object-position:center center;}
.page-guide-v11 .page-hero{
  background:
    linear-gradient(90deg,rgba(247,245,239,.95),rgba(247,245,239,.82)),
    url('../assets/new-hero-wide.png') center/cover no-repeat !important;
  border-bottom:1px solid rgba(18,59,51,.10);
}

/* Facility labels and pictograms */
.v9-photo-rail{grid-template-columns:repeat(7,minmax(170px,1fr)) !important;}
.v9-photo-rail figure{min-height:210px !important;}
.v9-photo-rail span{
  width:auto !important;
  min-width:42px !important;
  height:30px !important;
  padding:0 10px !important;
  border-radius:999px !important;
  font-size:13px !important;
}
.v9-info-row article{
  min-height:108px;
  padding:22px !important;
  align-items:center !important;
}
.v9-info-row article .hs-picto{
  width:44px !important;
  height:44px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 44px !important;
  margin:0 !important;
}
.v9-info-row article .hs-picto svg{display:block;width:25px !important;height:25px !important;}

/* Reserve dashboard calendar */
.reserve-dashboard-page{padding-top:42px !important;}
.reserve-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:26px;align-items:start;}
.reserve-calendar-card{padding:32px !important;}
.reserve-calendar-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px;}
.reserve-calendar-head h2{margin:10px 0 8px;color:var(--hs-text);font-size:clamp(30px,3.2vw,44px);font-weight:950;}
.reserve-calendar-head p{margin:0;color:var(--hs-muted);line-height:1.65;}
.reserve-calendar-controls{display:flex;align-items:center;gap:10px;white-space:nowrap;}
.reserve-calendar-controls strong{font-size:18px;color:var(--hs-text);font-weight:950;min-width:100px;text-align:center;}
.reserve-calendar-legend{display:flex;gap:14px;flex-wrap:wrap;margin:12px 0 16px;color:var(--hs-muted);font-weight:850;}
.reserve-calendar-legend span{display:inline-flex;align-items:center;gap:6px;}
.legend-dot,.reserve-dot{display:inline-block;width:10px;height:10px;border-radius:999px;background:#0f684f;}
.legend-dot.dorm,.reserve-dot.dorm{background:#8b6a37;}
.legend-dot.waiting,.reserve-dot.waiting{background:#d19b22;}
.reserve-calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:8px;text-align:center;color:var(--hs-muted);font-weight:900;}
.reserve-calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.reserve-day{min-height:118px;border:1px solid rgba(18,59,51,.10);border-radius:18px;background:#fff;box-shadow:0 4px 12px rgba(0,40,27,.025);padding:10px;text-align:left;display:flex;flex-direction:column;gap:5px;cursor:pointer;transition:.16s ease;color:var(--hs-text);}
.reserve-day:hover{transform:translateY(-1px);border-color:rgba(15,104,79,.34);box-shadow:0 10px 20px rgba(0,40,27,.06);}
.reserve-day.empty{background:rgba(255,255,255,.36);box-shadow:none;cursor:default;}
.reserve-day.today{border-color:rgba(15,104,79,.45);}
.reserve-day.selected{box-shadow:0 0 0 3px rgba(15,104,79,.15),0 10px 22px rgba(0,40,27,.08);border-color:var(--hs-primary);}
.reserve-day.has-items{background:#fffdf8;}
.reserve-day strong{font-weight:950;font-size:16px;}
.reserve-tag{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:9px;padding:4px 6px;font-size:11px;font-weight:850;background:#ddf2e6;color:#0b5a42;}
.reserve-tag.dorm{background:#f4ead9;color:#745020;}
.reserve-tag.waiting{background:#fff2cf;color:#73510c;}
.reserve-tag.more{background:#edf0ed;color:#526159;}
.reserve-day-detail{margin-top:18px;background:#fff;border:1px solid rgba(18,59,51,.10);border-radius:22px;padding:18px 20px;}
.reserve-day-detail h3{margin:0 0 10px;color:var(--hs-text);font-size:18px;font-weight:950;}
.reserve-day-detail p{margin:0;color:var(--hs-muted);}
.reserve-day-detail ul{margin:0;padding:0;list-style:none;display:grid;gap:8px;}
.reserve-day-detail li{display:flex;align-items:center;gap:8px;color:var(--hs-text);font-weight:850;}
.reserve-calendar-loading,.reserve-calendar-error{grid-column:1/-1;padding:28px;border-radius:18px;background:#fff;color:var(--hs-muted);}
.reserve-calendar-error{color:var(--hs-danger);background:var(--hs-danger-soft);}
.reserve-side-panel{display:grid;gap:18px;}
.reserve-side-panel .simple-card{padding:26px !important;}
.btn-wrap.stacked{display:grid;gap:10px;}

/* Cafe image card crops */
.v9-facility-card img[src$="cafe-habi-real.jpg"]{object-position:center center;}

@media (max-width:1080px){
  .v9-home-hero .container.v9-hero-content{grid-template-columns:1fr;}
  .v9-hero-media{grid-column:1 !important;grid-row:auto !important;order:0;border-radius:34px;}
  .v9-hero-content > .v9-kicker,.v9-hero-content > h1,.v9-hero-content > .v9-hero-lead,.v9-hero-content > .v9-hero-actions{grid-column:1;}
  .reserve-dashboard-grid{grid-template-columns:1fr;}
  .reserve-calendar-head{flex-direction:column;}
}
@media (max-width:760px){
  .v9-home-hero{padding:38px 0 !important;}
  .reserve-calendar-grid,.reserve-calendar-weekdays{gap:5px;}
  .reserve-day{min-height:86px;border-radius:13px;padding:7px;}
  .reserve-tag{font-size:10px;padding:3px 5px;}
  .reserve-calendar-controls{width:100%;justify-content:space-between;}
  .v9-photo-rail{grid-template-columns:repeat(7,210px) !important;}
}

/* v11 final layout corrections */
.v9-hero-media{margin:0 !important;}
.v9-hero-content > div:first-child{grid-column:1;}
.v9-hero-content > figure.v9-hero-media{grid-column:2;grid-row:1;}
@media (max-width:1080px){.v9-hero-content > figure.v9-hero-media{grid-column:1;grid-row:auto;}}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – Design Stabilization v12
   Scope: restore previous main hero feel; rebuild Guide/Intro pages
   with story-driven sections, wider whitespace and consistent CTA.
------------------------------------------------------------------- */
.v9-home-hero{
  position:relative !important;
  overflow:hidden !important;
  min-height:clamp(560px,58vw,780px) !important;
  display:block !important;
  padding:0 !important;
  background:#e8f0e8 !important;
}
.v9-home-hero .v9-hero-media{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  aspect-ratio:auto !important;
  border-radius:0 !important;
  box-shadow:none !important;
  order:0 !important;
  background:#e8f0e8 !important;
}
.v9-home-hero .v9-hero-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.v9-home-hero .v9-hero-media::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(90deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.84) 35%,rgba(247,245,239,.32) 66%,rgba(247,245,239,.04) 100%) !important;
}
.v9-home-hero .container.v9-hero-content{
  position:relative !important;
  z-index:2 !important;
  display:block !important;
  padding:clamp(110px,10vw,154px) 0 !important;
  max-width:var(--max) !important;
}
.v9-home-hero .v9-hero-content > *{max-width:640px;}
.v9-home-hero h1{letter-spacing:-.025em !important;}

.story-hero{
  padding:64px 0 70px;
  background:linear-gradient(180deg,#f7f5ef 0%,#f1f5ef 100%);
  border-bottom:1px solid rgba(18,59,51,.10);
}
.story-hero-grid{
  display:grid;
  grid-template-columns:minmax(320px,.9fr) minmax(420px,1.1fr);
  gap:56px;
  align-items:center;
}
.story-kicker,.story-eyebrow{
  margin:0 0 12px;
  color:var(--hs-green,#3e7a52);
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:13px;
}
.story-hero h1{
  margin:0 0 22px;
  color:var(--hs-text,#123b33);
  font-size:clamp(46px,5.5vw,78px);
  line-height:1.08;
  letter-spacing:-.025em;
  font-weight:950;
}
.story-hero p{
  margin:0;
  max-width:620px;
  color:#34574e;
  font-size:clamp(18px,1.65vw,24px);
  line-height:1.75;
  font-weight:650;
}
.story-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;align-items:center;}
.story-hero-image{
  margin:0;
  border-radius:0 0 0 64px;
  overflow:hidden;
  background:#e8efe6;
  box-shadow:0 24px 60px rgba(17,59,46,.16);
  aspect-ratio:16/9;
}
.story-hero-image img{width:100%;height:100%;object-fit:cover;object-position:center;}
.story-hero-guide .story-hero-image img{object-position:center center;}
.story-section{padding:82px 0;border-top:1px solid rgba(18,59,51,.07);}
.story-narrow{max-width:920px;text-align:center;}
.story-narrow h2,.story-split h2,.story-section-head h2,.story-flow-wrap h2,.story-cta-card h2{
  margin:0 0 22px;
  color:var(--hs-text,#123b33);
  font-size:clamp(34px,4vw,56px);
  line-height:1.15;
  letter-spacing:-.025em;
  font-weight:950;
}
.story-narrow p{
  margin:0 auto 20px;
  max-width:820px;
  color:#365951;
  font-size:19px;
  line-height:2;
}
.story-split{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:center;}
.story-split p{font-size:18px;line-height:1.9;color:#365951;margin:0;}
.story-name-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.story-name-cards article{
  min-height:190px;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:26px;
  border-radius:28px;
  background:#fffdf8;
  border:1px solid rgba(18,59,51,.11);
  box-shadow:0 18px 42px rgba(0,40,27,.07);
}
.story-name-cards strong{font-size:30px;color:var(--hs-text,#123b33);font-weight:950;letter-spacing:-.02em;}
.story-name-cards span{font-size:16px;color:#557066;line-height:1.75;}
.story-section-head{text-align:center;margin-bottom:28px;}
.story-promise-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.story-promise-grid article{
  background:#fffdf8;
  border:1px solid rgba(18,59,51,.11);
  border-radius:28px;
  padding:28px;
  box-shadow:0 18px 42px rgba(0,40,27,.07);
}
.story-number{display:inline-flex;margin-bottom:24px;color:#7a8b82;font-weight:950;font-size:14px;letter-spacing:.08em;}
.story-promise-grid h3{margin:0 0 12px;color:var(--hs-text,#123b33);font-size:24px;letter-spacing:-.02em;font-weight:950;}
.story-promise-grid p{margin:0;color:#557066;line-height:1.82;font-size:16px;}
.story-flow-section{background:#f4f0e7;}
.story-flow-wrap{display:grid;grid-template-columns:.78fr 1.22fr;gap:42px;align-items:start;}
.story-flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.story-flow li{position:relative;background:#fffdf8;border:1px solid rgba(18,59,51,.11);border-radius:999px;padding:20px 22px;min-height:124px;display:flex;flex-direction:column;justify-content:center;gap:4px;box-shadow:0 14px 30px rgba(0,40,27,.05);}
.story-flow strong{color:var(--hs-text,#123b33);font-size:20px;font-weight:950;}
.story-flow span{color:#60736b;font-size:14px;line-height:1.55;}
.story-cta-section{padding:80px 0;background:#f7f5ef;}
.story-cta-card{display:flex;align-items:center;justify-content:space-between;gap:30px;border-radius:34px;background:linear-gradient(135deg,#0b3d31,#0f5a45);padding:38px 44px;color:#fff;box-shadow:0 24px 60px rgba(0,40,27,.18);}
.story-cta-card h2{color:#fff;margin:0;max-width:760px;}
.story-cta-card .story-eyebrow{color:#d9f1d9;}
.story-cta-card .btn-secondary{background:#fffdf8;color:#123b33;border-color:transparent;}

.guide-quick-section{padding:82px 0 62px;}
.guide-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.guide-steps article{background:#fffdf8;border:1px solid rgba(18,59,51,.11);border-radius:28px;padding:24px;box-shadow:0 16px 38px rgba(0,40,27,.06);}
.guide-steps span{display:inline-flex;margin-bottom:18px;color:#3e7a52;font-weight:950;font-size:13px;letter-spacing:.08em;}
.guide-steps strong{display:block;color:#123b33;font-size:21px;font-weight:950;margin-bottom:8px;letter-spacing:-.02em;}
.guide-steps p{margin:0;color:#5c7068;font-size:15px;line-height:1.75;}
.guide-space-section{padding:36px 0 76px;background:#f4f0e7;}
.guide-space-grid{display:grid;gap:28px;}
.guide-space-card{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr);gap:34px;align-items:center;background:#fffdf8;border:1px solid rgba(18,59,51,.10);border-radius:34px;padding:24px;box-shadow:0 20px 52px rgba(0,40,27,.08);}
.guide-space-card-reverse{grid-template-columns:minmax(360px,1.15fr) minmax(280px,.85fr);}
.guide-space-card-reverse img{order:2;}
.guide-space-card img{width:100%;height:340px;object-fit:cover;border-radius:26px;}
.guide-space-card h2{margin:0 0 18px;color:#123b33;font-size:clamp(30px,3vw,46px);line-height:1.14;font-weight:950;letter-spacing:-.025em;}
.guide-space-card ul{margin:0 0 24px;padding:0;list-style:none;display:grid;gap:10px;}
.guide-space-card li{position:relative;padding-left:18px;color:#4d675f;font-size:17px;line-height:1.75;}
.guide-space-card li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:999px;background:#3e7a52;}
.guide-policy-section{padding:76px 0;background:#f7f5ef;}
.guide-policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.guide-policy-grid article{background:#fffdf8;border:1px solid rgba(18,59,51,.10);border-radius:28px;padding:28px;box-shadow:0 16px 38px rgba(0,40,27,.06);}
.guide-policy-grid h3{margin:0 0 12px;color:#123b33;font-size:24px;font-weight:950;letter-spacing:-.02em;}
.guide-policy-grid p{margin:0;color:#5d7069;font-size:16px;line-height:1.82;}

@media (max-width:1080px){
  .story-hero-grid,.story-split,.story-flow-wrap{grid-template-columns:1fr;}
  .story-hero-image{border-radius:34px;}
  .story-name-cards,.story-promise-grid,.guide-policy-grid{grid-template-columns:repeat(2,1fr);}
  .guide-steps{grid-template-columns:repeat(2,1fr);}
  .guide-space-card,.guide-space-card-reverse{grid-template-columns:1fr;}
  .guide-space-card-reverse img{order:0;}
  .story-flow{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:700px){
  .v9-home-hero .v9-hero-media::after{background:linear-gradient(180deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.84) 52%,rgba(247,245,239,.24) 100%) !important;}
  .story-hero{padding:42px 0 48px;}
  .story-section,.guide-quick-section,.guide-policy-section{padding:54px 0;}
  .story-name-cards,.story-promise-grid,.guide-policy-grid,.guide-steps,.story-flow{grid-template-columns:1fr;}
  .story-cta-card{display:block;padding:30px 24px;}
  .story-cta-card .story-actions{margin-top:22px;}
  .guide-space-card{padding:16px;border-radius:26px;}
  .guide-space-card img{height:260px;border-radius:20px;}
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – Design Stabilization v13
   Scope: text wrapping, hero visibility, factual intro/facility copy,
   reserve calendar containment and floor card icon alignment.
------------------------------------------------------------------- */
body, .site-header, .v9-section, .story-section, .guide-space-section{
  word-break:keep-all;
  overflow-wrap:normal;
}
.site-header .nav-links > a,
.site-header .mini-link-btn,
.btn,
.v9-photo-rail span,
.reserve-calendar-controls strong,
.footer-links-inner a{
  white-space:nowrap !important;
}
.v9-home-hero h1,
.v9-sub-hero h1,
.story-hero h1,
.story-narrow h2,
.story-split h2,
.story-section-head h2,
.v9-section-head h2,
.reserve-calendar-head h2{
  letter-spacing:-.018em !important;
  line-height:1.13 !important;
}
@media (min-width: 980px){
  .v9-section-head h2,
  .story-section-head h2,
  .story-narrow h2,
  .reserve-calendar-head h2{
    white-space:nowrap;
  }
}
.v9-section-head p,
.story-narrow p,
.story-split p,
.v9-facility-card p,
.v9-meeting-card p,
.guide-space-card li,
.story-promise-grid p{
  line-height:1.82;
}

/* Main hero: use no-crop prepared image and keep center exterior visible */
.v9-home-hero{
  min-height:clamp(520px,46vw,780px) !important;
  background:#eef3ee !important;
}
.v9-home-hero .v9-hero-media img{
  object-fit:cover !important;
  object-position:center center !important;
}
.v9-home-hero .v9-hero-media::after{
  background:linear-gradient(90deg,rgba(247,245,239,.95) 0%,rgba(247,245,239,.80) 38%,rgba(247,245,239,.20) 70%,rgba(247,245,239,.04) 100%) !important;
}
.v9-home-hero .container.v9-hero-content{
  padding:clamp(96px,8vw,132px) 0 !important;
}
.v9-home-hero .v9-hero-content > *{max-width:700px;}
.v9-hero-lead{max-width:640px !important;}

/* Facility pages: hero photo should not feel like an unrelated cropped background */
.v9-sub-hero figure,
.story-hero-image{
  background:#eef3ee;
}
.v9-sub-hero figure img,
.story-hero-image img{
  object-fit:cover !important;
  object-position:center center !important;
}

/* Facility cards: keep small pictograms centered and text contained */
.v9-info-row article{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:14px !important;
  min-width:0 !important;
}
.v9-info-row article > .hs-picto{
  align-self:center !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 44px !important;
  width:44px !important;
  height:44px !important;
  margin:0 !important;
  overflow:hidden !important;
}
.v9-info-row article > .hs-picto svg{
  display:block !important;
  width:24px !important;
  height:24px !important;
  margin:auto !important;
}
.v9-info-row article > div{min-width:0;}
.v9-info-row article strong,
.v9-info-row article span:not(.hs-picto){
  white-space:normal;
}
.v9-photo-rail figure{min-width:170px;}
.v9-photo-rail span{box-shadow:0 4px 12px rgba(0,0,0,.14);}

/* Reserve page: prevent calendar from escaping its section */
.reserve-dashboard-page .container,
.reserve-dashboard-grid,
.reserve-calendar-card,
.reserve-calendar-grid,
.reserve-calendar-weekdays{
  min-width:0 !important;
  max-width:100% !important;
}
.reserve-dashboard-grid{
  grid-template-columns:1fr !important;
  gap:24px !important;
}
.reserve-calendar-card{
  overflow:hidden !important;
}
.reserve-calendar-grid,
.reserve-calendar-weekdays{
  width:100% !important;
  box-sizing:border-box !important;
}
.reserve-day{
  min-width:0 !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.reserve-side-panel{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px !important;
}
.reserve-side-panel .simple-card{min-width:0;}
.reserve-tag{
  white-space:nowrap !important;
}
@media (max-width:1180px){
  .reserve-side-panel{grid-template-columns:1fr !important;}
  .reserve-calendar-head{align-items:stretch !important;}
}
@media (max-width:760px){
  .reserve-calendar-card{padding:20px !important;}
  .reserve-day{min-height:78px !important;}
  .reserve-tag{font-size:9.5px !important;}
  .v9-home-hero .container.v9-hero-content{padding:80px 0 !important;}
}
@media (max-width:560px){
  .reserve-calendar-weekdays,
  .reserve-calendar-grid{gap:4px !important;}
  .reserve-day{border-radius:12px !important;padding:6px !important;}
  .reserve-day strong{font-size:13px !important;}
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v14 small visual corrections
   - Remove intro flow section in HTML.
   - Keep main hero building less right-shifted using balanced hero crop.
   - Refine title wording in intro promise card.
------------------------------------------------------------------- */
.v9-home-hero .v9-hero-media img{
  object-position:center center !important;
}
@media (max-width:760px){
  body.page-home-v9 .v9-home-hero .v9-hero-media img{
    object-position:62% center !important;
  }
}


/* ------------------------------------------------------------------
   Hansalim NC Reservation – v15 small corrections
   - Keep guide hero first line from breaking unexpectedly.
   - Remove problematic intro hero photo and use text-led hero.
   - Use wide prepared home hero so the center exterior is less cropped.
------------------------------------------------------------------- */
.nowrap{white-space:nowrap;}
.story-hero-guide .story-hero-grid{
  grid-template-columns:minmax(560px,1.08fr) minmax(380px,.92fr) !important;
}
.story-hero-guide h1{
  font-size:clamp(40px,4.25vw,62px) !important;
  line-height:1.12 !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
.story-hero-guide .story-hero-copy p{max-width:760px;}
.page-intro-v12 .story-hero-grid{
  display:block !important;
  max-width:1040px !important;
}
.page-intro-v12 .story-hero-copy{
  max-width:900px !important;
}
.page-intro-v12 .story-hero-copy h1{
  max-width:860px !important;
}
.page-intro-v12 .story-hero-copy p{
  max-width:760px !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media img{
  object-fit:cover !important;
  object-position:center center !important;
}
.page-home-v9 .v9-home-hero{
  min-height:clamp(520px,40.5vw,720px) !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  background:linear-gradient(90deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.88) 33%,rgba(247,245,239,.34) 56%,rgba(247,245,239,.03) 100%) !important;
}
@media (max-width:980px){
  .story-hero-guide .story-hero-grid{grid-template-columns:1fr !important;}
  .story-hero-guide h1{font-size:clamp(38px,8vw,58px) !important;}
}
@media (max-width:640px){
  .nowrap{white-space:normal;}
  .story-hero-guide h1{font-size:40px !important;}
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v16 hero stability corrections
   Scope: GDWEB-award-inspired photo-first layout, no mid-text image seam,
   guide title wrapping, intro nature-background hero.
------------------------------------------------------------------- */
/* Home: use a single full-width exterior photo like the approved main mockup. */
.page-home-v9 .v9-home-hero{
  min-height:clamp(540px,48vw,760px) !important;
  background:#eef4ee !important;
  isolation:isolate;
}
.page-home-v9 .v9-home-hero .v9-hero-media{
  inset:0 !important;
  background:#dfece5 !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  opacity:1 !important;
  filter:saturate(.98) contrast(.98) !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.98) 0%,
      rgba(247,245,239,.90) 24%,
      rgba(247,245,239,.62) 43%,
      rgba(247,245,239,.20) 63%,
      rgba(247,245,239,.02) 100%) !important;
}
.page-home-v9 .v9-home-hero .container.v9-hero-content{
  padding:clamp(100px,9vw,150px) 0 !important;
}
.page-home-v9 .v9-home-hero .v9-hero-content > *{
  max-width:620px !important;
}
.page-home-v9 .v9-home-hero h1{
  font-size:clamp(50px,5.6vw,86px) !important;
  line-height:1.05 !important;
  letter-spacing:-.025em !important;
}
.page-home-v9 .v9-hero-lead{
  font-size:clamp(19px,1.75vw,25px) !important;
  max-width:560px !important;
}

/* Guide: keep the key phrase together and prevent awkward mid-word title wraps. */
.story-hero-guide .story-hero-grid{
  grid-template-columns:minmax(620px,1fr) minmax(360px,.88fr) !important;
  gap:clamp(36px,5vw,72px) !important;
}
.story-hero-guide h1{
  font-size:clamp(42px,4vw,58px) !important;
  max-width:700px !important;
  line-height:1.12 !important;
}
.story-hero-guide h1 .nowrap{
  display:inline-block !important;
  white-space:nowrap !important;
}
.story-hero-guide .story-hero-image{
  border-radius:0 0 0 52px !important;
  box-shadow:0 24px 60px rgba(17,59,46,.14) !important;
}
.story-hero-guide .story-hero-image img{
  object-fit:cover !important;
  object-position:center center !important;
}

/* Intro: replace the unstable right-side photo with a calm nature-background hero. */
.page-intro-v12 .story-hero-intro{
  position:relative !important;
  min-height:clamp(520px,44vw,700px) !important;
  display:flex !important;
  align-items:center !important;
  overflow:hidden !important;
  background:#eef4ef !important;
}
.page-intro-v12 .story-hero-intro::before{
  content:"";
  position:absolute;
  inset:0;
  background:url('../assets/story-forest-hero.jpg') center center / cover no-repeat;
  opacity:.74;
  transform:scale(1.01);
}
.page-intro-v12 .story-hero-intro::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(247,245,239,.96) 0%,rgba(247,245,239,.88) 34%,rgba(247,245,239,.58) 62%,rgba(247,245,239,.30) 100%),
    linear-gradient(180deg,rgba(247,245,239,.20) 0%,rgba(247,245,239,.78) 100%);
}
.page-intro-v12 .story-hero-intro .container,
.page-intro-v12 .story-hero-intro .story-hero-grid,
.page-intro-v12 .story-hero-intro .story-hero-copy{
  position:relative !important;
  z-index:1 !important;
}
.page-intro-v12 .story-hero-grid{
  display:block !important;
  max-width:var(--max) !important;
}
.page-intro-v12 .story-hero-copy{
  max-width:820px !important;
}
.page-intro-v12 .story-hero-copy h1{
  max-width:780px !important;
  text-wrap:balance;
}
.page-intro-v12 .story-hero-copy p{
  max-width:680px !important;
}
.page-intro-v12 .story-hero-image{display:none !important;}

/* Section title stability: allow controlled line breaks but avoid Korean syllable fragmentation. */
.story-hero h1,
.v9-home-hero h1,
.v9-section-head h2,
.story-section-head h2{
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}

@media (max-width:1080px){
  .story-hero-guide .story-hero-grid{grid-template-columns:1fr !important;}
  .story-hero-guide h1{max-width:760px !important;}
  .story-hero-guide .story-hero-image{height:300px;}
}
@media (max-width:760px){
  .page-home-v9 .v9-home-hero{
    min-height:auto !important;
    padding:70px 0 290px !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media img{
    object-position:62% center !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media::after{
    background:linear-gradient(180deg,rgba(247,245,239,.98) 0%,rgba(247,245,239,.84) 48%,rgba(247,245,239,.25) 100%) !important;
  }
  .story-hero-guide h1 .nowrap{white-space:normal !important;}
  .story-hero-guide h1{font-size:clamp(38px,10vw,48px) !important;}
  .page-intro-v12 .story-hero-intro{min-height:auto !important;padding:76px 0 86px !important;}
}


/* -------------------------------------------------------------------
   Hansalim NC Reservation – v17 facility hero and CTA simplification
   Scope: remove duplicate reservation buttons; facility hero uses real
   uploaded nature image as background, not a generated image.
------------------------------------------------------------------- */

/* Home hero: avoid vertical image seam through text by rendering the
   approved exterior as a true full-hero background layer. */
.page-home-v9 .v9-home-hero .v9-hero-media{
  background: url('center-building-main.png') center center / cover no-repeat !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media img{
  display:none !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.98) 0%,
      rgba(247,245,239,.94) 26%,
      rgba(247,245,239,.70) 45%,
      rgba(247,245,239,.24) 66%,
      rgba(247,245,239,.04) 100%) !important;
}

/* Facility guide hero: home-like full visual treatment using the uploaded
   forest/mountain photo. It removes the right-side card image frame. */
.v17-facility-hero-bg{
  position:relative !important;
  min-height:clamp(430px,38vw,620px) !important;
  display:flex !important;
  align-items:center !important;
  overflow:hidden !important;
  background:#eef4ef !important;
}
.v17-facility-hero-bg::before{
  content:"";
  position:absolute;
  inset:0;
  background:url('facility-forest-hero.jpg') center center / cover no-repeat;
  opacity:.92;
  transform:scale(1.01);
}
.v17-facility-hero-bg::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.98) 0%,
      rgba(247,245,239,.92) 32%,
      rgba(247,245,239,.64) 58%,
      rgba(247,245,239,.28) 100%),
    linear-gradient(180deg,rgba(247,245,239,.28) 0%,rgba(247,245,239,.78) 100%);
}
.v17-facility-hero-bg .v9-sub-hero-grid{
  position:relative !important;
  z-index:1 !important;
  display:block !important;
  min-height:0 !important;
  padding:clamp(80px,8vw,132px) 0 !important;
}
.v17-facility-hero-bg .v9-sub-hero-grid > div{
  max-width:760px !important;
}
.v17-facility-hero-bg h1{
  max-width:760px !important;
  word-break:keep-all !important;
  text-wrap:balance;
}
.v17-facility-hero-bg p:not(.v9-kicker){
  max-width:640px !important;
  word-break:keep-all !important;
}

/* Reduce visual weight from remaining CTAs on content pages. */
.page-facility-v9 .v9-meeting-card .btn,
.page-facility-v9 .v9-section-side .btn{
  display:none !important;
}

@media (max-width:760px){
  .v17-facility-hero-bg{
    min-height:auto !important;
  }
  .v17-facility-hero-bg::after{
    background:
      linear-gradient(180deg,rgba(247,245,239,.98) 0%,rgba(247,245,239,.88) 58%,rgba(247,245,239,.40) 100%) !important;
  }
  .v17-facility-hero-bg .v9-sub-hero-grid{
    padding:64px 0 160px !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media{
    background-position:64% center !important;
  }
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v18 facility hero + retreat carousel
   Scope: keep facility hero image fully visible while applying the
   reading overlay only around the text area; enlarge the retreat photo
   carousel for a clearer lodging-style experience.
------------------------------------------------------------------- */
.v17-facility-hero-bg{
  min-height:clamp(500px,42vw,680px) !important;
  background:#edf3ee !important;
}
.v17-facility-hero-bg::before{
  background:url('facility-forest-hero.jpg') center center / cover no-repeat !important;
  opacity:1 !important;
  transform:none !important;
  filter:none !important;
}
.v17-facility-hero-bg::after{
  inset:0 auto 0 0 !important;
  width:min(820px,62vw) !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.98) 0%,
    rgba(247,245,239,.92) 42%,
    rgba(247,245,239,.62) 72%,
    rgba(247,245,239,0) 100%) !important;
}
.v17-facility-hero-bg .v9-sub-hero-grid{
  padding:clamp(88px,8.5vw,142px) 0 !important;
}
.v17-facility-hero-bg .v9-sub-hero-grid > div{
  max-width:720px !important;
}
.v17-facility-hero-bg h1,
.v17-facility-hero-bg p:not(.v9-kicker){
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}

.page-facility-v9 .v9-photo-rail{
  display:flex !important;
  grid-template-columns:none !important;
  gap:24px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:8px 4px 24px !important;
  scrollbar-width:thin;
  scrollbar-color:rgba(18,59,51,.35) rgba(18,59,51,.08);
}
.page-facility-v9 .v9-photo-rail::-webkit-scrollbar{height:10px;}
.page-facility-v9 .v9-photo-rail::-webkit-scrollbar-track{background:rgba(18,59,51,.08);border-radius:999px;}
.page-facility-v9 .v9-photo-rail::-webkit-scrollbar-thumb{background:rgba(18,59,51,.32);border-radius:999px;}
.page-facility-v9 .v9-photo-rail figure{
  flex:0 0 clamp(340px,34vw,520px) !important;
  min-width:clamp(340px,34vw,520px) !important;
  height:clamp(300px,28vw,410px) !important;
  min-height:0 !important;
  scroll-snap-align:start;
  border-radius:30px !important;
  box-shadow:0 22px 54px rgba(17,59,46,.14) !important;
}
.page-facility-v9 .v9-photo-rail figure:first-child{
  flex-basis:clamp(400px,38vw,590px) !important;
  min-width:clamp(400px,38vw,590px) !important;
}
.page-facility-v9 .v9-photo-rail img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
}
.page-facility-v9 .v9-photo-rail span{
  top:16px !important;
  left:16px !important;
  min-width:50px !important;
  height:34px !important;
  padding:0 14px !important;
  font-size:14px !important;
  box-shadow:0 8px 22px rgba(0,0,0,.16) !important;
}

@media (max-width:900px){
  .v17-facility-hero-bg::after{
    width:100% !important;
    background:linear-gradient(180deg,
      rgba(247,245,239,.98) 0%,
      rgba(247,245,239,.90) 48%,
      rgba(247,245,239,.44) 78%,
      rgba(247,245,239,.16) 100%) !important;
  }
  .v17-facility-hero-bg .v9-sub-hero-grid{
    padding:72px 0 180px !important;
  }
  .page-facility-v9 .v9-photo-rail figure,
  .page-facility-v9 .v9-photo-rail figure:first-child{
    flex-basis:78vw !important;
    min-width:78vw !important;
    height:300px !important;
  }
}


/* ------------------------------------------------------------------
   Hansalim NC Reservation – v19 carousel and intro hero refinement
   Scope: show one retreat photo at a time with prev/next controls;
   keep intro hero image clear and apply readability overlay only near text;
   add a restrained icon treatment to the center story cards.
------------------------------------------------------------------- */
.page-facility-v9 .v19-retreat-carousel{
  position:relative;
  width:100%;
  max-width:1040px;
}
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail{
  display:flex !important;
  width:100% !important;
  gap:0 !important;
  overflow:hidden !important;
  overflow-x:hidden !important;
  overflow-y:hidden !important;
  padding:0 !important;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  border-radius:34px;
  background:#edf4ee;
  box-shadow:0 24px 64px rgba(17,59,46,.15);
  scrollbar-width:none;
}
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail::-webkit-scrollbar{display:none;}
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure,
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure:first-child{
  flex:0 0 100% !important;
  min-width:100% !important;
  width:100% !important;
  height:clamp(420px,38vw,560px) !important;
  margin:0 !important;
  border-radius:34px !important;
  box-shadow:none !important;
  scroll-snap-align:start;
  overflow:hidden;
  background:#e7efe7;
}
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
}
.page-facility-v9 .v19-retreat-carousel .v9-photo-rail span{
  top:18px !important;
  left:18px !important;
  height:38px !important;
  min-width:58px !important;
  padding:0 16px !important;
  font-size:15px !important;
  border-radius:999px !important;
}
.v19-carousel-btn{
  position:absolute;
  z-index:4;
  top:50%;
  transform:translateY(-50%);
  width:54px;
  height:54px;
  border:1px solid rgba(18,59,51,.16);
  border-radius:999px;
  background:rgba(255,253,248,.92);
  color:#123b33;
  font-size:34px;
  font-weight:800;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 16px 38px rgba(0,40,27,.14);
  cursor:pointer;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease;
}
.v19-carousel-btn:hover{background:#fff;box-shadow:0 20px 44px rgba(0,40,27,.18);}
.v19-carousel-btn:active{transform:translateY(-50%) scale(.96);}
.v19-carousel-prev{left:18px;}
.v19-carousel-next{right:18px;}
.v19-carousel-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-top:14px;
  color:#365951;
  font-size:15px;
  font-weight:850;
}
.v19-carousel-caption{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:#edf4ee;
  color:#0f4d3c;
}
.v19-carousel-count{color:#687c73;font-weight:750;}

/* Intro hero: full image remains visible; only text-side overlay is applied. */
.page-intro-v12 .story-hero-intro::before{
  opacity:1 !important;
  transform:none !important;
  filter:none !important;
  background:url('../assets/story-forest-hero.jpg') center center / cover no-repeat !important;
}
.page-intro-v12 .story-hero-intro::after{
  inset:0 auto 0 0 !important;
  width:min(880px,64vw) !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.98) 0%,
    rgba(247,245,239,.92) 42%,
    rgba(247,245,239,.64) 74%,
    rgba(247,245,239,0) 100%) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy{
  text-shadow:0 1px 0 rgba(255,255,255,.38);
}
.story-promise-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:16px;
  background:#edf4ee;
  color:#0f4d3c;
  margin-bottom:18px;
}
.story-promise-icon svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.story-promise-grid .story-number{margin-bottom:14px;}

@media (max-width:900px){
  .page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure,
  .page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure:first-child{
    height:360px !important;
  }
  .v19-carousel-btn{width:46px;height:46px;font-size:30px;}
  .v19-carousel-prev{left:12px;}
  .v19-carousel-next{right:12px;}
  .page-intro-v12 .story-hero-intro::after{
    width:100% !important;
    background:linear-gradient(180deg,
      rgba(247,245,239,.98) 0%,
      rgba(247,245,239,.90) 48%,
      rgba(247,245,239,.46) 82%,
      rgba(247,245,239,.14) 100%) !important;
  }
}
@media (max-width:640px){
  .page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure,
  .page-facility-v9 .v19-retreat-carousel .v9-photo-rail figure:first-child{
    height:300px !important;
  }
  .v19-carousel-footer{font-size:14px;}
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v20 KRDS-informed single item carousel
   Scope: one large slide is visible at a time; navigation controls are
   placed in a separate, consistent control area to avoid covering images.
------------------------------------------------------------------- */
.page-facility-v9 .v20-single-carousel{
  width:100%;
  max-width:1120px;
}
.page-facility-v9 .v20-single-carousel .v9-photo-rail{
  position:relative;
  min-height:clamp(500px, 48vw, 720px);
  border:1px solid rgba(18,59,51,.10);
  border-radius:34px;
  background:#edf4ee;
  box-shadow:0 26px 72px rgba(17,59,46,.16);
}
.page-facility-v9 .v20-single-carousel .v9-photo-rail figure,
.page-facility-v9 .v20-single-carousel .v9-photo-rail figure:first-child{
  height:clamp(500px, 48vw, 720px) !important;
  border-radius:34px !important;
}
.page-facility-v9 .v20-single-carousel .v9-photo-rail img{
  object-fit:cover !important;
  object-position:center center !important;
}
.page-facility-v9 .v20-single-carousel .v9-photo-rail span{
  top:22px !important;
  left:22px !important;
  height:42px !important;
  min-width:68px !important;
  padding:0 18px !important;
  color:#fff !important;
  background:rgba(13,77,60,.92) !important;
  box-shadow:0 10px 24px rgba(4,39,27,.18);
}
.page-facility-v9 .v20-carousel-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-top:16px;
  padding:14px 16px;
  border:1px solid rgba(18,59,51,.10);
  border-radius:999px;
  background:rgba(255,253,248,.94);
  box-shadow:0 16px 42px rgba(17,59,46,.08);
}
.v20-carousel-status,
.v20-carousel-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.page-facility-v9 .v20-carousel-controls .v19-carousel-caption{
  min-height:40px;
  padding:0 18px;
  background:#edf4ee;
  color:#0f4d3c;
}
.page-facility-v9 .v20-carousel-controls .v19-carousel-count{
  min-width:54px;
  text-align:center;
  color:#516b62;
  font-weight:850;
}
.page-facility-v9 .v20-carousel-controls .v19-carousel-btn{
  position:static !important;
  transform:none !important;
  width:auto;
  min-width:82px;
  height:44px;
  padding:0 18px;
  border:1px solid rgba(18,59,51,.16);
  border-radius:999px;
  background:#fffdf8;
  color:#123b33;
  font-size:15px;
  font-weight:900;
  line-height:1;
  box-shadow:none;
}
.page-facility-v9 .v20-carousel-controls .v19-carousel-btn:hover{
  background:#edf4ee;
  box-shadow:0 10px 24px rgba(0,40,27,.10);
}
.page-facility-v9 .v20-carousel-controls .v19-carousel-btn:active{
  transform:scale(.98) !important;
}
.page-facility-v9 .v20-carousel-controls .v20-carousel-toggle[aria-pressed="true"]{
  background:#0b5b45;
  border-color:#0b5b45;
  color:#fff;
}

@media (max-width:900px){
  .page-facility-v9 .v20-single-carousel .v9-photo-rail,
  .page-facility-v9 .v20-single-carousel .v9-photo-rail figure,
  .page-facility-v9 .v20-single-carousel .v9-photo-rail figure:first-child{
    min-height:420px;
    height:420px !important;
  }
  .page-facility-v9 .v20-carousel-controls{
    align-items:flex-start;
    border-radius:26px;
  }
}
@media (max-width:640px){
  .page-facility-v9 .v20-single-carousel .v9-photo-rail,
  .page-facility-v9 .v20-single-carousel .v9-photo-rail figure,
  .page-facility-v9 .v20-single-carousel .v9-photo-rail figure:first-child{
    min-height:320px;
    height:320px !important;
    border-radius:24px !important;
  }
  .page-facility-v9 .v20-carousel-controls{
    flex-direction:column;
    align-items:stretch;
  }
  .v20-carousel-status,
  .v20-carousel-actions{
    justify-content:space-between;
  }
  .page-facility-v9 .v20-carousel-controls .v19-carousel-btn{
    min-width:0;
    flex:1 1 auto;
    padding:0 12px;
  }
}


/* ------------------------------------------------------------------
   Hansalim NC Reservation – v21 hero readability and page image mapping
   Scope: use user-provided hero images for HOME/FLOOR/INTRO; keep photos
   clear while applying a text-side readability gradient only.
------------------------------------------------------------------- */
:root{
  --v21-hero-overlay-solid: rgba(247,245,239,.985);
  --v21-hero-overlay-soft: rgba(247,245,239,.78);
  --v21-hero-overlay-fade: rgba(247,245,239,0);
}

/* HOME: apply the provided exterior hero as a full background so the image
   no longer cuts through the text area. The building stays visually present
   while the left text side remains readable. */
.page-home-v9 .v9-home-hero{
  min-height:clamp(560px, 56vw, 820px) !important;
  background:#edf3ee !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media{
  background:url('intro-hero-v21.png') center center / cover no-repeat !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media img{display:none !important;}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  display:block !important;
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.99) 0%,
      rgba(247,245,239,.96) 20%,
      rgba(247,245,239,.78) 40%,
      rgba(247,245,239,.32) 58%,
      rgba(247,245,239,.06) 74%,
      rgba(247,245,239,0) 100%) !important;
}
.page-home-v9 .v9-home-hero .container.v9-hero-content{
  padding:clamp(108px, 10vw, 164px) 0 !important;
}
.page-home-v9 .v9-home-hero .v9-hero-content > *{
  max-width:650px !important;
}
.page-home-v9 .v9-home-hero h1,
.page-home-v9 .v9-hero-lead,
.page-home-v9 .v9-kicker{
  text-shadow:0 1px 0 rgba(255,255,255,.45) !important;
}

/* FLOOR: use the supplied mountain/forest photo as a full hero background.
   The image itself stays clear; the readable area is limited to the left. */
.page-facility-v9 .v17-facility-hero-bg{
  min-height:clamp(520px, 44vw, 700px) !important;
  background:#edf3ee !important;
}
.page-facility-v9 .v17-facility-hero-bg::before{
  background:url('floor-hero-v21.png') center center / cover no-repeat !important;
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
}
.page-facility-v9 .v17-facility-hero-bg::after{
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:min(880px,64vw) !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.99) 0%,
    rgba(247,245,239,.95) 36%,
    rgba(247,245,239,.72) 66%,
    rgba(247,245,239,.22) 88%,
    rgba(247,245,239,0) 100%) !important;
}
.page-facility-v9 .v17-facility-hero-bg .v9-sub-hero-grid{
  padding:clamp(92px,8vw,146px) 0 !important;
}
.page-facility-v9 .v17-facility-hero-bg .v9-sub-hero-grid > div{
  max-width:760px !important;
}
.page-facility-v9 .v17-facility-hero-bg h1,
.page-facility-v9 .v17-facility-hero-bg p:not(.v9-kicker){
  text-shadow:0 1px 0 rgba(255,255,255,.45) !important;
}

/* INTRO: use the supplied building hero, separate from the HOME crop but in
   the same visual language. Only the text-side gradient is applied. */
.page-intro-v12 .story-hero-intro{
  min-height:clamp(540px, 46vw, 720px) !important;
  background:#edf3ee !important;
}
.page-intro-v12 .story-hero-intro::before{
  background:url('intro-hero-v21.png') center center / cover no-repeat !important;
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
}
.page-intro-v12 .story-hero-intro::after{
  content:"" !important;
  position:absolute !important;
  inset:0 auto 0 0 !important;
  width:min(900px,64vw) !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.99) 0%,
    rgba(247,245,239,.96) 34%,
    rgba(247,245,239,.76) 64%,
    rgba(247,245,239,.26) 88%,
    rgba(247,245,239,0) 100%) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy{
  max-width:760px !important;
  text-shadow:0 1px 0 rgba(255,255,255,.48) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy h1{
  max-width:730px !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy p{
  max-width:620px !important;
  font-weight:800 !important;
}

/* Keep the single-item carousel stable after the hero changes. */
.page-facility-v9 .v20-single-carousel .v9-photo-rail img{
  object-fit:cover !important;
  object-position:center center !important;
}

@media (max-width:900px){
  .page-home-v9 .v9-home-hero .v9-hero-media,
  .page-intro-v12 .story-hero-intro::before{
    background-position:64% center !important;
  }
  .page-facility-v9 .v17-facility-hero-bg::before{
    background-position:center center !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media::after,
  .page-facility-v9 .v17-facility-hero-bg::after,
  .page-intro-v12 .story-hero-intro::after{
    width:100% !important;
    background:linear-gradient(180deg,
      rgba(247,245,239,.99) 0%,
      rgba(247,245,239,.92) 46%,
      rgba(247,245,239,.50) 76%,
      rgba(247,245,239,.18) 100%) !important;
  }
  .page-home-v9 .v9-home-hero{
    min-height:auto !important;
    padding:72px 0 250px !important;
  }
  .page-intro-v12 .story-hero-intro,
  .page-facility-v9 .v17-facility-hero-bg{
    min-height:auto !important;
  }
  .page-intro-v12 .story-hero-intro{padding:74px 0 170px !important;}
  .page-facility-v9 .v17-facility-hero-bg .v9-sub-hero-grid{padding:72px 0 170px !important;}
}

@media (max-width:640px){
  .page-home-v9 .v9-home-hero h1,
  .page-intro-v12 .story-hero-intro .story-hero-copy h1,
  .page-facility-v9 .v17-facility-hero-bg h1{
    font-size:clamp(38px,10vw,50px) !important;
  }
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v22 hero scale + natural overlay +
   unified brand subtitle
   Scope: slightly reduce perceived building zoom on HOME / INTRO,
   soften the text-side gradient, and standardize brand subtitle markup.
------------------------------------------------------------------- */
.site-header .brand-subtitle{
  display:block !important;
  font-size:12px !important;
  color:var(--hs-muted) !important;
  font-weight:700 !important;
  letter-spacing:-.01em !important;
  margin-top:3px !important;
}

.page-home-v9 .v9-home-hero .v9-hero-media{
  background-image:url('intro-hero-v21.png') !important;
  background-repeat:no-repeat !important;
  background-position:right center !important;
  background-size:clamp(1100px, 88vw, 1680px) auto !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.985) 0%,
      rgba(247,245,239,.965) 18%,
      rgba(247,245,239,.885) 36%,
      rgba(247,245,239,.66) 54%,
      rgba(247,245,239,.28) 72%,
      rgba(247,245,239,.08) 86%,
      rgba(247,245,239,0) 100%) !important;
}

.page-intro-v12 .story-hero-intro{
  min-height:clamp(520px, 43vw, 690px) !important;
}
.page-intro-v12 .story-hero-intro::before{
  background-image:url('intro-hero-v21.png') !important;
  background-repeat:no-repeat !important;
  background-position:right center !important;
  background-size:clamp(1100px, 88vw, 1680px) auto !important;
}
.page-intro-v12 .story-hero-intro::after{
  width:min(960px, 67vw) !important;
  background:
    linear-gradient(90deg,
      rgba(247,245,239,.985) 0%,
      rgba(247,245,239,.965) 16%,
      rgba(247,245,239,.90) 34%,
      rgba(247,245,239,.72) 52%,
      rgba(247,245,239,.38) 70%,
      rgba(247,245,239,.12) 84%,
      rgba(247,245,239,0) 100%),
    linear-gradient(180deg,
      rgba(255,255,255,.08) 0%,
      rgba(255,255,255,.02) 38%,
      rgba(0,0,0,.03) 100%) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy{
  max-width:780px !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy p{
  max-width:640px !important;
}

@media (max-width:900px){
  .page-home-v9 .v9-home-hero .v9-hero-media,
  .page-intro-v12 .story-hero-intro::before{
    background-size:cover !important;
    background-position:72% center !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media::after,
  .page-intro-v12 .story-hero-intro::after{
    width:100% !important;
    background:linear-gradient(180deg,
      rgba(247,245,239,.99) 0%,
      rgba(247,245,239,.93) 42%,
      rgba(247,245,239,.62) 72%,
      rgba(247,245,239,.18) 100%) !important;
  }
}

/* ------------------------------------------------------------------
   Hansalim NC Reservation – v23 home hero restoration + intro hero
   alignment + unified brand subtitle
   Scope: restore HOME to the existing new hero asset, make INTRO follow
   the same full-background hero standard, and keep header subtitle unified.
------------------------------------------------------------------- */
.site-header .brand-subtitle{
  display:block !important;
  font-size:12px !important;
  color:var(--hs-muted) !important;
  font-weight:700 !important;
  letter-spacing:-.01em !important;
  margin-top:3px !important;
}

/* HOME: use the existing new hero asset as-is. */
.page-home-v9 .v9-home-hero{
  min-height:clamp(560px, 56vw, 820px) !important;
  background:#edf3ee !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media{
  background-image:url('new-hero-wide.png') !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:cover !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media img{
  display:none !important;
}
.page-home-v9 .v9-home-hero .v9-hero-media::after{
  display:block !important;
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.985) 0%,
    rgba(247,245,239,.94) 24%,
    rgba(247,245,239,.70) 48%,
    rgba(247,245,239,.28) 68%,
    rgba(247,245,239,.06) 86%,
    rgba(247,245,239,0) 100%) !important;
}

/* INTRO: align with the HOME hero standard while keeping the intro image. */
.page-intro-v12 .story-hero-intro{
  position:relative !important;
  min-height:clamp(560px, 56vw, 760px) !important;
  display:flex !important;
  align-items:center !important;
  overflow:hidden !important;
  background:#edf3ee !important;
}
.page-intro-v12 .story-hero-intro::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background-image:url('intro-hero-v21.png') !important;
  background-repeat:no-repeat !important;
  background-position:right center !important;
  background-size:cover !important;
  opacity:1 !important;
  filter:none !important;
  transform:none !important;
}
.page-intro-v12 .story-hero-intro::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  width:auto !important;
  background:linear-gradient(90deg,
    rgba(247,245,239,.985) 0%,
    rgba(247,245,239,.95) 22%,
    rgba(247,245,239,.76) 44%,
    rgba(247,245,239,.36) 66%,
    rgba(247,245,239,.10) 84%,
    rgba(247,245,239,0) 100%) !important;
}
.page-intro-v12 .story-hero-intro .container,
.page-intro-v12 .story-hero-intro .story-hero-grid,
.page-intro-v12 .story-hero-intro .story-hero-copy{
  position:relative !important;
  z-index:1 !important;
}
.page-intro-v12 .story-hero-intro .story-hero-grid{
  display:block !important;
  max-width:var(--max) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy{
  max-width:760px !important;
  text-shadow:0 1px 0 rgba(255,255,255,.45) !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy h1{
  max-width:730px !important;
  word-break:keep-all !important;
  overflow-wrap:normal !important;
}
.page-intro-v12 .story-hero-intro .story-hero-copy p{
  max-width:620px !important;
  font-weight:800 !important;
}
.page-intro-v12 .story-hero-intro .story-hero-image{
  display:none !important;
}

@media (max-width:900px){
  .page-home-v9 .v9-home-hero .v9-hero-media,
  .page-intro-v12 .story-hero-intro::before{
    background-size:cover !important;
    background-position:68% center !important;
  }
  .page-home-v9 .v9-home-hero .v9-hero-media::after,
  .page-intro-v12 .story-hero-intro::after{
    background:linear-gradient(180deg,
      rgba(247,245,239,.99) 0%,
      rgba(247,245,239,.94) 44%,
      rgba(247,245,239,.62) 74%,
      rgba(247,245,239,.18) 100%) !important;
  }
  .page-home-v9 .v9-home-hero,
  .page-intro-v12 .story-hero-intro{
    min-height:auto !important;
  }
  .page-home-v9 .v9-home-hero{
    padding:72px 0 250px !important;
  }
  .page-intro-v12 .story-hero-intro{
    padding:74px 0 170px !important;
  }
}

/* ------------------------------------------------------------------
   v25 mobile navigation + production log visibility
   - Mobile menu stays closed by default and toggles only with header state.
   - Development log panels are hidden in production pages.
------------------------------------------------------------------- */
#log,
.log-box,
.dev-log-card,
.production-hidden-log{
  display:none !important;
}

@media (max-width:920px){
  .site-header .nav{
    flex-wrap:wrap !important;
    align-items:center !important;
  }
  .site-header .nav-toggle{
    display:flex !important;
    margin-left:auto !important;
  }
  .site-header:not(.is-nav-open) .nav-links{
    display:none !important;
  }
  .site-header .nav-links{
    display:none !important;
    width:100% !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
    margin-top:10px !important;
    padding:12px !important;
    background:rgba(255,253,248,.98) !important;
    border:1px solid rgba(18,59,51,.10) !important;
    border-radius:24px !important;
    box-shadow:0 18px 42px rgba(17,59,46,.10) !important;
  }
  .site-header.is-nav-open .nav-links{
    display:flex !important;
  }
  .site-header .nav-links > a,
  .site-header .nav-links .mini-link-btn{
    width:100% !important;
    min-height:52px !important;
    height:52px !important;
    justify-content:center !important;
    border-radius:999px !important;
    background:#fffdf8 !important;
    border:1px solid rgba(18,59,51,.10) !important;
  }
  .site-header .nav-links > a.active,
  .site-header .nav-links > a[aria-current="page"]{
    background:rgba(15,104,79,.10) !important;
  }
  .site-header .nav-links > a.nav-cta,
  .site-header .nav-links > a[href$="reserve.html"],
  .site-header .nav-links > a[href="../pages/reserve.html"]{
    background:var(--hs-primary-dark) !important;
    color:#fff !important;
  }
  .site-header .top-auth-area,
  .site-header .auth-mini-actions{
    width:100% !important;
  }
  .site-header .auth-mini-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
}

@media (min-width:921px){
  .site-header .nav-links{
    display:flex !important;
  }
}

/* ------------------------------------------------------------------
   v26 mobile header overlay fix
   - The mobile menu no longer takes up document height.
   - Open menu appears as a floating drawer and can be hidden again with
     the hamburger/close button.
------------------------------------------------------------------- */
@media (max-width:920px){
  .site-header{
    position:sticky !important;
    top:0 !important;
    z-index:3000 !important;
  }
  .site-header .nav{
    flex-wrap:nowrap !important;
    min-height:78px !important;
    padding:12px 0 !important;
    align-items:center !important;
  }
  .site-header .brand{
    min-width:0 !important;
    flex:1 1 auto !important;
  }
  .site-header .brand-text{
    min-width:0 !important;
  }
  .site-header .nav-toggle{
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    border-radius:18px !important;
    z-index:3003 !important;
  }
  .site-header .nav-links{
    position:fixed !important;
    top:calc(84px + env(safe-area-inset-top, 0px)) !important;
    left:14px !important;
    right:14px !important;
    width:auto !important;
    max-height:calc(100dvh - 108px - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;
    margin:0 !important;
    padding:14px !important;
    border-radius:26px !important;
    background:rgba(255,253,248,.985) !important;
    border:1px solid rgba(18,59,51,.12) !important;
    box-shadow:0 24px 60px rgba(10,47,37,.18) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateY(-8px) scale(.985) !important;
    transition:opacity .18s ease, transform .18s ease, visibility .18s ease !important;
    z-index:3002 !important;
  }
  .site-header:not(.is-nav-open) .nav-links{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
  }
  .site-header.is-nav-open .nav-links{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateY(0) scale(1) !important;
  }
  .site-header .nav-links > a,
  .site-header .nav-links .mini-link-btn{
    width:100% !important;
    min-height:48px !important;
    height:48px !important;
    justify-content:center !important;
  }
  .site-header .auth-mini-actions{
    grid-template-columns:1fr !important;
  }
  .site-header.is-nav-open::after{
    content:"";
    position:fixed;
    inset:0;
    top:84px;
    background:rgba(18,59,51,.08);
    backdrop-filter:blur(2px);
    z-index:3001;
    pointer-events:none;
  }
}

@media (max-width:480px){
  .site-header .nav{min-height:72px !important;}
  .site-header .brand-logo,.site-header .brand-mark{width:44px !important;height:44px !important;}
  .site-header .brand-title{font-size:18px !important;}
  .site-header .brand-subtitle{display:block !important;font-size:11px !important;}
  .site-header .nav-links{top:calc(78px + env(safe-area-inset-top, 0px)) !important;max-height:calc(100dvh - 102px - env(safe-area-inset-bottom, 0px)) !important;}
  .site-header.is-nav-open::after{top:78px;}
}

/* ------------------------------------------------------------------
   v27 mobile header drawer correction
   - Navigation is hidden by default on mobile.
   - Menu appears only after tapping the hamburger button.
   - It opens as a side drawer instead of occupying the top of the page.
------------------------------------------------------------------- */
@media (max-width:920px){
  body.hs-mobile-menu-open{
    overflow:hidden !important;
  }

  .site-header{
    position:sticky !important;
    top:0 !important;
    z-index:5000 !important;
    background:rgba(255,253,248,.97) !important;
  }

  .site-header .nav{
    flex-wrap:nowrap !important;
    min-height:72px !important;
    padding:10px 0 !important;
    align-items:center !important;
  }

  .site-header .brand{
    flex:1 1 auto !important;
    min-width:0 !important;
  }

  .site-header .nav-toggle{
    display:flex !important;
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    margin-left:auto !important;
    border-radius:18px !important;
    z-index:5004 !important;
  }

  .site-header .nav-links{
    display:flex !important;
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(86vw, 380px) !important;
    height:100dvh !important;
    max-height:none !important;
    overflow-y:auto !important;
    overscroll-behavior:contain !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
    margin:0 !important;
    padding:calc(86px + env(safe-area-inset-top, 0px)) 18px calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    border-radius:28px 0 0 28px !important;
    background:rgba(255,253,248,.99) !important;
    border:1px solid rgba(18,59,51,.12) !important;
    box-shadow:-24px 0 64px rgba(10,47,37,.20) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(106%) !important;
    transition:opacity .2s ease, transform .22s ease, visibility .2s ease !important;
    z-index:5003 !important;
  }

  .site-header:not(.is-nav-open) .nav-links,
  .site-header .nav-links:not(.is-open){
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(106%) !important;
  }

  .site-header.is-nav-open .nav-links.is-open{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(0) !important;
  }

  .site-header .nav-links > a,
  .site-header .nav-links .mini-link-btn{
    width:100% !important;
    min-height:50px !important;
    height:50px !important;
    justify-content:center !important;
    border-radius:999px !important;
    background:#fffdf8 !important;
    border:1px solid rgba(18,59,51,.10) !important;
    color:var(--hs-text) !important;
  }

  .site-header .nav-links > a.nav-cta,
  .site-header .nav-links > a[href$="reserve.html"],
  .site-header .nav-links > a[href="../pages/reserve.html"]{
    background:var(--hs-primary-dark) !important;
    color:#fff !important;
  }

  .site-header .auth-mini-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }

  .site-header.is-nav-open::after{
    content:"" !important;
    position:fixed !important;
    inset:0 !important;
    background:rgba(18,59,51,.10) !important;
    backdrop-filter:blur(2px) !important;
    z-index:5002 !important;
    pointer-events:none !important;
  }
}

@media (max-width:480px){
  .site-header .nav{
    min-height:68px !important;
  }
  .site-header .nav-links{
    width:min(92vw, 380px) !important;
    padding-top:calc(82px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* v29 refund preview */
.refund-preview {
  margin: 14px 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(233, 241, 230, 0.78);
  border: 1px solid rgba(31, 61, 49, 0.12);
}
.refund-preview dl {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 8px 14px;
  margin: 0;
}
.refund-preview dt {
  color: rgba(31, 61, 49, 0.72);
  font-weight: 800;
}
.refund-preview dd {
  margin: 0;
  color: #0b3d31;
  font-weight: 800;
}
@media (max-width: 640px) {
  .refund-preview dl { grid-template-columns: 1fr; gap: 4px; }
}

/* v29 policy table */
.policy-table-wrap {
  overflow-x: auto;
  border-radius: 20px;
  border: 1px solid rgba(31, 61, 49, 0.12);
  background: #fff;
}
.policy-table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
}
.policy-table th,
.policy-table td {
  padding: 16px 18px;
  border-bottom: 1px solid rgba(31, 61, 49, 0.1);
  text-align: left;
  vertical-align: top;
}
.policy-table th {
  color: #0b3d31;
  background: rgba(233, 241, 230, 0.8);
  font-weight: 900;
}
.policy-table tr:last-child td { border-bottom: 0; }
.policy-note {
  margin-top: 12px;
  color: rgba(31, 61, 49, 0.72);
  font-size: 0.95rem;
}
.policy-list.ordered {
  list-style: decimal;
  padding-left: 1.25rem;
}
.policy-list.ordered li + li { margin-top: 8px; }


/* v30 unified footer */
.hs-unified-footer .footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: start;
}
.hs-unified-footer .footer-business-lines {
  line-height: 1.8;
  word-break: keep-all;
}
.hs-unified-footer .footer-policy-links {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}
.hs-unified-footer .footer-policy-links a {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22);
  color: rgba(255,255,255,.88);
  font-size: 13px;
  font-weight: 850;
  background: rgba(255,255,255,.05);
}
.hs-unified-footer .footer-policy-links a:hover {
  background: rgba(255,255,255,.12);
  color: #fff;
}
@media (max-width: 720px) {
  .hs-unified-footer .footer-grid {
    grid-template-columns: 1fr;
  }
  .hs-unified-footer .footer-policy-links {
    justify-content: flex-start;
  }
}

/* v34: reserve/change calendars are limited to the configured reservation window. */
.reserve-day.out-of-window,
.reserve-day:disabled{
  opacity:.42 !important;
  cursor:not-allowed !important;
  background:#f4f5f2 !important;
  color:#8b948d !important;
  box-shadow:none !important;
  transform:none !important;
}
.reserve-day.out-of-window:hover,
.reserve-day:disabled:hover{
  transform:none !important;
  border-color:rgba(18,59,51,.10) !important;
  box-shadow:none !important;
}
.reserve-calendar-controls .btn:disabled,
.calendar-nav .secondary:disabled{
  opacity:.42 !important;
  cursor:not-allowed !important;
  pointer-events:none !important;
}
.day.out-of-window,
.day:disabled{
  opacity:.42 !important;
  cursor:not-allowed !important;
  background:#f4f5f2 !important;
  color:#8b948d !important;
}
.day.out-of-window:hover,
.day:disabled:hover{
  transform:none !important;
}

/* ------------------------------------------------------------------
   v35: Reserve calendar readability and sizing refinement
   - Reserve page calendar now follows the change-calendar interaction pattern:
     month status message, one selected date detail area, and clearer event tags.
   - Mobile uses horizontal calendar scroll to keep text legible.
------------------------------------------------------------------- */
.reserve-dashboard-page .reserve-calendar-card{
  padding:clamp(22px,3vw,38px) !important;
  border-radius:30px !important;
}
.reserve-calendar-head{
  align-items:center !important;
}
.reserve-calendar-head > div:first-child{
  max-width:760px !important;
}
.reserve-calendar-head h2{
  line-height:1.12 !important;
  letter-spacing:-.035em !important;
}
.reserve-calendar-controls{
  gap:12px !important;
}
.reserve-calendar-controls .btn{
  min-height:44px !important;
  padding:0 18px !important;
}
.reserve-calendar-controls strong{
  min-width:132px !important;
  font-size:21px !important;
}
.reserve-calendar-state{
  margin:14px 0 14px !important;
  padding:13px 16px !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:16px !important;
  background:#fffdf8 !important;
  color:#66736b !important;
  font-size:15px !important;
  font-weight:800 !important;
  line-height:1.55 !important;
}
.reserve-calendar-scroll{
  width:100% !important;
  max-width:100% !important;
  overflow-x:visible !important;
  padding-bottom:2px !important;
}
.reserve-calendar-weekdays{
  gap:10px !important;
  margin:0 0 10px !important;
  font-size:15px !important;
}
.reserve-calendar-grid{
  gap:10px !important;
}
.reserve-day{
  min-height:138px !important;
  border-radius:20px !important;
  padding:12px !important;
  gap:7px !important;
}
.reserve-day strong{
  font-size:18px !important;
  line-height:1 !important;
}
.reserve-tag{
  min-height:24px !important;
  padding:5px 8px !important;
  border-radius:10px !important;
  font-size:12px !important;
  line-height:1.25 !important;
  letter-spacing:-.02em !important;
}
.reserve-day-detail{
  margin-top:20px !important;
  border-radius:22px !important;
  padding:20px 22px !important;
}
.reserve-day-detail h3{
  font-size:20px !important;
  margin-bottom:12px !important;
}
.reserve-day-detail ul{
  gap:10px !important;
}
.reserve-day-detail li{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:10px 12px !important;
  border-radius:14px !important;
  background:#f8faf7 !important;
}
.reserve-day-detail li > span:nth-child(2){
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.reserve-day-detail small{
  color:#718077 !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

@media (max-width:980px){
  .reserve-calendar-head{
    align-items:stretch !important;
  }
  .reserve-calendar-controls{
    justify-content:space-between !important;
    width:100% !important;
  }
}
@media (max-width:760px){
  .reserve-dashboard-page .reserve-calendar-card{
    padding:18px !important;
    overflow:visible !important;
  }
  .reserve-calendar-head h2{
    font-size:30px !important;
  }
  .reserve-calendar-head p{
    font-size:15px !important;
    line-height:1.6 !important;
  }
  .reserve-calendar-controls{
    display:grid !important;
    grid-template-columns:1fr auto 1fr !important;
    gap:8px !important;
  }
  .reserve-calendar-controls .btn{
    min-width:0 !important;
    padding:0 12px !important;
    font-size:14px !important;
  }
  .reserve-calendar-controls strong{
    min-width:96px !important;
    font-size:17px !important;
  }
  .reserve-calendar-scroll{
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding:0 0 12px !important;
  }
  .reserve-calendar-scroll::-webkit-scrollbar{
    height:8px !important;
  }
  .reserve-calendar-scroll::-webkit-scrollbar-thumb{
    background:rgba(18,59,51,.22) !important;
    border-radius:999px !important;
  }
  .reserve-calendar-weekdays,
  .reserve-calendar-grid{
    min-width:760px !important;
    gap:8px !important;
  }
  .reserve-calendar-weekdays{
    font-size:14px !important;
  }
  .reserve-day{
    min-height:112px !important;
    padding:10px !important;
    border-radius:16px !important;
  }
  .reserve-day strong{
    font-size:17px !important;
  }
  .reserve-tag{
    font-size:11.5px !important;
    padding:5px 7px !important;
  }
  .reserve-day-detail li{
    grid-template-columns:auto minmax(0,1fr) !important;
  }
  .reserve-day-detail small{
    grid-column:2 / -1 !important;
    white-space:normal !important;
  }
}
@media (max-width:420px){
  .reserve-calendar-weekdays,
  .reserve-calendar-grid{
    min-width:700px !important;
  }
  .reserve-day{
    min-height:104px !important;
  }
}

/* ------------------------------------------------------------------
   v36: Reservation form calendar picker
   - Reservation form now includes a change-page-style monthly calendar.
   - Past days are visually disabled for booking but still expose booking details.
------------------------------------------------------------------- */
.reservation-calendar-panel{
  margin:8px 0 4px !important;
  padding:clamp(20px,2.8vw,32px) !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:28px !important;
  background:#fffdf8 !important;
  box-shadow:0 14px 34px rgba(0,40,27,.05) !important;
}
.booking-calendar-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
  gap:22px !important;
  margin-bottom:16px !important;
}
.booking-calendar-head h3{
  margin:10px 0 8px !important;
  color:var(--hs-text) !important;
  font-size:clamp(26px,2.8vw,38px) !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
  line-height:1.12 !important;
}
.booking-calendar-head p{
  margin:0 !important;
  color:var(--hs-muted) !important;
  font-size:16px !important;
  line-height:1.65 !important;
  font-weight:700 !important;
}
.booking-calendar-controls{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  white-space:nowrap !important;
}
.booking-calendar-controls .btn{
  min-height:42px !important;
  padding:0 16px !important;
}
.booking-calendar-controls strong{
  display:inline-flex !important;
  justify-content:center !important;
  min-width:126px !important;
  color:var(--hs-text) !important;
  font-size:20px !important;
  font-weight:950 !important;
}
.booking-calendar-legend{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  margin:6px 0 14px !important;
  color:var(--hs-muted) !important;
  font-size:14px !important;
  font-weight:850 !important;
}
.booking-calendar-legend span{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:34px !important;
  padding:0 12px !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:999px !important;
  background:#fff !important;
}
.legend-dot.disabled{background:#b9c1bb !important;}
.booking-calendar-state{
  margin:0 0 14px !important;
  padding:13px 16px !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:16px !important;
  background:#fff !important;
  color:#66736b !important;
  font-size:15px !important;
  font-weight:800 !important;
  line-height:1.55 !important;
}
.booking-calendar-scroll{
  width:100% !important;
  max-width:100% !important;
  overflow-x:visible !important;
}
.booking-calendar-weekdays,
.booking-calendar-grid{
  display:grid !important;
  grid-template-columns:repeat(7,1fr) !important;
  gap:10px !important;
}
.booking-calendar-weekdays{
  margin:0 0 10px !important;
  text-align:center !important;
  color:var(--hs-muted) !important;
  font-size:15px !important;
  font-weight:900 !important;
}
.booking-day{
  min-height:132px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:7px !important;
  padding:12px !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:20px !important;
  background:#fff !important;
  color:var(--hs-text) !important;
  box-shadow:0 4px 12px rgba(0,40,27,.025) !important;
  text-align:left !important;
  cursor:pointer !important;
  transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease !important;
}
.booking-day:hover{
  transform:translateY(-1px) !important;
  border-color:rgba(15,104,79,.34) !important;
  box-shadow:0 10px 20px rgba(0,40,27,.06) !important;
}
.booking-day.empty{
  background:rgba(255,255,255,.36) !important;
  box-shadow:none !important;
  cursor:default !important;
}
.booking-day.out{opacity:.58 !important;}
.booking-day.out-of-window{
  background:#f2f4f1 !important;
  color:#8b948e !important;
  cursor:pointer !important;
}
.booking-day.has-booking{
  background:linear-gradient(180deg,#fff6d6,#fff9e8) !important;
  border-color:#e0c867 !important;
}
.booking-day.has-any-booking:not(.has-booking){
  background:#f8fbf8 !important;
  border-color:rgba(18,59,51,.14) !important;
}
.booking-day.selected{
  border-color:var(--hs-primary) !important;
  box-shadow:0 0 0 3px rgba(15,104,79,.18),0 10px 24px rgba(0,40,27,.08) !important;
}
.booking-day .day-num{
  font-size:18px !important;
  font-weight:950 !important;
  line-height:1 !important;
}
.booking-day .tag{
  min-height:24px !important;
  padding:5px 8px !important;
  border-radius:10px !important;
  font-size:12px !important;
  line-height:1.25 !important;
  letter-spacing:-.02em !important;
  white-space:nowrap !important;
}
.booking-day .tag.dorm{background:#f4ead9 !important;color:#745020 !important;}
.booking-calendar-loading,
.booking-calendar-error{
  grid-column:1/-1 !important;
  padding:28px !important;
  border-radius:18px !important;
  background:#fff !important;
  color:var(--hs-muted) !important;
}
.booking-calendar-error{color:var(--hs-danger) !important;background:var(--hs-danger-soft) !important;}
.booking-day-detail{
  margin-top:20px !important;
  border:1px solid rgba(18,59,51,.10) !important;
  border-radius:22px !important;
  background:#fff !important;
  padding:20px 22px !important;
}
.booking-day-detail h3{
  margin:0 0 12px !important;
  color:var(--hs-text) !important;
  font-size:20px !important;
  font-weight:950 !important;
}
.booking-day-detail p{margin:0;color:var(--hs-muted);font-weight:750;line-height:1.6;}
.booking-day-detail ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;}
.booking-day-detail li{
  display:grid !important;
  grid-template-columns:auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:10px 12px !important;
  border-radius:14px !important;
  background:#f8faf7 !important;
  color:var(--hs-text) !important;
  font-weight:850 !important;
}
.booking-day-detail li > span:nth-child(2){
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.booking-day-detail small{color:#718077 !important;font-weight:800 !important;white-space:nowrap !important;}

@media (max-width:980px){
  .booking-calendar-head{flex-direction:column !important;}
  .booking-calendar-controls{width:100% !important;justify-content:space-between !important;}
}
@media (max-width:760px){
  .reservation-calendar-panel{padding:18px !important;}
  .booking-calendar-head h3{font-size:28px !important;}
  .booking-calendar-head p{font-size:15px !important;}
  .booking-calendar-controls{display:grid !important;grid-template-columns:1fr auto 1fr !important;gap:8px !important;}
  .booking-calendar-controls .btn{min-width:0 !important;padding:0 12px !important;font-size:14px !important;}
  .booking-calendar-controls strong{min-width:96px !important;font-size:17px !important;}
  .booking-calendar-scroll{overflow-x:auto !important;-webkit-overflow-scrolling:touch !important;padding-bottom:12px !important;}
  .booking-calendar-scroll::-webkit-scrollbar{height:8px !important;}
  .booking-calendar-scroll::-webkit-scrollbar-thumb{background:rgba(18,59,51,.22) !important;border-radius:999px !important;}
  .booking-calendar-weekdays,
  .booking-calendar-grid{min-width:760px !important;gap:8px !important;}
  .booking-day{min-height:112px !important;padding:10px !important;border-radius:16px !important;}
  .booking-day .day-num{font-size:17px !important;}
  .booking-day .tag{font-size:11.5px !important;padding:5px 7px !important;}
  .booking-day-detail li{grid-template-columns:auto minmax(0,1fr) !important;}
  .booking-day-detail small{grid-column:2 / -1 !important;white-space:normal !important;}
}
@media (max-width:420px){
  .booking-calendar-weekdays,
  .booking-calendar-grid{min-width:700px !important;}
  .booking-day{min-height:104px !important;}
}

/* ------------------------------------------------------------------
   v37: Reservation page scheduling-flow redesign
   - WhatTime-style flow: calendar focus + selected schedule side panel.
   - Prevent calendar text from forcing horizontal overflow on desktop.
------------------------------------------------------------------- */
.reservation-step-layout{
  display:grid !important;
  grid-template-columns:minmax(0, 1.45fr) minmax(320px, .75fr) !important;
  gap:22px !important;
  align-items:start !important;
  margin:4px 0 6px !important;
}
.reservation-step-calendar,
.reservation-step-side{
  min-width:0 !important;
}
.reservation-step-side{
  position:sticky !important;
  top:96px !important;
  display:grid !important;
  gap:16px !important;
  align-self:start !important;
}
.selection-summary-card{
  padding:22px 22px !important;
  border:1px solid rgba(18,59,51,.12) !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#ffffff 0%,#fbf8ef 100%) !important;
  box-shadow:0 12px 26px rgba(0,40,27,.055) !important;
}
.selection-summary-card .summary-eyebrow{
  display:inline-flex !important;
  align-items:center !important;
  min-height:30px !important;
  padding:0 12px !important;
  border-radius:999px !important;
  background:rgba(15,104,79,.09) !important;
  color:var(--hs-primary) !important;
  font-size:13px !important;
  font-weight:950 !important;
  margin-bottom:12px !important;
}
.selection-summary-card h3{
  margin:0 0 10px !important;
  color:var(--hs-text) !important;
  font-size:clamp(24px,2.4vw,32px) !important;
  line-height:1.16 !important;
  letter-spacing:-.04em !important;
  font-weight:950 !important;
}
.selection-summary-card p{
  margin:0 !important;
  color:var(--hs-muted) !important;
  font-size:15px !important;
  line-height:1.65 !important;
  font-weight:750 !important;
}
.selection-summary-card dl{
  margin:12px 0 0 !important;
  display:grid !important;
  gap:8px !important;
}
.selection-summary-card dl > div{
  display:grid !important;
  grid-template-columns:82px minmax(0,1fr) !important;
  gap:10px !important;
  align-items:start !important;
  padding:9px 0 !important;
  border-bottom:1px solid rgba(18,59,51,.08) !important;
}
.selection-summary-card dt{
  color:var(--hs-muted) !important;
  font-size:13px !important;
  font-weight:900 !important;
}
.selection-summary-card dd{
  margin:0 !important;
  color:var(--hs-text) !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1.45 !important;
  min-width:0 !important;
  overflow-wrap:anywhere !important;
}
.summary-hint{
  margin-top:14px !important;
  padding:12px 14px !important;
  border-radius:16px !important;
  background:rgba(237,246,241,.92) !important;
  color:#35554a !important;
  font-size:13px !important;
  line-height:1.55 !important;
  font-weight:800 !important;
}
.summary-hint.danger{
  background:var(--hs-danger-soft) !important;
  color:var(--hs-danger) !important;
}
.section-grid-side{
  grid-template-columns:1fr !important;
  gap:14px !important;
}
.reservation-step-side .dynamic-section{
  padding:22px !important;
  border:1px solid rgba(18,59,51,.12) !important;
  border-radius:24px !important;
  background:#fffdf8 !important;
  box-shadow:0 12px 26px rgba(0,40,27,.045) !important;
}
.reservation-calendar-panel{
  margin:0 !important;
  min-width:0 !important;
  overflow:hidden !important;
}
.booking-calendar-head{
  align-items:flex-start !important;
}
.booking-calendar-scroll{
  overflow-x:hidden !important;
  min-width:0 !important;
}
.booking-calendar-weekdays,
.booking-calendar-grid{
  grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  min-width:0 !important;
  width:100% !important;
  gap:9px !important;
}
.booking-day{
  min-width:0 !important;
  overflow:hidden !important;
  min-height:118px !important;
  gap:8px !important;
  padding:11px !important;
}
.booking-day .day-num{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
}
.booking-day .day-events{
  display:grid !important;
  gap:5px !important;
  min-width:0 !important;
}
.booking-day .tag{
  display:block !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  min-width:0 !important;
  min-height:22px !important;
  padding:5px 7px !important;
  font-size:11px !important;
  line-height:1.15 !important;
}
.booking-day .tag.block,
.booking-day .tag.other{
  background:#d9f2df !important;
  color:#0a5742 !important;
}
.booking-day .tag.wait{
  background:#fff2c4 !important;
  color:#7d5a00 !important;
}
.booking-day .tag.more{
  background:#e9eeea !important;
  color:#68766f !important;
}
.booking-day .day-note{
  margin-top:auto !important;
  display:inline-flex !important;
  align-self:flex-start !important;
  min-height:22px !important;
  align-items:center !important;
  padding:0 8px !important;
  border-radius:999px !important;
  background:#e8ede8 !important;
  color:#7c877f !important;
  font-size:11px !important;
  font-weight:900 !important;
}
.booking-day.out-of-window.has-booking,
.booking-day.out-of-window.has-any-booking{
  opacity:.82 !important;
}
.booking-day.out-of-window.has-booking .tag,
.booking-day.out-of-window.has-any-booking .tag{
  opacity:.78 !important;
}
.booking-day-detail{
  max-height:240px !important;
  overflow:auto !important;
}
.booking-day-detail li{
  grid-template-columns:auto minmax(0,1fr) !important;
}
.booking-day-detail small{
  grid-column:2/-1 !important;
  white-space:normal !important;
}
@media (max-width:1080px){
  .reservation-step-layout{
    grid-template-columns:1fr !important;
  }
  .reservation-step-side{
    position:static !important;
    grid-template-columns:1fr !important;
  }
}
@media (max-width:760px){
  .booking-calendar-scroll{
    overflow-x:auto !important;
    padding-bottom:10px !important;
  }
  .booking-calendar-weekdays,
  .booking-calendar-grid{
    min-width:760px !important;
  }
  .booking-day{
    min-height:108px !important;
  }
}

/* ------------------------------------------------------------------
   v38: reservation mobile layout and calendar interaction polish
   - Keep mobile header compact and aligned.
   - Prevent the reservation calendar from being squeezed horizontally.
   - Move detailed reservation text to the selected-day detail panel on mobile.
------------------------------------------------------------------- */
@media (max-width:920px){
  .site-header .nav{
    width:100% !important;
    min-height:74px !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:10px 0 !important;
  }
  .site-header .brand{
    flex:1 1 auto !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
  }
  .site-header .brand-logo,
  .site-header .brand-mark{
    width:46px !important;
    height:46px !important;
    flex:0 0 46px !important;
  }
  .site-header .brand-title{
    font-size:18px !important;
    line-height:1.12 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .site-header .brand-subtitle{
    display:block !important;
    font-size:11px !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .site-header .nav-toggle{
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    margin:0 0 0 auto !important;
    align-self:center !important;
  }
}
@media (max-width:420px){
  .site-header .brand-logo,
  .site-header .brand-mark{width:42px !important;height:42px !important;flex-basis:42px !important;}
  .site-header .brand-title{font-size:16px !important;}
  .site-header .brand-subtitle{font-size:10px !important;}
  .site-header .nav-toggle{flex-basis:48px !important;width:48px !important;height:48px !important;}
}

/* Reservation page page-flow */
.reservation-step-layout{
  gap:26px !important;
}
.reservation-step-calendar .reservation-calendar-panel{
  padding:28px !important;
  border-radius:28px !important;
}
.reservation-step-side{
  gap:14px !important;
}
.selection-summary-card,
.reservation-step-side .dynamic-section{
  border-radius:24px !important;
}
.refund-consent-card{
  margin-top:20px !important;
  padding:20px 22px !important;
}
.refund-consent-card h3{
  margin-bottom:12px !important;
}
.refund-summary-list{
  grid-template-columns:repeat(5,minmax(0,1fr)) !important;
  gap:10px !important;
}
.refund-summary-list li{
  min-width:0 !important;
  padding:13px 14px !important;
}

@media (max-width:1080px){
  .reservation-step-layout{
    grid-template-columns:1fr !important;
  }
  .reservation-step-side{
    position:static !important;
  }
}

@media (max-width:760px){
  .page{padding-top:18px !important;}
  .hero-card{
    grid-template-columns:1fr !important;
    gap:14px !important;
    padding:22px 18px !important;
    border-radius:24px !important;
  }
  .hero-copy h1{font-size:30px !important;}
  .price-card{padding:16px 18px !important;border-radius:18px !important;}
  .card{padding:20px 14px !important;border-radius:24px !important;}
  .form-grid{gap:16px !important;}
  .booking-type-options{grid-template-columns:1fr !important;gap:10px !important;}
  .reservation-step-layout{gap:14px !important;}
  .reservation-step-calendar .reservation-calendar-panel{
    padding:18px 12px !important;
    border-radius:22px !important;
  }
  .booking-calendar-head{
    gap:14px !important;
  }
  .booking-calendar-head h3{
    font-size:25px !important;
    line-height:1.18 !important;
  }
  .booking-calendar-head p{
    font-size:14px !important;
    line-height:1.55 !important;
  }
  .booking-calendar-controls{
    grid-template-columns:auto 1fr auto !important;
    width:100% !important;
    gap:8px !important;
  }
  .booking-calendar-controls .btn{
    height:40px !important;
    padding:0 12px !important;
    font-size:13px !important;
  }
  .booking-calendar-controls strong{
    min-width:0 !important;
    text-align:center !important;
    font-size:17px !important;
  }
  .booking-calendar-legend{
    gap:8px !important;
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    padding-bottom:2px !important;
  }
  .booking-calendar-legend span{
    flex:0 0 auto !important;
    min-height:28px !important;
    padding:0 10px !important;
    font-size:12px !important;
  }
  .booking-calendar-state{
    font-size:12px !important;
    line-height:1.45 !important;
    padding:10px 12px !important;
  }
  .booking-calendar-scroll{
    overflow-x:visible !important;
    padding-bottom:0 !important;
  }
  .booking-calendar-weekdays,
  .booking-calendar-grid{
    min-width:0 !important;
    width:100% !important;
    gap:5px !important;
    grid-template-columns:repeat(7,minmax(0,1fr)) !important;
  }
  .booking-calendar-weekdays span{
    font-size:11px !important;
  }
  .booking-day{
    min-width:0 !important;
    min-height:76px !important;
    border-radius:18px !important;
    padding:8px 5px !important;
    gap:4px !important;
  }
  .booking-day .day-num{
    font-size:17px !important;
    line-height:1 !important;
    justify-content:center !important;
  }
  .booking-day .day-events{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:center !important;
    align-content:flex-start !important;
    gap:3px !important;
    min-height:16px !important;
  }
  .booking-day .tag{
    width:8px !important;
    height:8px !important;
    min-height:8px !important;
    max-width:8px !important;
    padding:0 !important;
    border-radius:999px !important;
    color:transparent !important;
    font-size:0 !important;
    line-height:0 !important;
    overflow:hidden !important;
  }
  .booking-day .tag.more{
    width:auto !important;
    max-width:28px !important;
    min-width:18px !important;
    height:16px !important;
    min-height:16px !important;
    padding:0 4px !important;
    color:#65746d !important;
    font-size:10px !important;
    line-height:16px !important;
    text-align:center !important;
  }
  .booking-day .day-note{display:none !important;}
  .booking-day.out-of-window{
    background:#f5f5f0 !important;
    opacity:.52 !important;
  }
  .booking-day.has-booking,
  .booking-day.has-any-booking{
    opacity:1 !important;
  }
  .booking-day.selected{
    box-shadow:0 0 0 2px rgba(15,104,79,.45) !important;
  }
  .booking-day-detail{
    max-height:none !important;
    padding:14px !important;
    border-radius:18px !important;
  }
  .booking-day-detail h3{font-size:17px !important;}
  .booking-day-detail li{padding:10px 0 !important;}
  .selection-summary-card,
  .reservation-step-side .dynamic-section{
    padding:18px !important;
    border-radius:20px !important;
  }
  .selection-summary-card h3{
    font-size:23px !important;
  }
  .section-grid-side{gap:12px !important;}
  .refund-consent-card{padding:16px !important;border-radius:20px !important;}
  .refund-summary-list{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
  }
  .refund-summary-list li:last-child{grid-column:1 / -1 !important;}
  .checkline{align-items:flex-start !important;font-size:14px !important;}
  .summary-box{padding:18px !important;border-radius:20px !important;}
  .button-row-end{justify-content:stretch !important;}
  .button-row-end .btn{width:100% !important;}
}

@media (max-width:420px){
  .booking-calendar-weekdays,
  .booking-calendar-grid{
    min-width:0 !important;
    gap:4px !important;
  }
  .booking-day{
    min-height:68px !important;
    border-radius:16px !important;
    padding:7px 3px !important;
  }
  .booking-day .day-num{font-size:16px !important;}
  .booking-day .tag{width:7px !important;height:7px !important;min-height:7px !important;max-width:7px !important;}
}


/* ------------------------------------------------------------------
   v39: mobile header hard alignment + calendar readability
   - Keep logo and hamburger on one compact row on every page.
   - Prevent reservation/change calendars from being squeezed on phones.
   - Use responsive typography and horizontal scroll only for the calendar grid.
------------------------------------------------------------------- */
@media (max-width:920px){
  html{font-size:clamp(14px, 3.6vw, 16px) !important;}
  .site-header{
    position:sticky !important;
    top:0 !important;
    min-height:0 !important;
    z-index:6000 !important;
  }
  .site-header .container.nav,
  .site-header .nav{
    width:min(calc(100% - 28px), 1200px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:10px 0 !important;
    min-height:76px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 52px !important;
    grid-template-rows:auto !important;
    align-items:center !important;
    justify-content:normal !important;
    gap:10px !important;
    flex-wrap:nowrap !important;
  }
  .site-header .brand{
    grid-column:1 !important;
    grid-row:1 !important;
    width:auto !important;
    min-width:0 !important;
    max-width:100% !important;
    justify-self:start !important;
    align-self:center !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    margin:0 !important;
  }
  .site-header .brand-logo,
  .site-header .brand-mark{
    width:44px !important;
    height:44px !important;
    flex:0 0 44px !important;
  }
  .site-header .brand-text{
    display:block !important;
    min-width:0 !important;
    overflow:hidden !important;
  }
  .site-header .brand-title{
    font-size:clamp(16px, 4.2vw, 20px) !important;
    line-height:1.12 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .site-header .brand-subtitle{
    display:block !important;
    font-size:clamp(10px, 2.7vw, 12px) !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .site-header .nav-toggle{
    grid-column:2 !important;
    grid-row:1 !important;
    position:relative !important;
    inset:auto !important;
    transform:none !important;
    display:inline-flex !important;
    justify-self:end !important;
    align-self:center !important;
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    margin:0 !important;
    z-index:6004 !important;
  }
  .site-header .nav-links{
    grid-column:1 / -1 !important;
  }
}
@media (max-width:420px){
  .site-header .container.nav,
  .site-header .nav{
    width:min(calc(100% - 22px), 1200px) !important;
    grid-template-columns:minmax(0,1fr) 48px !important;
    min-height:70px !important;
    gap:8px !important;
  }
  .site-header .brand-logo,
  .site-header .brand-mark{
    width:38px !important;
    height:38px !important;
    flex-basis:38px !important;
  }
  .site-header .nav-toggle{
    width:48px !important;
    height:48px !important;
    flex-basis:48px !important;
    border-radius:16px !important;
  }
}

@media (max-width:760px){
  .page, .page-shell, .wrap{
    width:100% !important;
    box-sizing:border-box !important;
  }
  .hero-copy h1,
  .page-hero h1,
  .title{
    font-size:clamp(30px, 8.2vw, 42px) !important;
    line-height:1.08 !important;
    letter-spacing:-.045em !important;
  }
  .desc, .hero-copy p, .page-hero p{
    font-size:clamp(14px, 3.6vw, 17px) !important;
    line-height:1.65 !important;
  }
  .top-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }
  .top-actions .secondary{
    width:100% !important;
    min-width:0 !important;
    padding:0 10px !important;
    font-size:clamp(13px, 3.4vw, 15px) !important;
  }

  /* Reservation.html calendar: readable mobile grid with local horizontal scroll */
  .reservation-step-layout{
    display:block !important;
  }
  .reservation-step-calendar{
    min-width:0 !important;
  }
  .reservation-step-calendar .reservation-calendar-panel{
    padding:18px 12px !important;
    overflow:hidden !important;
  }
  .booking-calendar-scroll{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    margin:0 -6px !important;
    padding:0 6px 10px !important;
  }
  .booking-calendar-weekdays,
  .booking-calendar-grid{
    min-width:640px !important;
    width:640px !important;
    grid-template-columns:repeat(7, 1fr) !important;
    gap:8px !important;
  }
  .booking-calendar-weekdays span{
    font-size:12px !important;
  }
  .booking-day{
    min-height:94px !important;
    border-radius:18px !important;
    padding:8px 7px !important;
  }
  .booking-day .day-num{
    font-size:clamp(17px, 4.4vw, 21px) !important;
  }
  .booking-day .tag{
    width:auto !important;
    max-width:100% !important;
    height:auto !important;
    min-height:18px !important;
    padding:2px 6px !important;
    color:#0f684f !important;
    font-size:11px !important;
    line-height:1.25 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .booking-day .tag.more{
    color:#65746d !important;
    font-size:10px !important;
  }
  .reservation-step-side{
    margin-top:14px !important;
  }
  .selection-summary-card,
  .reservation-step-side .dynamic-section{
    padding:16px !important;
  }

  /* Change-reservation calendar: same readable behavior */
  .calendar-card{
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .calendar-card .calendar-head,
  .calendar-card .legend,
  .calendar-card .calendar-state,
  .calendar-card .day-detail{
    min-width:0 !important;
  }
  .calendar-card .calendar-grid{
    min-width:640px !important;
    width:640px !important;
    grid-template-columns:repeat(7, 1fr) !important;
    gap:8px !important;
  }
  .calendar-card .weekday{
    font-size:12px !important;
  }
  .calendar-card .day{
    min-height:96px !important;
    border-radius:18px !important;
    padding:8px 7px !important;
  }
  .calendar-card .day-num{
    font-size:clamp(17px, 4.4vw, 21px) !important;
  }
  .calendar-card .tag{
    max-width:100% !important;
    min-height:18px !important;
    padding:2px 6px !important;
    font-size:11px !important;
    line-height:1.25 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .calendar-card .tag.more{
    font-size:10px !important;
  }
}

@media (min-width:761px) and (max-width:1080px){
  .booking-calendar-weekdays,
  .booking-calendar-grid,
  .calendar-card .calendar-grid{
    min-width:0 !important;
    width:100% !important;
  }
}


/* ------------------------------------------------------------------
   v41: UI/UX contrast, list-based management views, and form polish
   - Higher contrast while keeping the Hansalim green/ivory tone.
   - Lookup/admin user views use scannable list rows instead of dense cards.
   - Mypage inputs receive comfortable inner spacing.
------------------------------------------------------------------- */
:root{
  --hs-bg:#f6f2e8;
  --hs-bg-deep:#ece5d7;
  --hs-card:#fffefa;
  --hs-card-strong:#ffffff;
  --hs-line:#cad6cf;
  --hs-line-soft:rgba(13,57,47,.18);
  --hs-text:#0b3b31;
  --hs-muted:#53665f;
  --hs-primary:#087153;
  --hs-primary-dark:#074434;
  --hs-primary-soft:#e4f2ec;
  --hs-accent:#85bd55;
  --hs-warn:#fff2bd;
  --hs-warn-line:#d9bd4e;
  --hs-danger:#a3332f;
  --hs-danger-soft:#ffebe8;
  --hs-shadow:0 18px 44px rgba(7,68,52,.10);
  --hs-shadow-soft:0 9px 24px rgba(7,68,52,.075);
}
body{background:linear-gradient(180deg,#f8f5ee 0%,#f1eadb 100%) !important;color:var(--hs-text) !important;}
.card,.panel,.content-card,.simple-card,.menu-card,.hero-card,.section-card,.filter-panel,.selection-summary-card,.reservation-calendar-panel,.booking-day-detail,.day-detail,.month-list,.status-card,.toolbar,.user-card,.request-card{
  background:var(--hs-card) !important;
  border-color:var(--hs-line-soft) !important;
  box-shadow:var(--hs-shadow-soft) !important;
}
.btn-primary,.tab-btn.active,.site-header .nav-links > a.nav-cta,.site-header .nav-links > a[href$="reserve.html"],.site-header .nav-links > a[href="./reservation.html"]{
  background:linear-gradient(180deg,var(--hs-primary),var(--hs-primary-dark)) !important;
  border-color:transparent !important;
  color:#fff !important;
}
.secondary,.btn-secondary,.btn:not(.btn-primary):not(.btn-danger),.tab-btn:not(.active){
  background:#fffefa !important;
  border-color:rgba(13,57,47,.22) !important;
  color:var(--hs-text) !important;
}
.field input,.field select,.field textarea,.input,
.form-grid input:not([type="radio"]):not([type="checkbox"]),.form-grid select,.form-grid textarea,
.section-grid input:not([type="radio"]):not([type="checkbox"]),.section-grid select,.section-grid textarea{
  padding-left:18px !important;
  padding-right:18px !important;
  color:var(--hs-text) !important;
  border-color:rgba(13,57,47,.24) !important;
}
.page-mypage-v41 .field input{padding-left:22px !important;padding-right:22px !important;}
.page-mypage-v41 .profile-grid{gap:22px !important;}
.page-mypage-v41 .section-card{padding:28px !important;border:1px solid var(--hs-line-soft);border-radius:26px;background:#fffefa;}

/* Booking overview calendar: make dorm and meeting tags distinguishable */
.reserve-tag.dorm,.tag.dorm,.reserve-dot.dorm{background:#efe4c7 !important;color:#6d4c12 !important;}
.reserve-tag.meeting,.tag.block,.reserve-dot.meeting{background:#cfeee0 !important;color:#064d39 !important;}
.reserve-tag.waiting,.tag.wait{background:#ffe9e5 !important;color:#95342f !important;}
.reserve-calendar-state,.booking-calendar-state{background:#fffefa !important;border:1px solid rgba(13,57,47,.18) !important;color:#36554d !important;}

/* Lookup: list/table form for fast scanning */
.page-lookup-v41 .wrap{max-width:1180px !important;}
.page-lookup-v41 .my-list{display:block !important;margin-top:16px !important;}
.lookup-list-table{display:block;border:1px solid var(--hs-line-soft);border-radius:22px;overflow:hidden;background:#fff;box-shadow:var(--hs-shadow-soft);}
.lookup-list-row{display:grid;grid-template-columns:1.15fr 1fr 1.2fr .72fr 1fr 1.2fr;gap:14px;align-items:center;padding:15px 18px;border-top:1px solid rgba(13,57,47,.10);font-size:14px;line-height:1.5;}
.lookup-list-row:first-child{border-top:0;}
.lookup-list-head{background:#eef5ef;color:#36554d;font-size:12px;font-weight:950;letter-spacing:.02em;text-transform:uppercase;}
.lookup-no strong{display:block;font-size:15px;color:var(--hs-text);}
.lookup-no span,.lookup-phone{display:block;margin-top:3px;color:var(--hs-muted);font-size:12px;font-weight:800;}
.lookup-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;}
.lookup-actions .secondary,.lookup-actions .danger{min-height:34px !important;padding:0 11px !important;font-size:12px !important;}

/* Admin users: list rows instead of cards */
.page-admin-users-v41 .grid{display:block !important;}
.admin-user-list{border:1px solid var(--hs-line-soft);border-radius:22px;overflow:hidden;background:#fff;box-shadow:var(--hs-shadow-soft);}
.admin-user-row{display:grid;grid-template-columns:1.15fr 1fr 1.2fr .7fr .75fr 1.35fr;gap:14px;align-items:center;padding:15px 18px;border-top:1px solid rgba(13,57,47,.10);font-size:14px;line-height:1.5;}
.admin-user-row:first-child{border-top:0;}
.admin-user-head{background:#eef5ef;color:#36554d;font-size:12px;font-weight:950;letter-spacing:.02em;}
.user-main strong{display:block;font-size:16px;color:var(--hs-text);}
.user-main span{display:block;margin-top:3px;color:var(--hs-muted);font-size:12px;font-weight:800;}
.admin-row-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap;}
.admin-row-actions .btn{min-height:34px !important;height:34px !important;padding:0 11px !important;font-size:12px !important;}

/* Admin payment page visible and readable */
.page-admin-payments-v41 .page{max-width:1180px !important;}
.page-admin-payments-v41 .request-card{border-color:var(--hs-line-soft) !important;}

@media (max-width:980px){
  .lookup-list-row,.admin-user-row{grid-template-columns:1fr;gap:6px;padding:16px;}
  .lookup-list-head,.admin-user-head{display:none;}
  .lookup-actions,.admin-row-actions{justify-content:stretch;}
  .lookup-actions .secondary,.lookup-actions .danger,.admin-row-actions .btn{width:100%;min-height:42px !important;}
  .lookup-list-row,.admin-user-row{border-top:1px solid rgba(13,57,47,.13);}
}
@media (max-width:760px){
  .title{font-size:clamp(32px, 9vw, 44px) !important;}
  .card,.panel,.section-card{border-radius:22px !important;}
  .filter-panel{padding:16px !important;}
  .page-mypage-v41 .section-card{padding:20px !important;}
}


/* ------------------------------------------------------------------
   v42: direct reservation flow, hotel-booking UX polish, and contrast
   - Header/book buttons go straight to reservation.html.
   - Calendar-first booking page with clearer status colors.
   - Admin/list/modal button alignment and stronger card contrast.
------------------------------------------------------------------- */
:root{
  --hs-surface:#fffdf7;
  --hs-surface-2:#faf5ea;
  --hs-ink:#08392f;
  --hs-ink-2:#244d43;
  --hs-border:#bccdc4;
  --hs-border-strong:#8fb2a3;
  --hs-meeting:#008767;
  --hs-meeting-bg:#d7f3e9;
  --hs-dorm:#2867b2;
  --hs-dorm-bg:#e1edff;
  --hs-wait:#b66a00;
  --hs-wait-bg:#ffecbf;
  --hs-off:#eef0ea;
}
body{background:linear-gradient(180deg,#f8f5ed 0%,#eee5d4 100%) !important;}
.site-header .nav-links > a[href$="reserve.html"],
.site-header .nav-links > a[href="../pages/reserve.html"],
.site-header .nav-links > a[href="pages/reserve.html"]{background:transparent !important;color:var(--hs-text) !important;}
.site-header .nav-links > a[href$="reservation.html"],
.site-header .nav-links > a.nav-cta{
  background:linear-gradient(180deg,var(--hs-primary),var(--hs-primary-dark)) !important;
  color:#fff !important;
  border-color:transparent !important;
}
.redirect-card{max-width:720px;margin:80px auto;padding:42px !important;text-align:left;}
.redirect-card h1{margin:12px 0;color:var(--hs-text);font-size:clamp(34px,5vw,54px);letter-spacing:-.055em;}
.redirect-card p{color:var(--hs-muted);font-size:17px;line-height:1.75;}

/* Reservation page: one direct, calendar-first booking system */
.page-reservation-v42 .page{padding-top:34px !important;}
.page-reservation-v42 .hero-card{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px) !important;
  gap:24px !important;
  align-items:center !important;
  padding:34px clamp(24px,4vw,46px) !important;
  border-radius:30px !important;
  background:linear-gradient(135deg,#fffefa 0%,#f7f1e5 100%) !important;
  border:1px solid rgba(8,57,47,.16) !important;
  box-shadow:0 18px 46px rgba(7,68,52,.09) !important;
}
.page-reservation-v42 .hero-copy h1{
  font-size:clamp(42px,5.5vw,66px) !important;
  letter-spacing:-.06em !important;
  margin-bottom:10px !important;
}
.page-reservation-v42 .hero-copy p{font-size:clamp(16px,1.5vw,19px) !important;color:#496159 !important;}
.page-reservation-v42 .price-card{
  background:linear-gradient(180deg,#f2eadb,#e8ddc8) !important;
  border:1px solid rgba(8,57,47,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65) !important;
}
.page-reservation-v42 .card{
  padding:clamp(22px,3vw,34px) !important;
  background:#fffdf8 !important;
  border-color:rgba(8,57,47,.16) !important;
}
.page-reservation-v42 #reservation-form{align-items:start !important;}
.page-reservation-v42 .booking-type-group{order:-20 !important;margin-bottom:4px !important;}
.page-reservation-v42 .reservation-step-layout{order:-19 !important;}
.page-reservation-v42 .booking-type-options{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
.page-reservation-v42 .booking-type-card{
  min-height:64px !important;
  border-color:rgba(8,57,47,.18) !important;
  background:#fff !important;
}
.page-reservation-v42 .booking-type-card.active,
.page-reservation-v42 .booking-type-card:has(input[type="radio"]:checked){
  background:#e7f4ee !important;
  border-color:#087153 !important;
  box-shadow:0 0 0 3px rgba(8,113,83,.10) inset !important;
}
.page-reservation-v42 .reservation-step-layout{
  grid-template-columns:minmax(0, 1.58fr) minmax(310px,.74fr) !important;
  gap:24px !important;
}
.page-reservation-v42 .reservation-calendar-panel{
  background:linear-gradient(180deg,#fffefa,#fbf7ef) !important;
  border-color:rgba(8,57,47,.18) !important;
}
.page-reservation-v42 .booking-calendar-head h3{font-size:clamp(30px,3vw,42px) !important;}
.page-reservation-v42 .booking-calendar-state{background:#f7fbf8 !important;border-color:rgba(8,57,47,.18) !important;color:#38564e !important;}
.page-reservation-v42 .reservation-step-side{top:92px !important;}
.page-reservation-v42 .selection-summary-card,
.page-reservation-v42 .reservation-step-side .dynamic-section{
  border-color:rgba(8,57,47,.17) !important;
  background:#ffffff !important;
}

/* Calendar contrast: meeting/dorm/waiting are visibly different */
.reserve-calendar-legend .legend-dot.meeting,
.booking-calendar-legend .legend-dot.meeting{background:var(--hs-meeting) !important;}
.reserve-calendar-legend .legend-dot.dorm,
.booking-calendar-legend .legend-dot.dorm{background:var(--hs-dorm) !important;}
.reserve-calendar-legend .legend-dot.waiting,
.booking-calendar-legend .legend-dot.waiting{background:var(--hs-wait) !important;}
.reserve-day,.booking-day{
  border-color:rgba(8,57,47,.16) !important;
  background:#fffefa !important;
}
.reserve-day.has-items,.reserve-day.has-booking,
.booking-day.has-booking{
  background:linear-gradient(180deg,#fff9eb 0%,#fdf3d5 100%) !important;
  border-color:#d6b046 !important;
}
.booking-day.has-any-booking:not(.has-booking),
.reserve-day.has-any-booking:not(.has-booking){
  background:linear-gradient(180deg,#f4f9f6,#edf5ef) !important;
  border-color:#9bbbac !important;
}
.reserve-day.selected,.booking-day.selected{
  border-color:#006b50 !important;
  box-shadow:0 0 0 3px rgba(0,107,80,.24),0 14px 28px rgba(7,68,52,.12) !important;
}
.reserve-tag.meeting,.booking-day .tag.block,.booking-day .tag.meeting,.tag.block,
.reserve-dot.meeting{
  background:var(--hs-meeting-bg) !important;
  color:#00543f !important;
  border:1px solid rgba(0,135,103,.18) !important;
}
.reserve-tag.dorm,.booking-day .tag.dorm,.tag.dorm,
.reserve-dot.dorm{
  background:var(--hs-dorm-bg) !important;
  color:#174e92 !important;
  border:1px solid rgba(40,103,178,.20) !important;
}
.reserve-tag.waiting,.booking-day .tag.wait,.tag.wait{
  background:var(--hs-wait-bg) !important;
  color:#7a4700 !important;
  border:1px solid rgba(182,106,0,.22) !important;
}
.booking-day .tag.other,
.reserve-tag.more,.booking-day .tag.more{
  background:#e7ece8 !important;
  color:#40584f !important;
  border:1px solid rgba(8,57,47,.12) !important;
}
.booking-day.out-of-window,
.reserve-day.out-of-window{
  background:#eff1ec !important;
  color:#7f8c86 !important;
  border-style:dashed !important;
}
.booking-day .tag,.reserve-tag{
  font-weight:900 !important;
  letter-spacing:-.025em !important;
}

/* Remove excessive visual noise in booking form */
.page-reservation-v42 .refund-consent-card{
  background:linear-gradient(135deg,#f0f7f2,#fffaf0) !important;
  border-color:rgba(8,57,47,.16) !important;
}
.page-reservation-v42 .summary-box{background:#fff !important;border-color:rgba(8,57,47,.16) !important;}
.page-reservation-v42 .checkline{padding:14px 16px;border:1px solid rgba(8,57,47,.12);border-radius:18px;background:#fffefa;}

/* List and modal action alignment */
.admin-user-row,.lookup-list-row{align-items:center !important;}
.admin-row-actions,.lookup-actions,.card-actions,.actions,.confirm-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:8px !important;
}
.admin-row-actions .btn,.lookup-actions .btn,.lookup-actions .secondary,.lookup-actions .danger{
  min-width:92px !important;
  white-space:nowrap !important;
}
.admin-password-modal{padding:22px !important;}
.admin-password-card{
  width:min(640px,calc(100vw - 36px)) !important;
  padding:clamp(24px,4vw,38px) !important;
  border-radius:30px !important;
}
.admin-password-card .field input{
  padding-left:22px !important;
  padding-right:22px !important;
}
.admin-password-card .actions{
  margin-top:22px !important;
  justify-content:flex-end !important;
}
.admin-password-card .actions .btn{min-width:120px !important;}

/* Page-level cards: stronger separation without leaving brand tone */
.page-lookup-v41 .card,.page-mypage-v41 .section-card,.page-admin-users-v41 .panel,.lookup-list-table,.admin-user-list{
  background:#fffefa !important;
  border-color:rgba(8,57,47,.18) !important;
  box-shadow:0 18px 42px rgba(7,68,52,.085) !important;
}
.lookup-list-head,.admin-user-head{background:#e7f2eb !important;color:#274e44 !important;}
.badge.approved{background:#e0f2e8 !important;color:#075b42 !important;border-color:#badfca !important;}
.badge.pending{background:#fff0c8 !important;color:#745020 !important;border-color:#e3c46b !important;}
.badge.rejected{background:#ffe9e6 !important;color:#9c2f2b !important;border-color:#efbeb8 !important;}

@media (max-width:980px){
  .page-reservation-v42 .hero-card,
  .page-reservation-v42 .reservation-step-layout{grid-template-columns:1fr !important;}
  .page-reservation-v42 .reservation-step-side{position:static !important;}
}
@media (max-width:760px){
  .page-reservation-v42 .page{padding-top:18px !important;}
  .page-reservation-v42 .hero-card{padding:24px 20px !important;border-radius:24px !important;}
  .page-reservation-v42 .hero-copy h1{font-size:clamp(36px,11vw,48px) !important;}
  .page-reservation-v42 .price-card{padding:18px !important;border-radius:20px !important;}
  .page-reservation-v42 .booking-type-options{grid-template-columns:1fr !important;}
  .page-reservation-v42 .booking-calendar-scroll{
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    padding-bottom:10px !important;
  }
  .page-reservation-v42 .booking-calendar-weekdays,
  .page-reservation-v42 .booking-calendar-grid{
    min-width:640px !important;
    width:640px !important;
    gap:8px !important;
  }
  .page-reservation-v42 .booking-day{
    min-height:100px !important;
    padding:9px 8px !important;
    border-radius:18px !important;
  }
  .page-reservation-v42 .booking-day .day-num{font-size:18px !important;}
  .page-reservation-v42 .booking-day .tag{
    display:inline-flex !important;
    width:auto !important;
    max-width:100% !important;
    height:auto !important;
    min-height:20px !important;
    padding:3px 7px !important;
    color:inherit !important;
    font-size:10.5px !important;
    line-height:1.2 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
  .page-reservation-v42 .booking-day .tag.more{font-size:10px !important;}
  .page-reservation-v42 .booking-calendar-controls{grid-template-columns:1fr auto 1fr !important;}
  .page-reservation-v42 .refund-summary-list{grid-template-columns:1fr !important;}
  .admin-row-actions,.lookup-actions,.admin-password-card .actions{justify-content:stretch !important;}
  .admin-row-actions .btn,.lookup-actions .secondary,.lookup-actions .danger,.admin-password-card .actions .btn{width:100% !important;}
}

/* ==================================================================
   Hansalim NC Reservation — v43 UX·Contrast Refinement Layer
   파일 맨 끝에 위치해 이전 레이어를 보완/덮어씁니다.
   목표: 명도 대비(WCAG AA) 향상, 키보드 접근성, 달력 가독성,
         예약 플로우 어포던스. 호텔/회의실/공유공간 예약 사이트
         (Booking.com·Airbnb·Calendly·네이버예약) 패턴 반영.
================================================================== */

/* 1) 보조 텍스트 명도 대비 강화 (이전 #68776f는 아이보리 배경에서 AA 경계) */
:root{ --hs-muted:#586b62; }
.desc,.muted,.field-help,.reservation-meta,
.selection-summary-card p,.booking-day-detail p,
.booking-calendar-state,.reserve-calendar-head p{ color:#566459 !important; }

/* 2) 키보드 포커스 가시성 — 모든 조작 요소 (접근성) */
a:focus-visible,button:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
.booking-day:focus-visible,.reserve-day:focus-visible{
  outline:3px solid #1f8a68 !important;
  outline-offset:2px !important;
}
.booking-type-card:focus-within{
  outline:3px solid #1f8a68 !important;
  outline-offset:2px !important;
}
/* 마우스 클릭 시에는 외곽선 숨김, 키보드 탐색만 강조 */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible){ outline:none !important; }

/* 3) 주요 버튼(CTA) 대비 강화 */
.btn-primary,.tab-btn.active{
  background:linear-gradient(180deg,#10755a,#0a4b3a) !important;
}

/* 4) 체크박스·라디오 색상을 브랜드 그린으로 통일 (기존 파란색 혼용 정리) */
.checkline input[type="checkbox"],
.confirm-checkline input[type="checkbox"],
.booking-type-card input[type="radio"]{ accent-color:#0f684f !important; }
.booking-type-card.active,
.booking-type-card:has(input[type="radio"]:checked){
  border-color:#0f684f !important;
  box-shadow:0 0 0 3px rgba(15,104,79,.12) inset !important;
}

/* 5) 달력 가독성 — 오늘/예약있음/선택/선택불가 상태를 또렷하게 */
/* 오늘: 작은 라벨로 명확히 (점만으로는 인지가 약함) */
.booking-day.today,.reserve-day.today{
  border-color:#1f8a68 !important;
  box-shadow:inset 0 0 0 1px #1f8a68 !important;
}
.booking-day.today .day-num::after,
.reserve-day.today > strong::after{
  content:"오늘";
  display:inline-block;
  margin-left:6px;
  padding:1px 6px;
  border-radius:999px;
  background:#1f8a68;
  color:#fff;
  font-size:10px;
  font-weight:900;
  vertical-align:middle;
  letter-spacing:.02em;
}
/* 예약 있는 날 경계 또렷하게 */
.booking-day.has-booking,.reserve-day.has-items{ border-color:#d8b94a !important; }
/* 선택한 날짜(연수원 입실~퇴실 구간 포함) 강조 */
.booking-day.selected,.reserve-day.selected{
  background:linear-gradient(180deg,#eafaf3,#ffffff) !important;
  border-color:#0f684f !important;
  box-shadow:0 0 0 3px rgba(15,104,79,.22),0 10px 24px rgba(0,40,27,.10) !important;
}
/* 선택 불가(범위 밖·지난 날): 빗금으로 비선택임을 분명히, 단 조회는 가능 */
.booking-day.out-of-window{
  background:repeating-linear-gradient(135deg,#f1f3f0,#f1f3f0 6px,#eaeee9 6px,#eaeee9 12px) !important;
  color:#8c958f !important;
  cursor:help !important;
}

/* 6) 태그 명도 대비 향상 */
.tag.other,.booking-day .tag.other{ background:#e4e8e4 !important; color:#3f4f48 !important; }
.tag.more,.booking-day .tag.more,.reserve-tag.more{ background:#dfe5e0 !important; color:#3f4f48 !important; }
.legend-dot.waiting,.reserve-dot.waiting{ background:#bd8310 !important; }

/* 7) 모바일: 주요 CTA(예약 진행하기)를 화면 하단에 고정 노출 */
@media (max-width:760px){
  .page-reservation-v42 .button-row-end{
    position:sticky !important;
    bottom:0 !important;
    z-index:50 !important;
    margin:0 -18px -8px !important;
    padding:12px 18px calc(12px + env(safe-area-inset-bottom)) !important;
    background:linear-gradient(180deg,rgba(247,245,239,0),#f7f5ef 30%) !important;
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
  }
  .page-reservation-v42 .button-row-end .btn{
    box-shadow:0 10px 24px rgba(15,104,79,.28) !important;
  }
}

/* 8) 모션 민감 사용자 배려 (prefers-reduced-motion) */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; scroll-behavior:auto !important; }
  .btn:hover,.booking-day:hover,.reserve-day:hover,.reservation-item:hover,
  .v9-facility-card:hover,.user-card:hover{ transform:none !important; }
}

/* ==================================================================
   Hansalim NC — v44 Hotel-grade Redesign Layer (딥그린 호텔풍)
   레퍼런스 분석: brunch.co.kr/@fbrudtjr1/13 (호텔 객실검색 UI/UX)
   적용 원칙:
   ① 예약 기능이 비주얼에 묻히지 않게 (조선호텔 교훈, 비주얼:기능 50:50)
   ② 주요 CTA는 고스트 버튼 금지, 포인트 컬러로 강조
   ③ 1080 해상도에서 핵심 영역이 잘리지 않고 하단 여유 확보 (신라 교훈)
   ④ 중요 정보(날짜)는 강조, 부가 옵션은 박스 처리 (콘래드 교훈)
   ⑤ 비활성 컨트롤은 시각적으로도 비활성 표시 (롯데 교훈)
   ================================================================== */

/* ── 1. 컬러 토큰: 딥 포레스트 그린 + 크림 + 골드 포인트 ───────── */
:root{
  --hs-bg:#f7f4ed;
  --hs-bg-deep:#efe9dc;
  --hs-card:#fffefb;
  --hs-card-strong:#ffffff;
  --hs-line:#dcd4c3;
  --hs-line-soft:rgba(13,43,35,.12);
  --hs-text:#13302a;
  --hs-muted:#52645b;
  --hs-primary:#0b4a38;
  --hs-primary-dark:#072e23;
  --hs-primary-soft:#ebf3ee;
  --hs-accent:#b9975a;
  --hs-gold:#b9975a;
  --hs-gold-deep:#8f7338;
  --hs-gold-soft:#f3ecdb;
  --hs-dark:#0d2b23;
  --hs-shadow:0 24px 60px rgba(7,46,35,.12);
  --hs-shadow-soft:0 12px 30px rgba(7,46,35,.08);
  --hs-font-display:'Pretendard',system-ui,sans-serif;
}

/* ── 2. 타이포그래피: 제목은 Pretendard 고굵기 + 타이트 자간 ───── */
.v9-home-hero h1,.v9-sub-hero h1,
.v9-section-head h2,
.page-reservation-v42 .hero-copy h1,
.page-hero h1,.hero-copy h1,.title,
.story-hero-copy h1,.story-kicker + h1,
.intro-hero h1,.cafe-hero h1{
  font-family:var(--hs-font-display) !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
}
.story-kicker{
  color:var(--hs-gold-deep) !important;
  letter-spacing:.22em !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}
.v9-kicker,.v9-small-label,.v9-card-kicker,.summary-eyebrow{
  color:var(--hs-gold-deep) !important;
  letter-spacing:.22em !important;
  font-size:12px !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

/* ── 3. 버튼: 고스트 금지, 명확한 어포던스 ─────────────────────── */
.btn{border-radius:14px !important;font-weight:850 !important;}
.btn-primary,.tab-btn.active{
  background:linear-gradient(180deg,#0e5a44,#083a2c) !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 12px 26px rgba(8,58,44,.25) !important;
}
.btn-primary:hover{filter:brightness(1.08);}
.btn-secondary{
  background:#fff !important;
  border:1.5px solid rgba(11,74,56,.38) !important;
  color:var(--hs-primary) !important;
}
/* 비활성 컨트롤: 기능만 막지 말고 시각적으로도 표시 (롯데호텔 교훈) */
.btn:disabled,button:disabled{
  opacity:.42 !important;
  cursor:not-allowed !important;
  box-shadow:none !important;
  transform:none !important;
  filter:grayscale(.4) !important;
}

/* ── 4. 헤더: 크림 유리 + 딥그린, 예약 CTA 솔리드 ─────────────── */
.site-header{background:rgba(248,245,238,.92) !important;}
.site-header .nav-links > a.nav-cta{
  background:linear-gradient(180deg,#0e5a44,#083a2c) !important;
  color:#fff !important;
  padding:0 18px !important;
  box-shadow:0 8px 18px rgba(8,58,44,.28);
}
.site-header .nav-links > a.nav-cta:hover{color:#fff !important;filter:brightness(1.1);}

/* ── 5. 홈 히어로: 풀블리드 + 딥그린 오버레이 (호텔 스타일) ────── */
.page-home-v9 .v9-home-hero{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  min-height:clamp(560px, calc(100vh - 270px), 780px) !important;
  padding:0 !important;
  background:var(--hs-dark) !important;
  border-bottom:none !important;
}
body.page-home-v9 .v9-home-hero .v9-hero-media{
  position:absolute !important;
  inset:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  display:block !important;
  height:auto !important;
  max-height:none !important;
  grid-column:auto !important;
  grid-row:auto !important;
}
body.page-home-v9 .v9-home-hero .v9-hero-media img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 38% !important;
  border-radius:0 !important;
  opacity:.9 !important;
  filter:none !important;
}
body.page-home-v9 .v9-home-hero .v9-hero-media::after{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(78deg,
    rgba(7,30,24,.90) 0%,
    rgba(7,30,24,.66) 36%,
    rgba(7,30,24,.22) 66%,
    rgba(7,30,24,.42) 100%) !important;
}
body.page-home-v9 .v9-home-hero .container.v9-hero-content{
  display:block !important;
  position:relative !important;
  z-index:2 !important;
  padding:clamp(56px,7vh,96px) 0 clamp(110px,14vh,150px) !important;
}
body.page-home-v9 .v9-home-hero .v9-hero-content > *{max-width:680px !important;}
body.page-home-v9 .v9-home-hero .v9-kicker{color:#d9c08c !important;}
body.page-home-v9 .v9-home-hero h1{
  color:#fdfbf4 !important;
  font-size:clamp(42px,4.6vw,68px) !important;
  text-shadow:0 4px 30px rgba(0,0,0,.28);
}
body.page-home-v9 .v9-home-hero .v9-hero-lead{
  color:rgba(250,247,238,.92) !important;
  font-weight:500 !important;
}
.page-home-v9 .v9-hero-actions .btn-secondary{
  background:rgba(255,255,255,.93) !important;
  border-color:transparent !important;
}

/* ── 6. 빠른 예약 검색바 (브런치 글 핵심 교훈 적용) ────────────────
   - 히어로 하단에 겹쳐 배치: 예약 기능 상시 노출 + 시선 집중
   - 박수(N박)는 퇴실일 뒤에 표시: 시선 역행 방지 (롯데 체크인↔체크아웃 교훈)
   - 비활성 날짜는 min/max로 제한                                    */
.qb-section{position:relative;z-index:40;margin-top:-78px;}
.qb-bar{
  display:grid;
  grid-template-columns:auto 1fr 1fr auto;
  gap:20px;
}
.qb-bar.is-meeting{grid-template-columns:auto 1fr auto;}
.qb-bar{
  align-items:end;
  background:var(--hs-card-strong);
  border:1px solid rgba(13,43,35,.10);
  border-radius:22px;
  padding:22px 26px 24px;
  box-shadow:0 34px 80px rgba(7,46,35,.20);
}
.qb-label{
  display:block;
  margin-bottom:9px;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--hs-gold-deep);
}
.qb-seg{display:inline-flex;gap:4px;background:#f0ece1;border-radius:14px;padding:4px;}
.qb-seg-btn{
  border:0;background:transparent;cursor:pointer;
  min-height:44px;padding:0 20px;border-radius:11px;
  font-family:inherit;font-size:15px;font-weight:800;color:#51625a;
  transition:background .15s ease,color .15s ease;
}
.qb-seg-btn.active{
  background:var(--hs-primary);color:#fff;
  box-shadow:0 6px 14px rgba(11,74,56,.28);
}
.qb-field input[type="date"]{
  width:100%;min-height:50px;
  border:1px solid rgba(13,43,35,.18);
  border-radius:13px;
  padding:0 14px;
  font-family:inherit;font-size:16px;font-weight:750;
  color:var(--hs-text);background:#fff;
}
.qb-field input[type="date"]:focus{border-color:var(--hs-primary);}
.qb-out-wrap{display:flex;align-items:center;gap:10px;}
.qb-out-wrap input{flex:1;}
.qb-nights{
  flex-shrink:0;
  min-width:46px;text-align:center;
  padding:7px 10px;border-radius:999px;
  background:var(--hs-gold-soft);color:var(--hs-gold-deep);
  font-size:13px;font-weight:900;letter-spacing:.02em;
}
.qb-submit{
  border:0;cursor:pointer;
  min-height:52px;padding:0 34px;border-radius:14px;
  background:linear-gradient(180deg,#0e5a44,#083a2c);
  color:#fff;font-family:inherit;font-size:16.5px;font-weight:900;letter-spacing:.01em;
  box-shadow:0 14px 30px rgba(8,58,44,.32);
  transition:transform .15s ease,filter .15s ease;
}
.qb-submit:hover{transform:translateY(-1px);filter:brightness(1.08);}
.qb-hidden{display:none !important;}
@media (max-width:980px){
  .qb-section{margin-top:-56px;}
  .qb-bar{grid-template-columns:1fr 1fr;}
  .qb-type{grid-column:1 / -1;}
  .qb-submit{grid-column:1 / -1;width:100%;}
}
@media (max-width:560px){
  .qb-bar{grid-template-columns:1fr;padding:18px 16px 20px;}
}

/* ── 7. 섹션·카드: 정돈된 고급감 ──────────────────────────────── */
.v9-section-head h2{font-size:clamp(30px,3.2vw,44px) !important;}
.v9-facility-card{
  overflow:hidden;
  border-radius:20px !important;
  border:1px solid rgba(13,43,35,.10) !important;
  background:#fffefb !important;
  box-shadow:var(--hs-shadow-soft) !important;
  transition:transform .22s ease,box-shadow .22s ease;
}
.v9-facility-card:hover{transform:translateY(-5px);box-shadow:var(--hs-shadow) !important;}
.v9-facility-card img{transition:transform .35s ease;}
.v9-facility-card:hover img{transform:scale(1.035);}
.v9-facility-card a{color:var(--hs-primary) !important;font-weight:850 !important;}
.v9-facility-card a:hover{color:var(--hs-gold-deep) !important;}

/* 밸류 밴드 → 다크 그린 밴드 (호텔 무드 섹션 리듬) */
.v9-value-band{
  background:var(--hs-dark) !important;
  border:none !important;
  padding:64px 0 !important;
}
.v9-value-band .v9-value-grid strong{
  color:#e3cb96 !important;
  font-family:var(--hs-font-display) !important;
  font-size:19px !important;
  letter-spacing:0 !important;
}
.v9-value-band .v9-value-grid span{color:rgba(243,239,228,.80) !important;}
.v9-value-band .v9-value-grid div{border-color:rgba(243,239,228,.14) !important;background:transparent !important;}
.v9-value-band .v9-value-grid,
.v9-value-band .container{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
}

.v9-mini-panel{
  border-radius:20px !important;
  border:1px solid rgba(13,43,35,.10) !important;
}
.v9-mini-panel-muted{
  background:linear-gradient(135deg,#0d3a2d,#0a2c22) !important;
  border:1px solid rgba(227,203,150,.30) !important;
}
.v9-mini-panel-muted .v9-small-label{color:#d9c08c !important;}
.v9-mini-panel-muted h3{color:#fdfbf4 !important;font-family:var(--hs-font-display) !important;font-size:28px !important;}
.v9-mini-panel-muted p{color:rgba(250,247,238,.85) !important;}

/* ── 8. 푸터: 딥그린 다크 ─────────────────────────────────────── */
.footer-links-strip{
  background:#0a241d !important;
  border:none !important;
}
.footer-links-strip a{color:rgba(243,239,228,.85) !important;font-weight:700;}
.footer-links-strip a:hover{color:#e3cb96 !important;}
.footer{
  background:var(--hs-dark) !important;
  color:#ece7d8 !important;
  border-top:1px solid rgba(243,239,228,.10) !important;
}
.footer .footer-brand-title{color:#f6f2e6 !important;font-family:var(--hs-font-display) !important;}
.footer .muted-light,.footer .tiny,.footer p{color:rgba(236,231,216,.72) !important;}
.footer a{color:rgba(236,231,216,.9) !important;}

/* ── 9. 예약 페이지: 기능이 주인공 (조선호텔 반면교사) ─────────── */
.page-reservation-v42 .hero-card{
  background:linear-gradient(120deg,#0d3a2d 0%,#0a2c22 100%) !important;
  border:none !important;
}
.page-reservation-v42 .hero-copy h1{color:#fdfbf4 !important;}
.page-reservation-v42 .hero-copy p{color:rgba(247,243,232,.86) !important;}
.page-reservation-v42 .price-card{
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(227,203,150,.38) !important;
}
.page-reservation-v42 .price-card h3{color:#e3cb96 !important;font-family:var(--hs-font-display) !important;}
.page-reservation-v42 .price-card li,.page-reservation-v42 .price-card ul{color:rgba(250,247,238,.92) !important;}

/* 예약구분 카드: 선택 상태를 또렷하게 */
.booking-type-card.active,
.booking-type-card:has(input[type="radio"]:checked){
  border-color:var(--hs-primary) !important;
  box-shadow:0 0 0 3px rgba(11,74,56,.14) inset !important;
  background:var(--hs-primary-soft) !important;
}
.checkline input[type="checkbox"],
.confirm-checkline input[type="checkbox"],
.booking-type-card input[type="radio"]{accent-color:var(--hs-primary) !important;}

/* 달력 상태 컬러를 새 토큰으로 통일 */
.booking-day.today,.reserve-day.today{
  border-color:var(--hs-primary) !important;
  box-shadow:inset 0 0 0 1px var(--hs-primary) !important;
}
.booking-day.today .day-num::after,
.reserve-day.today > strong::after{background:var(--hs-primary);}
.booking-day.selected,.reserve-day.selected{
  background:linear-gradient(180deg,#eaf6ef,#ffffff) !important;
  border-color:var(--hs-primary) !important;
  box-shadow:0 0 0 3px rgba(11,74,56,.24),0 10px 24px rgba(7,46,35,.10) !important;
}
.booking-day.has-booking,.reserve-day.has-items{border-color:var(--hs-gold) !important;}
a:focus-visible,button:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,
.booking-day:focus-visible,.reserve-day:focus-visible{outline-color:#0e5a44 !important;}
.booking-type-card:focus-within{outline-color:#0e5a44 !important;}

/* 달력 상태 팔레트 조정: 쨍한 블루 → 딥그린·골드와 어울리는 슬레이트 블루 */
:root{
  --hs-meeting:#0b6b50;
  --hs-meeting-bg:#dcf1e7;
  --hs-dorm:#3a5d83;
  --hs-dorm-bg:#e7eef7;
  --hs-wait:#a3741c;
  --hs-wait-bg:#f7ecd2;
}
.reserve-tag.dorm,.booking-day .tag.dorm,.tag.dorm,
.reserve-dot.dorm{
  color:#2c4a6e !important;
  border-color:rgba(58,93,131,.24) !important;
}

/* ── 10. 1080 해상도 보장: 히어로+예약바가 잘림 없이 + 하단 여유 ── */
@media (min-height:900px) and (min-width:1280px){
  .page-home-v9 .v9-home-hero{min-height:calc(100vh - 300px) !important;max-height:760px;}
}

/* ==================================================================
   v44.1 — 기능 페이지 신규 디자인 (예약조회·회원가입·계정찾기·마이페이지)
   ================================================================== */

/* 공통: 입력 요소 포커스·라디우스 통일 */
.page-lookup-v41 .field input,.page-lookup-v41 .field select,.page-lookup-v41 .field textarea,
.page-recovery-v44 .field input,
.auth-card .field input,
.page-mypage-v41 .field input,.page-mypage-v41 .field select{
  min-height:54px !important;
  border-radius:14px !important;
  border:1.5px solid rgba(13,43,35,.16) !important;
  font-size:16px !important;
  color:var(--hs-text) !important;
  background:#fff !important;
}
.page-lookup-v41 .field input:focus,.page-lookup-v41 .field select:focus,
.page-recovery-v44 .field input:focus,
.auth-card .field input:focus,
.page-mypage-v41 .field input:focus,.page-mypage-v41 .field select:focus{
  border-color:var(--hs-primary) !important;
  box-shadow:0 0 0 4px rgba(11,74,56,.10) !important;
}

/* 공통: 페이지 타이틀 위 골드 킥커 라인 */
.page-lookup-v41 .wrap > .card > .title::before,
.page-recovery-v44 .wrap > .card > .title::before,
.auth-card .auth-title::before{
  content:"HANSALIM AGRICULTURE CENTER";
  display:block;
  margin-bottom:12px;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.22em;
  color:var(--hs-gold-deep);
}

/* ── 예약조회 (lookup) ───────────────────────────────────────── */
.page-lookup-v41{background:var(--hs-bg) !important;}
.page-lookup-v41 .wrap{max-width:1180px !important;}
.page-lookup-v41 .wrap > .card{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:24px !important;
  box-shadow:var(--hs-shadow-soft) !important;
  padding:clamp(28px,4vw,44px) !important;
}
.page-lookup-v41 .title{
  font-size:clamp(34px,4vw,46px) !important;
  letter-spacing:-.045em !important;
}
.page-lookup-v41 .desc{color:var(--hs-muted) !important;}
.page-lookup-v41 .section-card{
  background:#fbf8f1 !important;
  border:1px solid rgba(13,43,35,.08) !important;
  border-radius:20px !important;
  box-shadow:none !important;
}
.page-lookup-v41 .filter-panel{
  background:#fff !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:16px !important;
}
.page-lookup-v41 .reservation-item{
  border:1px solid rgba(13,43,35,.12) !important;
  border-radius:16px !important;
  background:#fff !important;
  transition:transform .18s ease, box-shadow .18s ease;
}
.page-lookup-v41 .reservation-item:hover{
  transform:translateY(-3px);
  box-shadow:var(--hs-shadow-soft) !important;
}
.page-lookup-v41 .badge-status{
  background:var(--hs-primary-soft) !important;
  color:var(--hs-primary) !important;
}
.page-lookup-v41 .badge-status.waiting{background:var(--hs-gold-soft) !important;color:var(--hs-gold-deep) !important;}
.page-lookup-v41 .badge-status.cancelled{background:#eceae4 !important;color:#6d756f !important;}
.page-lookup-v41 .info dt{color:var(--hs-muted) !important;}
.page-lookup-v41 .secondary{
  border:1.5px solid rgba(11,74,56,.30) !important;
  color:var(--hs-primary) !important;
  border-radius:12px !important;
}
.page-lookup-v41 .btn,.page-lookup-v41 .danger{border-radius:12px !important;}

/* ── 회원가입 (signup, .auth-card) ───────────────────────────── */
.auth-wrap{max-width:580px !important;}
.auth-card{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:22px !important;
  box-shadow:var(--hs-shadow-soft) !important;
  padding:clamp(28px,4vw,40px) !important;
}
.auth-title{
  font-size:clamp(30px,3.6vw,38px) !important;
  font-weight:900 !important;
  letter-spacing:-.045em !important;
}
.auth-card .btn{border-radius:14px !important;min-height:54px !important;}
.auth-card .btn-primary{
  background:linear-gradient(180deg,#0e5a44,#083a2c) !important;
  border:0 !important;
  box-shadow:0 12px 26px rgba(8,58,44,.25) !important;
}

/* ── 아이디·비밀번호 찾기 (recovery) ─────────────────────────── */
.page-recovery-v44 .wrap > .card{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:24px !important;
  box-shadow:var(--hs-shadow-soft) !important;
}
.page-recovery-v44 .tab{
  border:1.5px solid rgba(13,43,35,.16) !important;
  background:#fff !important;
  color:var(--hs-text) !important;
  border-radius:12px !important;
  transition:background .15s ease,color .15s ease;
}
.page-recovery-v44 .tab.active{
  background:var(--hs-primary) !important;
  color:#fff !important;
  border-color:var(--hs-primary) !important;
  box-shadow:0 8px 18px rgba(11,74,56,.22);
}
.page-recovery-v44 .btn{border-radius:12px !important;}
.page-recovery-v44 .btn-primary{
  background:linear-gradient(180deg,#0e5a44,#083a2c) !important;
  border-color:transparent !important;
}
.page-recovery-v44 .sub-option{
  background:var(--hs-gold-soft) !important;
  border:1px solid rgba(143,115,56,.25) !important;
}

/* ── 마이페이지 ──────────────────────────────────────────────── */
.page-mypage-v41 .section-card{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:20px !important;
}

/* ── 정책/안내 페이지 보더 정리 ──────────────────────────────── */
.policy-page .card,.policy-page .panel{
  border-color:rgba(13,43,35,.10) !important;
  border-radius:20px !important;
}

/* ==================================================================
   v45 — 럭셔리 호텔 리뉴얼 레이어 (시그니엘·조선팰리스·신라 문법)
   풀스크린 히어로 + 슬림 예약바 + 커스텀 2개월 달력 + 에디토리얼 섹션
   ================================================================== */

/* ── 홈 헤더: 히어로 위 투명 → 스크롤 시 크림 솔리드 ──────────── */
.page-home-v45 .site-header{
  position:fixed !important;
  width:100%;
  background:transparent !important;
  border-bottom:1px solid rgba(255,255,255,.14) !important;
  backdrop-filter:none !important;
  transition:background .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.page-home-v45 .site-header:not(.is-scrolled) .brand-title,
.page-home-v45 .site-header:not(.is-scrolled) .nav-links > a{color:#fdfbf4 !important;}
.page-home-v45 .site-header:not(.is-scrolled) .brand-text span{color:rgba(253,251,244,.66) !important;}
.page-home-v45 .site-header:not(.is-scrolled) .nav-links > a:hover,
.page-home-v45 .site-header:not(.is-scrolled) .nav-links > a.active{
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
}
.page-home-v45 .site-header.is-scrolled{
  background:rgba(248,245,238,.94) !important;
  border-bottom:1px solid rgba(13,43,35,.10) !important;
  backdrop-filter:saturate(1.1) blur(14px) !important;
}
.page-home-v45 .site-header .nav-links > a.nav-cta{color:#fff !important;}

/* ── 풀스크린 히어로 ──────────────────────────────────────────── */
.hv-hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:center;
  background:var(--hs-dark);
  overflow:hidden;
}
.hv-hero-media{position:absolute;inset:0;}
.hv-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 40%;opacity:.92;}
.hv-hero-media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(7,30,24,.55) 0%, rgba(7,30,24,.10) 32%, rgba(7,30,24,.16) 62%, rgba(7,30,24,.78) 100%),
    linear-gradient(78deg, rgba(7,30,24,.62) 0%, rgba(7,30,24,.28) 42%, rgba(7,30,24,.05) 75%);
}
.hv-hero-content{position:relative;z-index:2;padding-bottom:120px;}
.hv-eyebrow{
  margin:0 0 16px;
  font-size:12.5px;
  font-weight:800;
  letter-spacing:.30em;
  text-transform:uppercase;
  color:var(--hs-gold-deep);
}
.hv-eyebrow.gold{color:#d9c08c;}
.hv-hero-content .hv-eyebrow{color:#d9c08c;}
.hv-hero h1{
  margin:0 0 18px;
  font-size:clamp(40px,5vw,76px);
  font-weight:900;
  letter-spacing:-.04em;
  line-height:1.14;
  color:#fdfbf4;
  text-shadow:0 4px 34px rgba(0,0,0,.30);
}
.hv-hero-lead{
  margin:0;
  font-size:clamp(16px,1.6vw,21px);
  color:rgba(250,247,238,.90);
  font-weight:500;
  letter-spacing:-.01em;
}
.hv-scroll-cue{
  position:absolute;
  left:50%;bottom:18px;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  font-size:10px;letter-spacing:.34em;color:rgba(253,251,244,.62);
  z-index:2;
}
.hv-scroll-cue span{
  width:1px;height:34px;
  background:linear-gradient(180deg, rgba(253,251,244,.0), rgba(253,251,244,.75));
  animation:hvCue 2.2s ease-in-out infinite;
}
@keyframes hvCue{0%,100%{transform:scaleY(.45);opacity:.4}50%{transform:scaleY(1);opacity:1}}

/* ── 슬림 예약바 ──────────────────────────────────────────────── */
.hv-bar-wrap{position:absolute;left:0;right:0;bottom:74px;z-index:5;}
.hv-bar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:26px;
  align-items:end;
  padding:20px 26px 22px;
  border-radius:18px;
  background:rgba(253,252,248,.96);
  border:1px solid rgba(13,43,35,.08);
  box-shadow:0 30px 70px rgba(4,24,18,.35);
  backdrop-filter:blur(10px);
}
.hv-bar-label{
  display:block;
  margin-bottom:8px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:var(--hs-gold-deep);
}
.hv-seg{display:inline-flex;gap:4px;background:#efebe0;border-radius:12px;padding:4px;}
.hv-seg-btn{
  border:0;background:transparent;cursor:pointer;
  min-height:42px;padding:0 20px;border-radius:9px;
  font-family:inherit;font-size:15px;font-weight:800;color:#51625a;
  transition:background .15s ease,color .15s ease;
}
.hv-seg-btn.active{background:var(--hs-primary);color:#fff;box-shadow:0 5px 12px rgba(11,74,56,.26);}
.hv-date-trigger{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  width:100%;min-height:50px;
  border:1.5px solid rgba(13,43,35,.16);
  border-radius:13px;
  background:#fff;
  padding:0 16px;
  font-family:inherit;font-size:16px;font-weight:750;color:#8a948d;
  cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.hv-date-trigger:hover{border-color:var(--hs-primary);}
.hv-date-trigger svg{color:var(--hs-gold-deep);flex-shrink:0;}
.hv-date-trigger .has-value,
.hv-date-trigger span.has-value{color:var(--hs-text);}
.hv-bar-submit{
  border:0;cursor:pointer;
  min-height:50px;padding:0 36px;border-radius:13px;
  background:linear-gradient(180deg,#0e5a44,#083a2c);
  color:#fff;font-family:inherit;font-size:16px;font-weight:900;
  box-shadow:0 14px 30px rgba(8,58,44,.34);
  transition:transform .15s ease, filter .15s ease;
}
.hv-bar-submit:hover{transform:translateY(-1px);filter:brightness(1.08);}
@media (max-width:880px){
  .hv-bar{grid-template-columns:1fr;gap:14px;padding:16px 16px 18px;}
  .hv-bar-wrap{bottom:54px;}
  .hv-bar-submit{width:100%;}
  .hv-scroll-cue{display:none;}
  .hv-hero-content{padding-bottom:300px;}
}

/* ── 커스텀 2개월 달력 팝오버 ─────────────────────────────────── */
.hs-cal{
  position:absolute;
  z-index:1200;
  width:min(680px, calc(100vw - 24px));
  background:#fffefb;
  border:1px solid rgba(13,43,35,.12);
  border-radius:18px;
  box-shadow:0 30px 80px rgba(4,24,18,.30);
  padding:18px 18px 14px;
  font-family:'Pretendard',system-ui,sans-serif;
  color:var(--hs-text);
}
.hs-cal-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:10px;
}
.hs-cal-head-label{font-size:13.5px;font-weight:800;color:var(--hs-muted);letter-spacing:.02em;}
.hs-cal-nav{
  width:38px;height:38px;border-radius:11px;
  border:1.5px solid rgba(13,43,35,.16);
  background:#fff;color:var(--hs-text);
  font-size:16px;cursor:pointer;
  transition:background .15s ease,border-color .15s ease,opacity .15s ease;
}
.hs-cal-nav:hover:not(:disabled){border-color:var(--hs-primary);color:var(--hs-primary);}
.hs-cal-nav:disabled{opacity:.32;cursor:not-allowed;}
.hs-cal-months{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.hs-cal-month-title{
  text-align:center;
  font-size:15px;font-weight:900;letter-spacing:-.02em;
  margin-bottom:10px;
}
.hs-cal-weekdays{
  display:grid;grid-template-columns:repeat(7,1fr);
  margin-bottom:4px;
}
.hs-cal-weekdays span{
  text-align:center;font-size:11.5px;font-weight:800;color:#8a948d;padding:4px 0;
}
.hs-cal-weekdays .sun{color:#b25b50;}
.hs-cal-weekdays .sat{color:#3a5d83;}
.hs-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:2px;}
.hs-cal-empty{aspect-ratio:1/1;}
.hs-cal-day{
  position:relative;
  aspect-ratio:1/1;
  border:0;background:transparent;
  font-family:inherit;font-size:14px;font-weight:700;color:var(--hs-text);
  cursor:pointer;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  border-radius:50%;
  transition:background .12s ease,color .12s ease;
}
.hs-cal-day:hover:not(.disabled):not(.start):not(.end){background:#eef4f0;}
.hs-cal-day.sun span{color:#b25b50;}
.hs-cal-day.sat span{color:#3a5d83;}
.hs-cal-day.disabled{color:#c3c9c3;cursor:not-allowed;}
.hs-cal-day.disabled span{color:#c3c9c3;}
.hs-cal-day.today{box-shadow:inset 0 0 0 1.5px var(--hs-primary);}
.hs-cal-today-tag{
  position:absolute;bottom:4px;
  font-style:normal;font-size:8.5px;font-weight:900;color:var(--hs-primary);letter-spacing:.04em;
}
.hs-cal-day.mid{background:#e7f1ea;border-radius:0;}
.hs-cal-day.start,.hs-cal-day.end{
  background:var(--hs-primary);
  color:#fff;
}
.hs-cal-day.start span,.hs-cal-day.end span{color:#fff;}
.hs-cal-day.start .hs-cal-today-tag,.hs-cal-day.end .hs-cal-today-tag{color:#cfe7da;}
.hs-cal-day.start{border-radius:50% 0 0 50%;}
.hs-cal-day.end{border-radius:0 50% 50% 0;}
.hs-cal-day.start.end{border-radius:50%;}
.hs-cal-foot{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-top:12px;padding-top:12px;
  border-top:1px solid rgba(13,43,35,.10);
}
.hs-cal-foot-text{font-size:14px;font-weight:850;color:var(--hs-primary);}
.hs-cal-foot-actions{display:inline-flex;gap:8px;}
.hs-cal-reset,.hs-cal-close{
  border:1.5px solid rgba(13,43,35,.16);
  background:#fff;color:var(--hs-text);
  min-height:38px;padding:0 16px;border-radius:10px;
  font-family:inherit;font-size:13.5px;font-weight:800;cursor:pointer;
}
.hs-cal-close{background:var(--hs-primary);border-color:var(--hs-primary);color:#fff;}
@media (max-width:720px){
  .hs-cal{width:min(420px, calc(100vw - 16px));max-height:80vh;overflow:auto;}
  .hs-cal-months{grid-template-columns:1fr;}
}

/* ── 에디토리얼 섹션 공통 ─────────────────────────────────────── */
.hv-section{padding:clamp(72px,9vw,130px) 0;}
.hv-section h2{
  margin:0 0 22px;
  font-size:clamp(30px,3.4vw,48px);
  font-weight:900;
  letter-spacing:-.045em;
  line-height:1.22;
  color:var(--hs-text);
}
.hv-copy{
  margin:0;
  font-size:clamp(15.5px,1.35vw,18px);
  line-height:1.95;
  color:#47584f;
  word-break:keep-all;
}
.hv-copy.light{color:rgba(243,239,228,.82);}
.hv-link{
  display:inline-flex;align-items:center;gap:8px;
  margin-top:26px;
  font-size:15px;font-weight:850;color:var(--hs-primary);
  text-decoration:none;
  border-bottom:1.5px solid rgba(11,74,56,.30);
  padding-bottom:4px;
  transition:color .15s ease,border-color .15s ease;
}
.hv-link:hover{color:var(--hs-gold-deep);border-color:var(--hs-gold-deep);}
.hv-link i{font-style:normal;}

.hv-intro{background:var(--hs-bg);}
.hv-intro-inner{max-width:760px;text-align:center;margin:0 auto;}
.hv-intro-inner .hv-eyebrow{margin-bottom:20px;}
.hv-intro .hv-link{margin-top:30px;}

/* 대표 공간 (이미지+카피 교차) */
.hv-feature{background:#f2ede2;padding-top:clamp(72px,9vw,120px);}
.hv-feature-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
  gap:clamp(32px,5vw,72px);
  align-items:center;
}
.hv-feature-media{margin:0;border-radius:22px;overflow:hidden;box-shadow:var(--hs-shadow);}
.hv-feature-media img{width:100%;height:100%;min-height:420px;object-fit:cover;display:block;transition:transform .5s ease;}
.hv-feature-media:hover img{transform:scale(1.025);}
.hv-feature-meta{margin:28px 0 0;display:grid;gap:14px;}
.hv-feature-meta > div{
  display:grid;grid-template-columns:120px 1fr;gap:14px;
  padding-bottom:13px;
  border-bottom:1px solid rgba(13,43,35,.12);
}
.hv-feature-meta dt{font-size:13.5px;font-weight:800;color:var(--hs-gold-deep);letter-spacing:.04em;}
.hv-feature-meta dd{margin:0;font-size:15px;font-weight:700;color:var(--hs-text);}
.hv-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px;}
.hv-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:50px;padding:0 26px;border-radius:13px;
  font-size:15px;font-weight:850;text-decoration:none;
  transition:transform .15s ease,filter .15s ease,background .15s ease,color .15s ease;
}
.hv-btn:hover{transform:translateY(-1px);}
.hv-btn-primary{
  background:linear-gradient(180deg,#0e5a44,#083a2c);
  color:#fff;
  box-shadow:0 12px 26px rgba(8,58,44,.25);
}
.hv-btn-ghost{
  background:#fff;
  border:1.5px solid rgba(11,74,56,.34);
  color:var(--hs-primary);
}
.hv-btn-gold{
  background:linear-gradient(180deg,#c5a263,#a98843);
  color:#21180a;
  box-shadow:0 12px 26px rgba(143,115,56,.30);
}
.hv-btn-outline-light{
  border:1.5px solid rgba(243,239,228,.40);
  color:#f3efe4;
  background:transparent;
}
.hv-btn-outline-light:hover{background:rgba(243,239,228,.10);}

/* 공간 그리드 */
.hv-spaces{background:var(--hs-bg);}
.hv-section-head{text-align:center;margin-bottom:clamp(36px,5vw,56px);}
.hv-space-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2.4vw,30px);
}
.hv-space-card{
  display:block;
  text-decoration:none;
  color:inherit;
  background:#fffefb;
  border:1px solid rgba(13,43,35,.10);
  border-radius:20px;
  overflow:hidden;
  box-shadow:var(--hs-shadow-soft);
  transition:transform .22s ease, box-shadow .22s ease;
}
.hv-space-card:hover{transform:translateY(-6px);box-shadow:var(--hs-shadow);}
.hv-space-card figure{margin:0;height:230px;overflow:hidden;}
.hv-space-card figure img{width:100%;height:100%;object-fit:cover;transition:transform .45s ease;}
.hv-space-card:hover figure img{transform:scale(1.045);}
.hv-space-body{padding:24px 24px 26px;}
.hv-space-kicker{
  margin:0 0 8px;
  font-size:11px;font-weight:800;letter-spacing:.26em;color:var(--hs-gold-deep);
}
.hv-space-body h3{
  margin:0 0 10px;
  font-size:21px;font-weight:900;letter-spacing:-.03em;color:var(--hs-text);
}
.hv-space-body p{margin:0;font-size:14.5px;line-height:1.75;color:#52645b;}
.hv-space-body .hv-link{margin-top:16px;font-size:14px;}

/* 다크 밴드 */
.hv-band{
  background:
    radial-gradient(circle at 88% -20%, rgba(185,151,90,.16), transparent 44%),
    var(--hs-dark);
  padding:clamp(72px,9vw,120px) 0;
}
.hv-band h2{color:#fdfbf4;margin:0 0 18px;font-size:clamp(28px,3vw,42px);font-weight:900;letter-spacing:-.04em;}
.hv-band-inner{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:clamp(36px,5vw,80px);
  align-items:start;
}
.hv-band-meta{margin:0;display:grid;gap:0;border-top:1px solid rgba(243,239,228,.16);}
.hv-band-meta > div{
  display:grid;grid-template-columns:150px 1fr;gap:14px;
  padding:18px 0;
  border-bottom:1px solid rgba(243,239,228,.16);
}
.hv-band-meta dt{font-size:13px;font-weight:800;color:#d9c08c;letter-spacing:.06em;}
.hv-band-meta dd{margin:0;font-size:16.5px;font-weight:800;color:#fdfbf4;line-height:1.5;}
.hv-band-meta dd small{font-size:13px;font-weight:600;color:rgba(243,239,228,.66);}

@media (max-width:980px){
  .hv-feature-grid,.hv-band-inner{grid-template-columns:1fr;}
  .hv-feature-media img{min-height:300px;}
  .hv-space-grid{grid-template-columns:1fr;}
  .hv-space-card figure{height:200px;}
}

/* ── v45 서브페이지 타이포 정렬 (홈과 동일한 디스플레이 스케일) ── */
.v9-sub-hero h1,.story-hero-copy h1,.page-hero h1{
  font-size:clamp(36px,4.6vw,64px) !important;
  line-height:1.16 !important;
}
.v9-kicker,.v9-small-label,.story-kicker{
  letter-spacing:.28em !important;
  font-size:12px !important;
}
.v9-section-head h2{letter-spacing:-.045em !important;}

/* ==================================================================
   v46 — 모션 시스템 + 예약 달력 심플화 + 서브페이지 전면 개편
   ================================================================== */

/* ── 1. 스크롤 리빌 (design-system.js initScrollReveal과 한 쌍) ── */
.hs-reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
  will-change:opacity,transform;
}
.hs-reveal.in-view{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .hs-reveal{opacity:1 !important;transform:none !important;transition:none !important;}
}

/* ── 2. 호버 마이크로 인터랙션 ───────────────────────────────── */
.btn,.hv-btn,.qb-submit,.hv-bar-submit,.btn-login,.tab,.secondary,.danger{
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, background .18s ease, color .18s ease !important;
}
.btn:hover,.hv-btn:hover,.hv-bar-submit:hover,.btn-login:hover{
  transform:translateY(-2px) !important;
}
.btn-primary:hover,.hv-btn-primary:hover,.hv-bar-submit:hover,
.hv-btn-gold:hover,.btn-login:hover{
  box-shadow:0 18px 38px rgba(8,58,44,.36) !important;
}
.btn:active,.hv-btn:active,.hv-bar-submit:active,.btn-login:active{
  transform:translateY(0) scale(.985) !important;
}
/* 링크 화살표 넛지 */
.hv-link i,.hv-link span[aria-hidden]{display:inline-block;transition:transform .2s ease;}
.hv-link:hover i,.hv-link:hover span[aria-hidden]{transform:translateX(5px);}
/* 내비게이션 호버 */
.site-header .nav-links > a{position:relative;}
.site-header .nav-links > a:not(.nav-cta)::after{
  content:"";
  position:absolute;left:12px;right:12px;bottom:5px;
  height:1.5px;background:currentColor;
  transform:scaleX(0);transform-origin:left;
  transition:transform .22s ease;
}
.site-header .nav-links > a:not(.nav-cta):hover::after{transform:scaleX(1);}
/* 카드 호버 (이미지 줌 + 리프트) — 전 페이지 공통 */
.menu-card,.content-card,.guide-space-card,.v17-room-card{
  transition:transform .22s ease, box-shadow .22s ease !important;
}
.menu-card:hover,.content-card:hover,.guide-space-card:hover,.v17-room-card:hover{
  transform:translateY(-5px);
  box-shadow:var(--hs-shadow) !important;
}
.guide-space-card img,.menu-card img,.v17-room-card img{transition:transform .5s ease;}
.guide-space-card:hover img,.menu-card:hover img,.v17-room-card:hover img{transform:scale(1.03);}

/* ── 3. 예약 달력 심플화 ─────────────────────────────────────── */
/* 제목·설명 과대 → 컴팩트하게 */
.page-reservation-v42 .booking-calendar-head{align-items:center !important;}
.page-reservation-v42 .booking-calendar-head h3{
  font-size:clamp(20px,2vw,26px) !important;
  margin:6px 0 4px !important;
  letter-spacing:-.03em !important;
}
.page-reservation-v42 .booking-calendar-head .badge{display:none !important;}
.page-reservation-v42 #bookingCalendarDesc{
  font-size:13.5px !important;
  margin:0 !important;
  color:var(--hs-muted) !important;
}
/* 월 이동 컨트롤: 텍스트 버튼 → 컴팩트 아이콘 버튼 */
.page-reservation-v42 .booking-calendar-controls{gap:10px !important;}
.page-reservation-v42 .booking-calendar-controls .btn{
  min-height:40px !important;
  min-width:40px !important;
  padding:0 12px !important;
  border-radius:11px !important;
  font-size:15px !important;
  background:#fff !important;
  border:1.5px solid rgba(13,43,35,.16) !important;
  color:var(--hs-text) !important;
  box-shadow:none !important;
}
.page-reservation-v42 .booking-calendar-controls .btn:hover{
  border-color:var(--hs-primary) !important;
  color:var(--hs-primary) !important;
}
.page-reservation-v42 .booking-calendar-controls strong{
  font-size:16px !important;
  letter-spacing:-.02em;
}
/* 범례: 작고 조용하게 */
.page-reservation-v42 .booking-calendar-legend{
  gap:12px !important;
  font-size:12px !important;
  opacity:.85;
}
.page-reservation-v42 .booking-calendar-legend span{font-weight:700 !important;}
/* 상태 안내 박스: 보더 최소화 */
.page-reservation-v42 .booking-calendar-state{
  padding:10px 14px !important;
  font-size:13px !important;
  border-radius:12px !important;
}
/* 날짜 셀: 여백·보더 정리 */
.page-reservation-v42 .booking-day{
  border-radius:12px !important;
  border-color:rgba(13,43,35,.10) !important;
}
.page-reservation-v42 .booking-day .day-num{font-weight:800 !important;}
/* 연수원 모드: 예약 텍스트 태그 숨기고 점 표시로 단순화,
   날짜 상세·범례도 숨김 (입실/퇴실 선택에 집중) */
body.hs-dorm-mode .booking-day .tag{display:flex !important;}
body.hs-dorm-mode .booking-day.has-booking::after{
  content:"";
  display:block;
  width:7px;height:7px;border-radius:50%;
  background:var(--hs-gold);
  margin:4px auto 0;
}
body.hs-dorm-mode .booking-calendar-legend{display:none !important;}
body.hs-dorm-mode .booking-day-detail{display:none !important;}
body.hs-dorm-mode #bookingCalendarDesc{display:none !important;}
/* 오늘 라벨: 연수원 모드에선 링만 (텍스트 배지 제거) */
body.hs-dorm-mode .booking-day.today .day-num::after{display:none !important;}

/* ── 4. 서브페이지 전면 개편 ─────────────────────────────────── */
/* 공통: 섹션 리듬·아이브로우 통일 */
.story-section,.guide-quick-section,.guide-space-section,.guide-policy-section{
  padding:clamp(64px,8vw,110px) 0 !important;
}
.story-section-head h2,.guide-quick-section h2,
.guide-space-section h2,.guide-policy-section h2{
  font-size:clamp(28px,3.2vw,44px) !important;
  font-weight:900 !important;
  letter-spacing:-.045em !important;
}
/* 서브 히어로: 다크 오버레이 톤 통일 */
.v9-sub-hero,.story-hero{position:relative;}
.story-hero-copy h1,.v9-sub-hero h1{font-weight:900 !important;}

/* guide: 스텝 카드 */
.guide-step{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.10) !important;
  border-radius:18px !important;
  box-shadow:var(--hs-shadow-soft) !important;
  transition:transform .2s ease, box-shadow .2s ease;
}
.guide-step:hover{transform:translateY(-4px);box-shadow:var(--hs-shadow) !important;}

/* guide: 공간 카드 — 에디토리얼 행 느낌 */
.guide-space-card{
  border-radius:20px !important;
  border:1px solid rgba(13,43,35,.10) !important;
  background:#fffefb !important;
  overflow:hidden;
}
.guide-space-card h3{letter-spacing:-.03em !important;}

/* intro: 스토리 섹션 카피 호흡 */
.story-section p{line-height:1.95 !important;word-break:keep-all;}
.story-opening p{
  font-size:clamp(16px,1.5vw,19px) !important;
  max-width:760px;
}

/* cafe-group: 2단 그리드 카드 */
.section-grid-2{gap:clamp(20px,3vw,36px) !important;}
.section-grid-2 > *{
  border-radius:20px !important;
  overflow:hidden;
}

/* floor: 캐러셀 컨트롤 정돈 */
.v19-carousel-btn{
  border-radius:10px !important;
  border:1.5px solid rgba(13,43,35,.16) !important;
  background:#fff !important;
  transition:border-color .15s ease,color .15s ease,transform .15s ease;
}
.v19-carousel-btn:hover{border-color:var(--hs-primary) !important;color:var(--hs-primary) !important;}

/* lookup·signup: 카드 진입 모션은 hs-reveal로 처리, 호버 보강 */
.page-lookup-v41 .reservation-item,.auth-card{
  transition:transform .2s ease, box-shadow .2s ease !important;
}

/* 헤더 그림자 부드럽게 */
.site-header{transition:background .25s ease, box-shadow .25s ease, border-color .25s ease;}
.site-header.is-scrolled{box-shadow:0 10px 30px rgba(4,24,18,.10);}

/* ==================================================================
   v47 — 카드 과잉 제거 (레퍼런스: royal.sanhait.com 예약 입력 구조)
   원칙: 박스 안의 박스 금지. 콘텐츠는 배경 위에 열린 형태로,
   구분은 얇은 라인으로. 강조 카드는 "예약 요약" 단 하나만.
   ================================================================== */

/* ── 예약 페이지: 선형 오픈 폼 구조 ──────────────────────────── */
/* 큰 흰색 컨테이너 카드 제거 → 폼이 페이지 배경 위에 직접 */
.page-reservation-v42 .page > .container > .card,
.page-reservation-v42 main .card{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  border-radius:0 !important;
}
/* 다크 히어로 카드 → 열린 페이지 타이틀 + 하단 구분선 */
.page-reservation-v42 .hero-card{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:8px 0 30px !important;
  border-bottom:1px solid rgba(13,43,35,.16) !important;
  margin-bottom:34px !important;
}
.page-reservation-v42 .hero-copy h1{
  color:var(--hs-text) !important;
  font-size:clamp(32px,3.6vw,46px) !important;
}
.page-reservation-v42 .hero-copy h1::before{
  content:"RESERVATION";
  display:block;
  margin-bottom:12px;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.28em;
  color:var(--hs-gold-deep);
}
.page-reservation-v42 .hero-copy p{color:var(--hs-muted) !important;}
.page-reservation-v42 .price-card{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  text-align:right;
}
.page-reservation-v42 .price-card h3{
  color:var(--hs-gold-deep) !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.18em !important;
  margin:0 0 8px !important;
}
.page-reservation-v42 .price-card ul,
.page-reservation-v42 .price-card li{
  color:var(--hs-text) !important;
  font-weight:750;
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1.7;
}
/* 섹션 제목: 작고 명확하게 + 위 여백 */
.page-reservation-v42 main .card > h2{
  font-size:clamp(19px,1.8vw,23px) !important;
  letter-spacing:-.03em !important;
  margin:0 0 22px !important;
}
/* 예약구분: 박스 카드 → 슬림 필 세그먼트 */
.page-reservation-v42 .booking-type-card{
  background:#fff !important;
  border:1.5px solid rgba(13,43,35,.16) !important;
  border-radius:999px !important;
  box-shadow:none !important;
  padding:13px 22px !important;
  transition:background .15s ease,border-color .15s ease;
}
.page-reservation-v42 .booking-type-card.active,
.page-reservation-v42 .booking-type-card:has(input:checked){
  background:var(--hs-primary) !important;
  border-color:var(--hs-primary) !important;
  box-shadow:0 10px 22px rgba(11,74,56,.24) !important;
}
.page-reservation-v42 .booking-type-card.active span,
.page-reservation-v42 .booking-type-card:has(input:checked) span{color:#fff !important;}
/* 달력: 패널 박스 제거 → 열린 달력 (에어비앤비식) */
.page-reservation-v42 .reservation-calendar-panel{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:0 !important;
  border-radius:0 !important;
}
/* 우측: 요약 카드 단 하나만 강조 (로얄 '예약정보' 패턴) */
.page-reservation-v42 .selection-summary-card{
  background:#fffefb !important;
  border:1px solid rgba(13,43,35,.16) !important;
  border-radius:18px !important;
  box-shadow:var(--hs-shadow-soft) !important;
}
.page-reservation-v42 .reservation-step-side .dynamic-section{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:18px 0 0 !important;
  border-radius:0 !important;
}
/* 환불 동의·결제 요약: 박스 제거 → 상단 구분선 섹션 */
.page-reservation-v42 .refund-consent-card,
.page-reservation-v42 .summary-box{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  border-top:1px solid rgba(13,43,35,.16) !important;
  padding:28px 0 0 !important;
  margin-top:32px !important;
}
.page-reservation-v42 .refund-summary-list > *{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-left:2.5px solid var(--hs-gold) !important;
  border-radius:0 !important;
  padding:4px 0 4px 14px !important;
}
.page-reservation-v42 .checkline{
  background:transparent !important;
  border:none !important;
  border-radius:0 !important;
  padding:10px 0 !important;
}

/* ── 소개(intro) 페이지: 오픈 에디토리얼 ─────────────────────── */
/* 이름 의미 카드 → 라인 구분형 오픈 칼럼 */
.story-name-cards article,
.story-promise-grid article{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  border-top:1.5px solid rgba(13,43,35,.18) !important;
  padding:22px 6px 0 !important;
}
.story-name-cards article strong{
  color:var(--hs-gold-deep) !important;
  font-size:19px !important;
  letter-spacing:-.02em;
}
.story-promise-grid article h3{letter-spacing:-.03em !important;}
.story-promise-icon{
  background:transparent !important;
  border:none !important;
}
.story-number{color:var(--hs-gold-deep) !important;font-weight:800 !important;}
/* CTA: 크림 카드 → 풀블리드 다크 밴드 (홈 hv-band와 동일 언어) */
.story-cta-section{
  background:
    radial-gradient(circle at 88% -20%, rgba(185,151,90,.16), transparent 44%),
    var(--hs-dark) !important;
  padding:clamp(64px,8vw,110px) 0 !important;
}
.story-cta-section .story-cta-card{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
}
.story-cta-section h2{color:#fdfbf4 !important;}
.story-cta-section .story-eyebrow{color:#d9c08c !important;}
.story-cta-section .btn-secondary{
  background:rgba(255,255,255,.94) !important;
  border-color:transparent !important;
}

/* ── v47.1 헤더 CTA 가시성: 투명 헤더 위에서는 화이트 솔리드 ── */
.page-home-v45 .site-header:not(.is-scrolled) .nav-links > a.nav-cta,
.page-home-v45 .site-header:not(.is-scrolled) .mini-link-btn.primary,
.page-home-v45 .site-header:not(.is-scrolled) .auth-mini-actions .mini-link-btn:first-child:last-child{
  background:#fdfbf4 !important;
  color:var(--hs-primary-dark) !important;
  border-color:transparent !important;
  box-shadow:0 10px 26px rgba(0,0,0,.28) !important;
}
.page-home-v45 .site-header:not(.is-scrolled) .nav-links > a.nav-cta:hover{
  background:#fff !important;
  color:var(--hs-primary) !important;
  filter:none !important;
}
.page-home-v45 .site-header:not(.is-scrolled) .mini-link-btn{
  background:rgba(253,251,244,.16) !important;
  border-color:rgba(253,251,244,.45) !important;
  color:#fdfbf4 !important;
}
.page-home-v45 .site-header:not(.is-scrolled) .mini-link-btn.primary{color:var(--hs-primary-dark) !important;}

/* ── v47.1 페이지별 다크밴드 (홈 hv-band와 동일 언어) ─────────── */
/* 시설안내(floor): 하단 CTA → 풀블리드 다크밴드 */
.v9-bottom-cta{
  background:
    radial-gradient(circle at 88% -20%, rgba(185,151,90,.16), transparent 44%),
    var(--hs-dark) !important;
  border:none !important;
  padding:clamp(64px,8vw,110px) 0 !important;
}
.v9-bottom-cta-inner h2{
  color:#fdfbf4 !important;
  font-size:clamp(26px,2.8vw,38px) !important;
  font-weight:900 !important;
  letter-spacing:-.04em !important;
}
.v9-bottom-cta-inner h2::before{
  content:"FACILITY";
  display:block;
  margin-bottom:14px;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.28em;
  color:#d9c08c;
}
.v9-bottom-cta-inner p{color:rgba(243,239,228,.80) !important;}
/* 밴드 안의 잔여 카드 배경 제거 — 열린 다크밴드로 */
.v9-bottom-cta-inner{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  display:grid;
  grid-template-columns:minmax(0,1.4fr) auto;
  gap:32px;
  align-items:center;
}
@media (max-width:880px){.v9-bottom-cta-inner{grid-template-columns:1fr;}}
.v9-bottom-cta .btn-primary{
  background:linear-gradient(180deg,#c5a263,#a98843) !important;
  color:#21180a !important;
  box-shadow:0 12px 26px rgba(143,115,56,.30) !important;
  min-height:52px !important;
  padding:0 30px !important;
}
.v9-bottom-cta .btn-secondary{background:rgba(255,255,255,.94) !important;border-color:transparent !important;}
/* 카페·식당: 문의 카드 → 다크밴드 */
.contact-card{
  background:
    radial-gradient(circle at 88% -20%, rgba(185,151,90,.16), transparent 44%),
    var(--hs-dark) !important;
  border:none !important;
  border-radius:24px !important;
  box-shadow:var(--hs-shadow) !important;
  padding:clamp(44px,5vw,72px) clamp(24px,4vw,56px) !important;
  text-align:center;
}
.contact-card h2{
  color:#fdfbf4 !important;
  font-size:clamp(24px,2.6vw,34px) !important;
  letter-spacing:-.04em !important;
}
.contact-card h2::before{
  content:"GROUP RESERVATION";
  display:block;
  margin-bottom:14px;
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.28em;
  color:#d9c08c;
}
.contact-card p{color:rgba(243,239,228,.80) !important;}
.contact-card .btn-primary{
  background:linear-gradient(180deg,#c5a263,#a98843) !important;
  color:#21180a !important;
  box-shadow:0 12px 26px rgba(143,115,56,.30) !important;
}

/* ── v47.1 예약 페이지 STEP 흐름 구조 ────────────────────────── */
/* 컨테이너 폭 축소: 시선 흐름 집중 */
.page-reservation-v42 .page .container{width:min(calc(100% - 32px),1080px) !important;}
/* JS 재배치에 맞춰 기존 order 해제 */
.page-reservation-v42 .booking-type-group{order:0 !important;}
.page-reservation-v42 .reservation-step-layout{order:0 !important;}
/* 중복 라벨·중복 제목 숨김 (STEP 헤더로 대체) */
.page-reservation-v42 main .card > h2{display:none !important;}
.page-reservation-v42 .booking-type-group > .field-label{display:none !important;}
/* STEP 헤더 */
.hs-step-head{
  grid-column:1 / -1;
  display:flex;
  align-items:baseline;
  gap:14px;
  flex-wrap:wrap;
  margin:38px 0 8px;
  padding-top:30px;
  border-top:1px solid rgba(13,43,35,.14);
}
.hs-step-head.first{margin-top:0;padding-top:0;border-top:none;}
.hs-step-no{
  font-size:13px;
  font-weight:900;
  color:var(--hs-gold-deep);
  letter-spacing:.1em;
}
.hs-step-tit{
  font-size:19.5px;
  font-weight:900;
  letter-spacing:-.03em;
  color:var(--hs-text);
}
.hs-step-sub{font-size:13.5px;color:var(--hs-muted);font-weight:600;}

/* ==================================================================
   v48 — 예약 텍스트 다이어트 + 요금 다크밴드 + 인트로 섹션 리듬
   ================================================================== */

/* ── 예약 페이지: 불필요·반복 텍스트 제거 ───────────────────── */
.page-reservation-v42 .hero-copy p{display:none !important;}            /* 히어로 보조문 */
.page-reservation-v42 .price-card{display:none !important;}             /* 요금 → 다크밴드로 이동 */
.page-reservation-v42 .booking-calendar-head h3{display:none !important;}/* STEP 02와 중복 */
.page-reservation-v42 #bookingCalendarDesc{display:none !important;}
.page-reservation-v42 #bookingCalendarState{display:none !important;}   /* 그리드 메시지와 중복 */
.page-reservation-v42 .field-help{display:none !important;}             /* 과한 입력 안내 */
.page-reservation-v42 #bookingSelectionSummary{display:none !important;}/* 선택일정 섹션 제거 */
.page-reservation-v42 .booking-calendar-head{margin-bottom:6px !important;}

/* ── 연수원 이용요금 다크밴드 ────────────────────────────────── */
.hs-price-band{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
  margin:34px 0 4px;
  padding:24px 30px;
  border-radius:18px;
  background:
    radial-gradient(circle at 90% -30%, rgba(185,151,90,.20), transparent 50%),
    linear-gradient(120deg,#0d3a2d 0%,#0a2c22 100%);
  box-shadow:var(--hs-shadow-soft);
}
body:not(.hs-dorm-mode) .hs-price-band{display:none;}
.hs-price-main{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;}
.hs-price-kicker{
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.22em;
  color:#d9c08c;
  text-transform:uppercase;
}
.hs-price-main strong{
  font-size:clamp(19px,2vw,24px);
  font-weight:900;
  letter-spacing:-.02em;
  color:#fdfbf4;
}
.hs-price-sub{font-size:13.5px;font-weight:650;color:rgba(243,239,228,.75);}
.hs-price-meta{display:flex;gap:10px;}
.hs-price-meta span{
  padding:8px 14px;
  border:1px solid rgba(243,239,228,.30);
  border-radius:999px;
  font-size:13px;
  font-weight:800;
  color:rgba(243,239,228,.92);
}

/* ── 예약자 정보: 입력 UX 재설계 ───────────────────────────────
   원칙(폼 UX 베스트프랙티스):
   ① 단일 컬럼 — 위에서 아래로 한 방향 입력 흐름 (좌우 시선 이동 제거)
   ② 라벨은 입력창 위, 굵고 명확하게 + 필수 항목 표시
   ③ 상태 가시성 — 기본/호버/포커스/입력완료가 즉시 구분
   ④ 충분한 터치 타깃(54px)과 16px 입력 글자                       */
.hs-form-narrow{
  grid-column:1 / -1;
  display:flex;
  flex-direction:column;
  gap:22px;
  max-width:560px;
  width:100%;
  margin-left:auto;
  margin-right:auto;
}
/* 라벨 */
.page-reservation-v42 .field-label{
  font-size:15px !important;
  font-weight:850 !important;
  color:var(--hs-text) !important;
  letter-spacing:-.01em;
}
.page-reservation-v42 .field:has(input[required]) .field-label::after,
.page-reservation-v42 .field:has(select[required]) .field-label::after{
  content:" *";
  color:#b2554a;
  font-weight:900;
}
/* 입력창 상태 시스템 */
.page-reservation-v42 .field input,
.page-reservation-v42 .field select,
.page-reservation-v42 .field textarea{
  min-height:54px;
  border:1.5px solid rgba(13,43,35,.18) !important;
  background:#fff !important;
  border-radius:13px !important;
  font-size:16px !important;
  font-weight:600;
  color:var(--hs-text) !important;
  padding:0 16px !important;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.page-reservation-v42 .field textarea{padding:14px 16px !important;}
.page-reservation-v42 .field input::placeholder,
.page-reservation-v42 .field textarea::placeholder{color:#a3aca6;font-weight:500;}
.page-reservation-v42 .field input:hover:not(:focus):not([readonly]),
.page-reservation-v42 .field select:hover:not(:focus),
.page-reservation-v42 .field textarea:hover:not(:focus){
  border-color:rgba(13,43,35,.40) !important;
}
.page-reservation-v42 .field input:focus,
.page-reservation-v42 .field select:focus,
.page-reservation-v42 .field textarea:focus{
  border-color:var(--hs-primary) !important;
  box-shadow:0 0 0 4px rgba(11,74,56,.12) !important;
  outline:none !important;
}
/* 입력 완료 상태: 테두리 톤 업 */
.page-reservation-v42 .field input:not(:placeholder-shown):not(:focus):not([readonly]){
  border-color:rgba(13,43,35,.34) !important;
}
.page-reservation-v42 .field input[readonly]{
  background:#f4f1e9 !important;
  color:var(--hs-muted) !important;
  cursor:default;
}
/* 동의 영역: 가독 폭 + 중앙 정렬 (예약자 정보와 시각 축 일치) */
.page-reservation-v42 .refund-consent-card{
  max-width:880px;
  margin-left:auto !important;
  margin-right:auto !important;
}
/* 예상 결제금액 + 최종 CTA: 결제 흐름의 종착점으로 우측 정렬 */
.page-reservation-v42 .summary-box,
.page-reservation-v42 .button-row-end{
  max-width:420px;
  margin-left:auto !important;
  margin-right:0 !important;
}
.page-reservation-v42 .summary-box{text-align:right;}
@media (max-width:760px){
  .page-reservation-v42 .summary-box{
    max-width:none;
    margin:24px 0 0 !important;
    text-align:left;
  }
}
/* 빈 날짜 상세 박스가 빈 알약 형태로 남지 않게 */
.page-reservation-v42 #bookingDayDetail:empty{display:none !important;}
/* 모바일 하단 고정 CTA는 풀폭 유지 */
@media (max-width:760px){
  .page-reservation-v42 .button-row-end{
    max-width:none;
    margin:0 -18px -8px !important;
  }
}

/* ==================================================================
   v49 — 프론트 퀵윈: 결제 CTA 확대·지연인증 안내·인원 스테퍼·모바일 힌트
   ================================================================== */

/* 최종 CTA 확대: 마지막 클릭의 무게감 */
.page-reservation-v42 #btnPay{
  min-height:58px !important;
  min-width:min(360px, 100%) !important;
  font-size:17px !important;
  border-radius:15px !important;
  letter-spacing:.01em;
}
.page-reservation-v42 .button-row-end{margin-top:10px !important;}

/* 지연 인증(비로그인) 안내: 제출 직전에만 로그인 요구함을 예고 */
body.hs-guest .button-row-end::before{
  content:"비회원도 일정과 요금을 확인할 수 있습니다 · 예약 완료에는 로그인이 필요해 제출 시 로그인 화면으로 이동합니다";
  display:block;
  width:100%;
  margin-bottom:10px;
  font-size:13px;
  font-weight:700;
  color:var(--hs-muted);
  text-align:right;
}
@media (max-width:760px){
  body.hs-guest .button-row-end::before{text-align:left;}
}

/* 숙박인원 스테퍼 */
.hs-stepper{
  display:flex;
  align-items:center;
  gap:10px;
}
.hs-stepper input{
  flex:0 0 96px;
  width:96px !important;
  text-align:center;
  font-weight:800 !important;
}
.hs-step-btn{
  width:46px;height:46px;
  flex-shrink:0;
  border:1.5px solid rgba(13,43,35,.20);
  border-radius:12px;
  background:#fff;
  color:var(--hs-text);
  font-size:20px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  transition:border-color .15s ease,color .15s ease,background .15s ease;
}
.hs-step-btn:hover:not(:disabled){
  border-color:var(--hs-primary);
  color:var(--hs-primary);
}
/* 한계치 도달 시 시각적 비활성 (롯데호텔 교훈) */
.hs-step-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
  background:#f1efe8;
}

/* 달력 가용성 신호 배지 (가능일 수 + 선택 완료 피드백) */
.hs-cal-signals{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:2px 0 12px;
}
.hs-avail-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 14px;
  border-radius:999px;
  background:var(--hs-primary-soft);
  border:1px solid rgba(11,74,56,.18);
  color:var(--hs-primary);
  font-size:13px;
  font-weight:800;
}
.hs-select-badge{
  display:inline-flex;
  align-items:center;
  padding:7px 14px;
  border-radius:999px;
  background:var(--hs-primary);
  color:#fff;
  font-size:13px;
  font-weight:850;
  box-shadow:0 8px 18px rgba(11,74,56,.22);
}

/* 모바일 달력: 가로 스크롤 발견성 힌트 */
@media (max-width:760px){
  .page-reservation-v42 .booking-calendar-scroll::before{
    content:"← 옆으로 밀어 모든 요일을 확인하세요";
    display:block;
    margin-bottom:8px;
    font-size:12px;
    font-weight:750;
    color:var(--hs-muted);
  }
}

/* ── intro: 섹션 리듬 — '이름에 담긴 의미'를 다크밴드로 ─────── */
.story-opening{
  background:var(--hs-bg) !important;
}
.story-split-section{
  background:
    radial-gradient(circle at 88% -20%, rgba(185,151,90,.16), transparent 44%),
    var(--hs-dark) !important;
  border:none !important;
}
.story-split-section .story-eyebrow{color:#d9c08c !important;}
.story-split-section h2{color:#fdfbf4 !important;}
.story-split-section p{color:rgba(243,239,228,.82) !important;}
.story-split-section .story-name-cards article{
  border-top:1.5px solid rgba(243,239,228,.22) !important;
}
.story-split-section .story-name-cards article strong{color:#e3cb96 !important;}
.story-split-section .story-name-cards article span{color:rgba(243,239,228,.80) !important;}
.story-promise-section{
  background:#fbf9f3 !important;
}
/* 운영방향 픽토그램 정리 (인트로 이름 칼럼 픽토그램은 제거됨) */
.story-promise-grid article .hs-picto{
  width:40px;height:40px;
  color:var(--hs-primary);
  margin-bottom:6px;
}
.story-promise-grid article .hs-picto svg{
  fill:none;stroke:currentColor;stroke-width:2.6;
  stroke-linecap:round;stroke-linejoin:round;
}

/* ── guide: 정보 카드 3종(변경/취소/예절)·스텝 카드 → 라인형 ── */
.guide-step,
.guide-policy-section .content-card,
.guide-policy-section .simple-card{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  border-top:1.5px solid rgba(13,43,35,.18) !important;
}
.guide-step:hover{transform:none;box-shadow:none !important;}

/* ── 5. 모바일 가로 오버플로우 수정 (그리드 블로우아웃) ─────────
   달력 grid(640px)가 부모 그리드 트랙을 밀어내며 페이지 가로 스크롤을
   유발하던 문제: 그리드 아이템 min-width:0 처리로 격리 */
.page-reservation-v42 .reservation-step-layout > *,
.page-reservation-v42 .reservation-step-calendar,
.page-reservation-v42 .reservation-calendar-panel,
.page-reservation-v42 .booking-calendar-scroll{
  min-width:0 !important;
  max-width:100% !important;
}
.page-reservation-v42 .booking-calendar-scroll{overflow-x:auto !important;}
body.page-reservation-v42{overflow-x:hidden !important;}


/* ======================================================================
   \uBBF8\uB2C8 \uB2EC\uB825 \uAC1C\uC120 (v43 \uB2EC\uB825 \uCD95\uC18C + \uD68C\uC758\uC2E4\uBCC4 \uC0C9\uC0C1 \uAD6C\uBD84 + \uC2DC\uC778\uC131 \uAC1C\uC120)
   ====================================================================== */
.page-reservation-v42 .booking-calendar-grid { gap: 6px !important; }
.page-reservation-v42 .booking-day {
  min-height: 64px !important;
  padding: 6px 6px 4px !important;
  border-radius: 10px !important;
  border: 1px solid #d7ddd2 !important;
  background: #ffffff !important;
}
.page-reservation-v42 .booking-day .day-num {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #2c3a2e !important;
}
/* \uC120\uD0DD \uBD88\uAC00(\uC9C0\uB098\uAC04 \uB0A0\uC9DC/\uBC94\uC704 \uBC16): \uD750\uB9BF\uD558\uAC8C */
.page-reservation-v42 .booking-day.out,
.page-reservation-v42 .booking-day.out-of-window {
  background: repeating-linear-gradient(135deg,#f3f4f1,#f3f4f1 6px,#eceee9 6px,#eceee9 12px) !important;
  border-color: #e2e5df !important;
  opacity: .55 !important;
}
.page-reservation-v42 .booking-day.out .day-num,
.page-reservation-v42 .booking-day.out-of-window .day-num { color: #9aa39a !important; }
/* \uC120\uD0DD \uAC00\uB2A5\uD55C \uB0A0\uC9DC hover */
.page-reservation-v42 .booking-day:not(.out):not(.out-of-window):hover {
  border-color: #0e5a44 !important;
  box-shadow: 0 2px 8px rgba(14,90,68,.15) !important;
}
/* \uC624\uB298 */
.page-reservation-v42 .booking-day.today {
  border-color: #0e5a44 !important;
  background: #f0f7f3 !important;
}
/* \uC120\uD0DD\ub41c \ub0a0\uc9dc: \uba85\ud655\ud558\uac8c \uac15\uc870 */
.page-reservation-v42 .booking-day.selected {
  border: 2px solid #0e5a44 !important;
  background: #e3f1ea !important;
  box-shadow: 0 0 0 2px rgba(14,90,68,.18) !important;
}
.page-reservation-v42 .booking-day.selected .day-num { color: #0e5a44 !important; }

/* \uc77c\uc815 \ud0dc\uadf8: \uc6d0 + \ud68c\uc758\uc2e4 \uc774\ub984\ub9cc */
.page-reservation-v42 .booking-day .day-events {
  display: flex !important; flex-direction: column !important; gap: 2px !important; margin-top: 3px !important;
}
.page-reservation-v42 .booking-day .tag {
  display: flex !important; align-items: center !important; gap: 4px !important;
  background: transparent !important; color: #3a463b !important;
  font-size: 10.5px !important; line-height: 1.25 !important; font-weight: 600 !important;
  padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 100% !important;
}
.page-reservation-v42 .booking-day .tag::before {
  content: "" !important; flex: 0 0 auto !important;
  width: 7px !important; height: 7px !important; border-radius: 50% !important;
  background: var(--room-dot, #6b8f7a) !important;
}
.page-reservation-v42 .booking-day .tag.more {
  color: #8a948a !important; font-weight: 700 !important;
}
.page-reservation-v42 .booking-day .tag.more::before { display: none !important; }
.page-reservation-v42 .booking-day .tag.wait { color: #8a6a1f !important; }

/* \uD68C\uC758\uC2E4\uBCC4 \uACE0\uC720 \uC0C9\uC0C1 10\uC885 */
.page-reservation-v42 .booking-day .tag.room-c0 { --room-dot: #2e7d52; }
.page-reservation-v42 .booking-day .tag.room-c1 { --room-dot: #2563b6; }
.page-reservation-v42 .booking-day .tag.room-c2 { --room-dot: #c0392b; }
.page-reservation-v42 .booking-day .tag.room-c3 { --room-dot: #8e44ad; }
.page-reservation-v42 .booking-day .tag.room-c4 { --room-dot: #d68910; }
.page-reservation-v42 .booking-day .tag.room-c5 { --room-dot: #16a085; }
.page-reservation-v42 .booking-day .tag.room-c6 { --room-dot: #c2185b; }
.page-reservation-v42 .booking-day .tag.room-c7 { --room-dot: #5d6d7e; }
.page-reservation-v42 .booking-day .tag.room-c8 { --room-dot: #7d6608; }
.page-reservation-v42 .booking-day .tag.room-c9 { --room-dot: #1f6f78; }

/* ===== room-button selection (replaces step-side dropdown) ===== */
.page-reservation-v42 .reservation-step-fields {
  display: block;
  margin-top: 20px;
}
.page-reservation-v42 .reservation-step-fields .dynamic-section {
  background: #ffffff;
  border: 1px solid #e4e2da;
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 6px 18px rgba(31, 41, 33, 0.06);
}
.page-reservation-v42 .reservation-step-fields .section-grid-side {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.page-reservation-v42 .reservation-step-fields .field.full {
  grid-column: 1 / -1;
}
.room-button-group {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 6px;
}
@media (max-width: 720px) {
  .room-button-group { grid-template-columns: 1fr; }
  .page-reservation-v42 .reservation-step-fields .section-grid-side { grid-template-columns: 1fr; }
}
.room-btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 14px 16px;
  border: 2px solid #d9d6cd;
  border-radius: 14px;
  background: #ffffff;
  cursor: pointer;
  transition: border-color .15s, box-shadow .15s, background .15s, transform .08s;
  font: inherit;
  color: #2c352d;
}
.room-btn:hover:not(:disabled) {
  border-color: #2e7d52;
  box-shadow: 0 4px 12px rgba(46, 125, 82, 0.16);
  transform: translateY(-1px);
}
.room-btn .room-btn-dot {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: var(--room-dot, #9aa0a6);
  box-shadow: 0 0 0 3px var(--room-dot-soft, rgba(154,160,166,0.18));
}
.room-btn .room-btn-name {
  flex: 1 1 auto;
  font-weight: 700;
  font-size: 14px;
  line-height: 1.3;
}
.room-btn .room-btn-status {
  flex: 0 0 auto;
  font-size: 11px;
  font-weight: 700;
  color: #2e7d52;
  background: #e9f4ee;
  padding: 3px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.room-btn.is-selected {
  border-color: #2e7d52;
  background: #eef7f1;
  box-shadow: 0 0 0 3px rgba(46, 125, 82, 0.18);
}
.room-btn.is-selected .room-btn-status {
  color: #ffffff;
  background: #2e7d52;
}
.room-btn:disabled,
.room-btn.is-disabled {
  cursor: not-allowed;
  opacity: 0.6;
  background: #f4f3ef;
  border-color: #e0ddd4;
}
.room-btn.is-disabled .room-btn-status {
  color: #b23b3b;
  background: #f7e7e7;
}
.room-btn.is-disabled .room-btn-dot {
  filter: grayscale(0.7);
}
.room-btn.room-c0 { --room-dot: #2e7d52; --room-dot-soft: rgba(46,125,82,0.2); }
.room-btn.room-c1 { --room-dot: #2563b6; --room-dot-soft: rgba(37,99,182,0.2); }
.room-btn.room-c2 { --room-dot: #c2185b; --room-dot-soft: rgba(194,24,91,0.2); }

/* ===== single-column flow: calendar on top, fields below ===== */
.page-reservation-v42 .reservation-step-layout {
  display: block !important;
  grid-template-columns: 1fr !important;
}
.page-reservation-v42 .reservation-step-calendar,
.page-reservation-v42 .reservation-step-fields {
  width: 100% !important;
  max-width: 100% !important;
}
.page-reservation-v42 .reservation-step-fields {
  margin-top: 22px;
}
.page-reservation-v42 .reservation-step-fields .section-grid-side {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px;
}
.page-reservation-v42 .reservation-step-fields .field.full {
  grid-column: 1 / -1 !important;
}

/* === v43: \uC2DC\uC778\uC131(contrast) \uAC1C\uC120 + \uD68C\uC758\uC2E4 \uAD8C\uD55C \uC7A0\uAE08 === */
body.page-reservation-v42 .booking-type-card.active,
body.page-reservation-v42 .booking-type-card:has(input:checked){
  background: var(--hs-primary) !important;
  border-color: var(--hs-primary-dark) !important;
  box-shadow: 0 10px 22px rgba(11,74,56,.28) !important;
}
body.page-reservation-v42 .booking-type-card.active span,
body.page-reservation-v42 .booking-type-card:has(input:checked) span{
  color: #ffffff !important;
}
body.page-reservation-v42 .booking-type-card.is-locked{
  opacity: .55 !important;
  cursor: not-allowed !important;
  filter: grayscale(.4);
}
body.page-reservation-v42 .booking-type-card.is-locked input{ cursor: not-allowed !important; }

/* v43 calendar contrast: frame the panel + strengthen cell separation */
body.page-reservation-v42 .reservation-calendar-panel{
  background: var(--hs-bg-deep) !important;
  border: 1px solid rgba(18,59,51,.18) !important;
  border-radius: 18px !important;
  padding: 18px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.5) !important;
}
body.page-reservation-v42 .booking-day{
  border: 1.5px solid rgba(18,59,51,.28) !important;
  background: #ffffff !important;
}
body.page-reservation-v42 .booking-day.empty{
  background: #f0ece1 !important;
  border-color: rgba(18,59,51,.12) !important;
}
body.page-reservation-v42 .booking-day.out-of-window{
  background: #e3ded2 !important;
  color: #7c857d !important;
  border-color: rgba(18,59,51,.14) !important;
}
body.page-reservation-v42 .booking-day.selected{
  border-color: var(--hs-primary) !important;
  background: #eef6f1 !important;
  box-shadow: 0 0 0 3px rgba(15,104,79,.30), 0 10px 24px rgba(0,40,27,.10) !important;
}

/* v43-fix: outspecify earlier light-green active chip rules */
body.page-reservation-v42 .booking-type-options .booking-type-card.active,
body.page-reservation-v42 .booking-type-options .booking-type-card:has(input[type="radio"]:checked){
  background: var(--hs-primary) !important;
  background-color: var(--hs-primary) !important;
  border-color: var(--hs-primary-dark) !important;
}
body.page-reservation-v42 .booking-type-options .booking-type-card.active span,
body.page-reservation-v42 .booking-type-options .booking-type-card:has(input[type="radio"]:checked) span{
  color: #ffffff !important;
}
body.page-reservation-v42 .reservation-calendar-panel .booking-day:not(.empty):not(.out-of-window){
  border: 1.5px solid rgba(18,59,51,.30) !important;
  background: #ffffff !important;
}

/* v43-fix2: literal-hex active chip to avoid var() edge cases */
html body.page-reservation-v42 .booking-type-options label.booking-type-card.active,
html body.page-reservation-v42 .booking-type-options label.booking-type-card:has(input[type="radio"]:checked){
  background-color: #0f684f !important;
  background-image: none !important;
  border-color: #0a4b3a !important;
}
html body.page-reservation-v42 .booking-type-options label.booking-type-card.active span,
html body.page-reservation-v42 .booking-type-options label.booking-type-card:has(input[type="radio"]:checked) span{
  color: #ffffff !important;
}

/* v43-fix3: class-based active chip (avoid :has invalidation bug) */
html body.page-reservation-v42 .booking-type-options label.booking-type-card.active{
  background-color: #0f684f !important;
  background-image: none !important;
  border-color: #0a4b3a !important;
}
html body.page-reservation-v42 .booking-type-options label.booking-type-card.active span{
  color: #ffffff !important;
}
html body.page-reservation-v42 .booking-type-options label.booking-type-card:not(.active){
  background-color: #ffffff !important;
}
html body.page-reservation-v42 .booking-type-options label.booking-type-card:not(.active) span{
  color: var(--hs-text) !important;
}

/* v43-fix4: ensure meeting lock note is visible */
html body.page-reservation-v42 #meetingLockNote{ display:block !important; visibility:visible !important; opacity:1 !important; }