/* Keep owner information and account entry points consistent in every header. */
.nav-account-group{display:flex;align-items:center;gap:13px;flex-shrink:0;font-size:.78rem;line-height:1.3;color:inherit}
.nav-account-group a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;white-space:nowrap;font-weight:600}
.nav-account-group a[hidden]{display:none!important}
.nav-account-group .nav-login:hover{text-decoration:underline;text-underline-offset:5px}
.nav-account-group .nav-signup{padding:9px 13px;border:1px solid currentColor;border-radius:4px;transition:background .2s,color .2s}
.nav-account-group .nav-signup:hover{background:var(--cta-dark);color:#fffdf8;border-color:var(--cta-dark)}
.site-header .desktop-nav{gap:20px;margin-left:0}
.site-header .desktop-nav a{font-size:.79rem}
.site-header .header-actions{gap:18px}
.site-header .header-book{gap:12px;font-size:.79rem;padding-inline:14px}
.property-header-links{display:flex;align-items:center;gap:22px;flex-shrink:0}
.property-header-links .property-owner{font-size:.75rem}
.stays-header-actions>.nav-account-group{gap:10px;font-size:.73rem}
.nav-account-group--menu{border-top:1px solid #d4dfd8;padding-top:22px;margin-top:12px;gap:18px;flex-wrap:wrap}
#mobile-sheet .nav-account-group--menu a{font-size:1rem;line-height:1.3;padding:12px 18px;min-height:46px}
#mobile-sheet .nav-account-group--menu .nav-login{padding-left:0}
#mobile-sheet .nav-account-group--menu .nav-signup{background:var(--cta-green);border-color:var(--cta-green);color:#fff}
#stays-menu .nav-account-group--menu{padding:12px 14px 5px;margin-top:8px}
#stays-menu .nav-account-group--menu a{font-size:.78rem;padding:10px}
/* Full navigation stays visible above the phone breakpoint. */
@media(min-width:761px){
 .site-header .desktop-nav{display:flex}
 .site-header.has-primary-owner .header-actions>.header-book{display:none}
 .site-header .mobile-menu{display:none}
 .property-header-links .property-owner{display:flex;max-width:none;white-space:nowrap}

}
/* Two readable rows keep every desktop link available in narrower windows. */
@media(min-width:761px) and (max-width:1100px){
 .site-header,.site-header.is-scrolled{height:112px;display:grid;grid-template-columns:1fr auto;grid-template-rows:52px 40px;column-gap:22px;row-gap:0;padding:10px 28px}
 .site-header .brand{grid-column:1;grid-row:1;justify-self:start}
 .site-header .header-actions{grid-column:2;grid-row:1;justify-self:end}
 .site-header .desktop-nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:28px;align-self:center}
 .site-header .desktop-nav a{font-size:.81rem}
 body.about-page .about-home-hero{--about-header-height:112px}
 body.owners-page{--owner-header-height:112px}
 body.rv-page,body.concierge-body{--hdr:112px}
 body.management-page main,body.destination-page main{padding-top:112px}
 body.booking-body .book-hero,body.it-body .it-hero,body.directory-page .explore-hero{margin-top:112px}
 body.it-body .stub-inner{top:128px;max-height:calc(100svh - 128px)}
 .property-header-links{gap:16px}
}
/* Keep the search page's original compact header and navigation dropdown. */
@media(max-width:1180px){.stays-header-actions>.list-property{display:none}}
@media(max-width:800px){.stays-header-actions>.nav-account-group{display:none}}
/* Only the hamburger remains beside the brand on phones. */
@media(max-width:760px){
 .site-header .desktop-nav{display:none}
 .site-header .mobile-menu{display:block}
 .site-header .header-actions>.nav-account-group,
 .site-header .header-actions>.header-book,
 .stays-header-actions>.nav-account-group,
 .stays-header-actions>.list-property,
 .property-header-links>.nav-account-group,
 .property-header-links>.property-owner{display:none}
 .site-header .header-actions{gap:0}
 .property-header-links{gap:0}
}
@media(prefers-reduced-motion:reduce){.nav-account-group .nav-signup{transition:none}}

/* Search and property headers keep account and owner links inside their menus. */
.stays-header-actions>.nav-account-group,
.stays-header-actions>.list-property,
.property-header-links>.nav-account-group,
.property-header-links>.property-owner{display:none}
.property-header .property-header-links{gap:10px}
.property-header .round-control{width:42px;height:42px;display:grid;place-items:center;position:relative;border:0;border-radius:50%;color:var(--ink);background:#edf1ed;cursor:pointer;flex-shrink:0}
.property-header .round-control:hover{background:#e0e8e3}
.property-header .round-control .i{width:21px;height:21px}
.property-saved-count{position:absolute;right:-3px;top:-3px;background:var(--rust);color:white;font-size:.6rem;min-width:17px;height:17px;border-radius:50%;padding:1px 4px;text-align:center}
.property-header [hidden]{display:none!important}
.property-header .stays-menu{position:absolute;right:4%;top:calc(100% - 18px);display:grid;min-width:210px;padding:12px;background:#fffdf8;border:1px solid #dce2d8;border-radius:14px;box-shadow:0 15px 40px #183f5320;z-index:30}
.property-header .stays-menu a{padding:11px 15px;font-size:.85rem;border-radius:7px}
.property-header .stays-menu a:hover{background:#edf1ed}
@media(max-width:1250px){.property-header .round-control{width:37px;height:37px}}
@media(max-width:700px){.property-header .round-control{width:33px;height:33px}.property-header .round-control .i{width:17px;height:17px}}

/* Signed-in account control: person icon, first name and a dropdown holding
   My account and Sign out. Matches the existing header menu surface. */
.nav-account{position:relative;display:flex;align-items:center}
.nav-account-trigger{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:3px 4px;font:inherit;font-size:inherit;font-weight:600;color:inherit;background:none;border:0;cursor:pointer;white-space:nowrap}
.nav-account-trigger:hover .nav-account-name{text-decoration:underline;text-underline-offset:5px}
.nav-account-icon{width:27px;height:27px;flex-shrink:0;box-sizing:border-box;padding:4px;border-radius:50%;background:var(--cta-soft,#eaf2ed);color:var(--cta-dark,#173e35);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-account-name{max-width:12ch;overflow:hidden;text-overflow:ellipsis}
.nav-account-chevron{width:13px;height:13px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
.nav-account-trigger[aria-expanded="true"] .nav-account-chevron{transform:rotate(180deg)}
/* The dropdown sits on a cream panel while the header text around it is
   white, so it sets its own colour instead of inheriting. */
.nav-account-menu{position:absolute;right:0;top:calc(100% + 10px);z-index:40;display:grid;min-width:224px;padding:10px;background:#fffdf8;border:1px solid #dce2d8;border-radius:14px;box-shadow:0 15px 40px #183f5320;text-align:left;color:var(--foreground,#173f59)}
.nav-account-menu[hidden]{display:none!important}
.nav-account-head{display:grid;gap:3px;margin:0;padding:6px 12px 11px;border-bottom:1px solid #e7ece6;font-weight:400}
.nav-account-head strong{font-size:.84rem;color:var(--cta-dark,#173e35)}
.nav-account-head span{font-size:.72rem;opacity:.72;overflow-wrap:anywhere}
.nav-account-item{display:block;width:100%;margin-top:4px;padding:10px 12px;font:inherit;font-size:.84rem;font-weight:600;text-align:left;color:inherit;background:none;border:0;border-radius:7px;cursor:pointer}
/* Outranks the generic `.nav-account-group a` rule, which centres anchors. */
.nav-account-menu .nav-account-item{display:block;min-height:0}
.nav-account-item:hover,.nav-account-item:focus-visible{background:#edf1ed}
.nav-account-signout{color:var(--rust,#9c4221)}
.nav-account-error{margin:8px 12px 2px;font-size:.72rem;color:var(--rust,#9c4221)}
.nav-account-error[hidden]{display:none!important}
/* The phone sheet and the search menu list the actions flat, under an
   identity block, because a dropdown there would nest a popup in a popup. */
.nav-account-group--menu.is-signed-in,.phone-menu-account.is-signed-in{flex-direction:column;align-items:stretch;gap:0}
.nav-account-who{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:11px;margin:0 0 6px;font-weight:600}
.nav-account-who-text{display:grid;gap:1px;min-width:0}
.nav-account-who-text strong{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-account-who-text span{font-size:.74rem;font-weight:400;opacity:.66;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-account-group--menu .nav-account-item,.phone-menu-account .nav-account-item{width:auto;margin-top:0}
#mobile-sheet .nav-account-group--menu .nav-account-item{font-size:1rem;line-height:1.3;padding:12px 0;min-height:46px}
#mobile-sheet .nav-account-group--menu .nav-account-item:hover{background:none;text-decoration:underline;text-underline-offset:5px}
#stays-menu .nav-account-group--menu.is-signed-in{padding-top:14px}
#stays-menu .nav-account-group--menu .nav-account-who{gap:9px;font-size:.78rem}
#stays-menu .nav-account-group--menu .nav-account-item{font-size:.78rem;padding:9px 0}
@media(prefers-reduced-motion:reduce){.nav-account-chevron{transition:none}}
/* The phone sheet clones the header group, so match its own link styling and
   set the identity block off from the links above it. */
.phone-menu .phone-menu-account{align-self:stretch}
.phone-menu .phone-menu-account.is-signed-in{margin-top:14px;padding-top:16px;}
.phone-menu-account .nav-account-who{margin:0 0 4px;font:600 .95rem/1.35 Manrope,sans-serif}
.phone-menu-account .nav-account-icon{width:34px;height:34px;padding:6px}
.phone-menu-account .nav-account-who-text span{font-size:.76rem}
.phone-menu-account .nav-account-item{display:flex;align-items:center;justify-content:flex-start;width:auto;min-height:40px;margin-top:0;padding:7px 0;font:500 .88rem/1.4 Manrope,sans-serif;background:none;border:0}
.phone-menu-account .nav-account-item:hover,.phone-menu-account .nav-account-item:focus-visible{background:none;text-decoration:underline;text-underline-offset:5px}

/* The navigation item for the page being viewed. The desktop links already
   slide a 1px underline in on hover, so the current page simply keeps it. */
.site-header .desktop-nav a[aria-current="page"]{font-weight:600;color:var(--holiday-rust,#a84d34)}
.site-header .desktop-nav a[aria-current="page"]:after{right:0}
#mobile-sheet nav a[aria-current="page"],
#stays-menu a[aria-current="page"]{font-weight:700;color:var(--holiday-rust,#a84d34);text-decoration:underline;text-underline-offset:5px}
/* The phone menu marks the current page with a highlighted row instead. */
.phone-menu a[aria-current="page"]{font-weight:600;color:var(--holiday-rust,#a84d34);text-decoration:none}
/* A transparent header sits over dark artwork, where the rust accent would
   not read; there the current item stays white and keeps its underline. */
.site-header:not([data-solid]):not(.is-scrolled) .desktop-nav a[aria-current="page"]{color:inherit}

/* The phone sheet's single call to action: a full-width pill with a person
   badge and an arrow. Qualified with .phone-menu because mobile-menu.css
   loads after this file and styles .phone-menu-account a generically. */
.phone-menu .phone-menu-account .phone-menu-login{display:flex;align-items:center;gap:16px;width:100%;min-height:66px;margin:10px 0 4px;padding:10px 16px;border-radius:999px;background:var(--cta-dark,#173e35);color:#fffdf8;font:600 1.02rem/1.3 Manrope,sans-serif;text-decoration:none;transition:background .2s}
.phone-menu .phone-menu-account .phone-menu-login:is(:hover,:focus-visible){background:#10342c;color:#fffdf8;text-decoration:none}
.phone-menu .phone-menu-account .phone-menu-login .nav-account-icon{width:46px;height:46px;padding:12px;background:#ffffff1f;color:#fffdf8}
.phone-menu-login-label{flex:1;min-width:0}
.phone-menu-login-arrow{width:21px;height:21px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media(prefers-reduced-motion:reduce){.phone-menu .phone-menu-account .phone-menu-login{transition:none}}