:root {
  --cream:       #F9F5ED;
  --cream-alt:   #F2EDE1;
  --moss:        #737654;
  --moss-bg:     #6e704c;
  --brown:       hsl(35,33%,28%);
  --brown-dark:  hsl(35,33%,22%);
  --charcoal:    #3d3a30;
  --border:      #d6d0c0;
  --muted:       #8c8c72;
  --secondary:   #EDE9DE;
  --card:        #F9F5ED;
  --accred-bg:   #c9c8b6;
}

.bg-moss-light {
    background-color: hsla(36, 30.6%, 90.4%, 0.3);
}
.section-slim {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}
.section-slim .btn-primary-brand {
    background-color: #6a4a23;
    color: #f7f3ea;
    font-family: 'Lora', Georgia, serif;
    font-size: 11px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    padding: 0.7rem 1.8rem;
    border: none;
    border-radius: 0;
    display: inline-block;
    transition: opacity 0.25s;
    text-decoration: none;
}
.availablty p {line-height:1.8;}
.availablty h2 {font-size:clamp(1.3rem,3vw,1.8rem); letter-spacing:0.04em;}
.breakdown-row {
    display: flex;
    justify-content: space-between;
    font-size: 15px;
}
.breakdown-total {
    display: flex;
    justify-content: space-between;
    color: var(--charcoal);
    font-weight: 600;
    font-size: 15px;
    border-top: 1px solid #0000002b;
    padding: 10px 0 0;
    margin: 11px 0 0;
}
.pc-icon {
    background-color: hsla(64.2, 20.8%, 40.6%, 0.1);
}
.pc-icon svg {
    color: #654524;
}
p.pc-card-text {
    line-height: 1.625;
    font-size: .875rem;
}
.the-checklist ul.lists li {
    position: relative;
    padding-left: 28px;
    width: 33.33%;
    margin: 10px 0;
}
.the-checklist ul.lists {
    display: flex;
    list-style: none;
    text-align: left;
    flex-wrap: wrap;
}
.the-checklist ul.lists li:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    background-image: url(../images/check.webp);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 17px;
    filter: invert(42%) sepia(47%) saturate(280%) hue-rotate(24deg) brightness(91%) contrast(86%);
}

/* ── child hero banner ── */
.hut-hero {
  position: relative;
  height: 50vh;
  min-height: 380px;
  overflow: hidden;
}
.hut-hero img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.hut-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.50), transparent);
}
.hut-hero-title {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 2rem 0;
}
.hut-hero-title h1 {
    color: hsl(46.7, 29%, 93.9%);
    letter-spacing: .04em;
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 500;
}
.hut-title {
    font-family: "Playfair Display", serif;
    color: #76794e;
    letter-spacing: 0.1em;
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    margin-bottom: 12px;
}
.hutBack a {
    color: hsl(46.7, 29%, 93.9%);
    text-decoration: none;
    text-transform: uppercase;
    font-size: .875rem;
    line-height: 1.25rem;
    letter-spacing: .025em;
}
.hutBack {
    margin: 0 0 10px;
}
.hut_hero_img {width:100%; height:50vh; min-height:450px; object-fit:cover; display:block;}

p {
    font-size: 1.125rem;
    line-height: 1.625;
    letter-spacing: .025em;
}

.hut-desc {
    color: #939669;
    font-size: 14px;
    line-height: 20px;
}
.hut-icons span {
    display: block;
    font-size: 0.65rem;
    letter-spacing: 0.08em;
    margin-top: 6px;
    color: #654524;
    text-transform: uppercase;
}
.hut-link {
    color: #654524;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0.1em;
}
.hut-card a .hut-link .arrow {
    transition: all .3s ease-in-out;
}
.hut-card a:hover .hut-link .arrow {
    margin-left: 5px;
    transition: all .3s ease-in-out;
}
.icon-item img {
    width: 22px;
    opacity: 0.8;
}
.hut-card a {
    text-decoration: none;
    display: block;
}
.essential-info{
    background-color: #e8ece9;
}
.essential-info h3{
    font-size: 22px;
    font-weight: 500;
}
.mini-title {
    font-family: serif;
    color: #654524;
    letter-spacing: .1em;
    text-transform: uppercase;
    font-size: 13px;
    line-height: 16px;
}

.reserve-grid{display:grid;grid-template-columns:1fr 400px;gap:40px;align-items:center}
.reserve-heading{font-family:var(--font-serif);font-size:28px;font-weight:500;color:var(--charcoal);margin-bottom:16px}
.reserve-body{font-family:var(--font-serif);font-size:17px;color:var(--muted);margin-bottom:24px;line-height:1.8}
.view-calendar{
  font-family:var(--font-sans);font-size:15px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--brown);text-decoration:underline;text-underline-offset:4px;
  transition:opacity .2s;
}
.view-calendar:hover{opacity:.7}

.booking-card{
  background:var(--card);border:1px solid var(--border);border-radius:8px;
  padding:24px;box-shadow:0 4px 16px -4px rgba(60,50,30,.08);
  position:sticky;top:108px;
}
.price-heading{font-family:var(--font-serif);font-size:22px;color:var(--charcoal);margin-bottom:20px}
.price-heading .price-val{text-decoration:underline;text-underline-offset:4px}
.price-heading .price-suffix{font-size:14px;color:var(--muted);font-weight:400;margin-left:4px}

.fields-group{border:1px solid var(--border);border-radius:8px;overflow:visible;margin-bottom:0}
.date-row{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border)}
.date-cell{padding:12px}
.date-cell:first-child{border-right:1px solid var(--border)}
.field-label{font-family:var(--font-sans);font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--charcoal);margin-bottom:5px}

.date-input{
  width:100%;border:1px solid var(--border);border-radius:6px;padding:6px 8px;
  font-family:var(--font-serif);font-size:13px;color:var(--charcoal);
  background:var(--card);outline:none;cursor:pointer;transition:border-color .2s,box-shadow .2s;
}
.date-input:focus{border-color:var(--brown);box-shadow:0 0 0 3px hsl(35,33%,28%,.12)}
.date-input::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}

.guests-wrap{position:relative}
.guests-trigger{
  width:100%;padding:12px;background:none;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;
  transition:background .15s;
}
.guests-trigger:hover{background:rgba(115,118,84,.06)}
.guests-left{text-align:left}
.guests-value{font-family:var(--font-serif);font-size:13px;color:var(--charcoal)}
.chevron{transition:transform .25s;color:var(--muted)}
.chevron.open{transform:rotate(180deg)}

.guests-dropdown{
  position:absolute;left:-1px;right:-1px;top:calc(100% + 6px);
  background:var(--card);border:1px solid var(--border);border-radius:8px;
  box-shadow:0 8px 24px -4px rgba(60,50,30,.14);z-index:30;
  padding:16px;display:none;
}
.guests-dropdown.open{display:block}

.counter-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0}
.counter-row+.counter-row{border-top:1px solid var(--border)}
.counter-label{font-size:14px;font-weight:500;color:var(--charcoal)}
.counter-sub{font-size:11px;color:var(--muted)}
.counter-controls{display:flex;align-items:center;gap:10px}
.counter-btn{
  width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:none;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:var(--charcoal);transition:border-color .15s;
}
.counter-btn:hover:not(:disabled){border-color:var(--charcoal)}
.counter-btn:disabled{opacity:.3;cursor:not-allowed}

.counter-input{
  width:38px;height:32px;border:1px solid var(--border);border-radius:6px;
  text-align:center;font-family:var(--font-serif);font-size:13px;
  color:var(--charcoal);background:var(--card);outline:none;
  transition:border-color .2s,box-shadow .2s;-moz-appearance:textfield;
}
.counter-input:focus{border-color:var(--brown);box-shadow:0 0 0 3px hsl(35,33%,28%,.12)}
.counter-input::-webkit-inner-spin-button,.counter-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

.guests-note{font-size:11px;color:var(--muted);margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}

.val-msg{font-size:12px;color:#c0392b;margin-top:10px}

.btn-reserve{
  width:100%;margin-top:16px;padding:14px 24px;
  background:var(--brown);color:var(--cream);border:none;border-radius:100px;
  font-family:var(--font-serif);font-size:14px;letter-spacing:.08em;
  cursor:pointer;transition:background .2s;
}
.btn-reserve:hover:not(:disabled){background:var(--brown-dark)}
.btn-reserve:disabled{opacity:.5;cursor:not-allowed}
.not-charged{text-align:center;font-size:12px;color:var(--muted);margin-top:10px}
section.section.calendarWrp {
    margin: 0 0 80px;
}

@media screen and (min-width:768px) and (max-width:1023px) {
.the-checklist ul.lists li {
    width: 50%;
}
.story-section h2, .story-section p {text-align: left;}
}

@media screen and (max-width:767px) {
.desc-grid,.reserve-grid{grid-template-columns:1fr}
    .the-checklist ul.lists li {
    width: 100%;
}
.the-checklist ul.lists {
    padding: 0;
}
.hut-hero-title h1 {
    font-size: 1.45rem;
    line-height: 2.5rem;
}
.hutBack {
    margin: 0 0 6px;
}
.story-section .align-items-center {
    text-align: left !important;
}
p {
    font-size: 1rem;
}
.section-slim {
    padding-top: 2.5rem;
    padding-bottom: 3.5rem;
}
section.section.calendarWrp {
    margin: 20px 0 40px;
}
.booking-card {
    padding: 12px;
}
}