/* Brand-led mastheads for hotel-chain archives and their hotel detail pages. */
.chain-archive-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	min-height: 350px;
	color: #fff;
	background: linear-gradient(112deg, #101f30 0%, #172b40 55%, #203b53 100%);
}
.chain-archive-hero::before,
.chain-archive-hero::after {
	position: absolute;
	z-index: -1;
	content: "";
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 50%;
}
.chain-archive-hero::before { width: 590px; height: 590px; right: -100px; top: -310px; }
.chain-archive-hero::after { width: 410px; height: 410px; right: -8px; top: -220px; }
.chain-archive-hero__glow {
	position: absolute;
	z-index: -1;
	width: 420px;
	height: 420px;
	right: 14%;
	bottom: -340px;
	border-radius: 50%;
	background: rgba(205, 163, 91, .16);
	filter: blur(2px);
}
.chain-archive-hero__inner {
	display: grid;
	grid-template-columns: minmax(210px, 290px) minmax(0, 1fr);
	align-items: center;
	gap: clamp(2rem, 6vw, 5.5rem);
	min-height: 350px;
	padding-top: 2.5rem;
	padding-bottom: 2.5rem;
}
.chain-archive-hero__logo-box {
	display: grid;
	place-items: center;
	min-height: 190px;
	padding: 1.5rem;
	border: 1px solid rgba(255,255,255,.55);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 55px rgba(0,0,0,.24);
}
.chain-archive-hero__logo-box img { display: block; width: 100%; max-width: 245px; max-height: 130px; object-fit: contain; }
.chain-archive-hero__logo-box img[src*="armas-hotels.png"] { box-sizing: border-box; padding: 12px; border-radius: 10px; background: #263445; }
.chain-archive-hero__logo-box > span { display: grid; width: 84px; height: 84px; place-items: center; border-radius: 50%; color: #fff; background: #243b52; font-size: 2.8rem; font-weight: 700; }
.chain-archive-hero__content .breadcrumbs { display: inline-flex; max-width: 100%; margin: 0 0 1.15rem; padding: .25rem .7rem; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; color: #fff; background: rgba(5,14,24,.52); backdrop-filter: blur(8px); }
.chain-archive-hero__content .breadcrumb-list { margin: 0; }
.chain-archive-hero__content .breadcrumb-item,
.chain-archive-hero__content .breadcrumb-item.active { color: #fff; }
.chain-archive-hero__content .breadcrumb-item a { color: #fff; text-decoration: underline; text-decoration-color: rgba(231,201,141,.7); text-underline-offset: 3px; }
.chain-archive-hero__content .breadcrumb-item a:hover { color: #f2d79f; }
.chain-archive-hero__content .breadcrumb-item + .breadcrumb-item::before { color: #e7c98d; }
.chain-archive-hero__content .breadcrumbs .container { width: auto; max-width: none; padding: 0; }
.chain-archive-hero__content .breadcrumbs a { color: #fff; }
.chain-archive-hero__eyebrow,
.hotel-chain-brand-hero__eyebrow { margin: 0 0 .55rem; color: #e7c98d; font-size: .75rem; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.chain-archive-hero__content h1 { margin: 0; color: #fff; font-family: var(--font-display); font-size: clamp(2.15rem, 4.2vw, 3.5rem); font-weight: 650; line-height: 1.06; }
.chain-archive-hero__intro { max-width: 650px; margin: .9rem 0 1.4rem; color: rgba(255,255,255,.77); font-size: 1rem; line-height: 1.65; }
.chain-archive-hero__bottom { display: flex; align-items: center; flex-wrap: wrap; gap: 1.2rem; }
.chain-archive-hero__count { color: rgba(255,255,255,.78); }
.chain-archive-hero__count strong { margin-right: .25rem; color: #fff; font-size: 1.35rem; }
.chain-archive-hero__button,
.hotel-chain-brand-hero__link { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; min-height: 46px; padding: .7rem 1.15rem; border: 1px solid #e7c98d; border-radius: 8px; color: #18283a; background: #e7c98d; font-size: .9rem; font-weight: 700; text-decoration: none; transition: transform .18s ease, background .18s ease; }
.chain-archive-hero__button:hover,
.hotel-chain-brand-hero__link:hover { transform: translateY(-1px); color: #18283a; background: #f0d9a9; }
.hotel-hero-gallery { position: relative; }
.hotel-chain-brand-hero { position: absolute; z-index: 5; left: 1.25rem; bottom: 1.25rem; display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; align-items: center; gap: 1.25rem; width: min(840px, calc(100% - 2.5rem)); margin: 0; padding: 1rem 1.15rem; overflow: hidden; border: 1px solid rgba(255,255,255,.26); border-radius: 14px; color: #fff; background: rgba(11,24,37,.88); box-shadow: 0 14px 38px rgba(0,0,0,.28); backdrop-filter: blur(14px); }
.hotel-chain-brand-hero__logo { display: grid; min-height: 92px; place-items: center; padding: .85rem; border-radius: 10px; background: #fff; }
.hotel-chain-brand-hero__logo img { display: block; width: 100%; max-width: 130px; max-height: 70px; object-fit: contain; }
.hotel-chain-brand-hero__logo img[src*="armas-hotels.png"] { box-sizing: border-box; padding: 10px; border-radius: 8px; background: #263445; }
.hotel-chain-brand-hero__logo > span { display: grid; width: 64px; height: 64px; place-items: center; border-radius: 50%; color: #fff; background: #243b52; font-size: 2rem; font-weight: 700; }
.hotel-chain-brand-hero__content { min-width: 0; }
.hotel-chain-brand-hero__eyebrow { margin-bottom: .45rem; }
.hotel-chain-brand-hero__stars { margin-bottom: .35rem; color: #e7c98d; letter-spacing: .08em; }
.hotel-chain-brand-hero .hotel-detail-name { margin: 0; color: #fff !important; font-family: var(--font-display); font-size: clamp(1.5rem, 2.5vw, 2.2rem); line-height: 1.12; text-shadow: none; }
.hotel-chain-brand-hero__meta { display: flex; flex-wrap: wrap; gap: .45rem 1rem; margin-top: .65rem; color: rgba(255,255,255,.76); font-size: .92rem; }
.hotel-chain-brand-hero__meta span + span::before { content: "·"; margin-right: 1rem; color: #e7c98d; }
.hotel-chain-brand-hero__link { white-space: nowrap; }
.hotel-chain-empty-hero { position: relative; min-height: 350px; margin-bottom: 1.5rem; overflow: hidden; border-radius: var(--radius-lg); background: linear-gradient(120deg, #25384a, #52677b); }

@media (max-width: 760px) {
	.chain-archive-hero__inner { grid-template-columns: 116px minmax(0, 1fr); gap: 1.1rem; min-height: 0; padding-top: 1.65rem; padding-bottom: 1.65rem; }
	.chain-archive-hero__logo-box { min-height: 112px; padding: .7rem; border-radius: 12px; }
	.chain-archive-hero__logo-box img { max-height: 85px; }
	.chain-archive-hero__content .breadcrumbs { margin-bottom: .7rem; font-size: .78rem; }
	.chain-archive-hero__eyebrow { font-size: .64rem; letter-spacing: .12em; }
	.chain-archive-hero__content h1 { font-size: clamp(1.55rem, 6vw, 2.3rem); }
	.chain-archive-hero__intro { margin: .6rem 0 .85rem; font-size: .88rem; line-height: 1.5; }
	.chain-archive-hero__bottom { gap: .7rem; }
	.chain-archive-hero__button { min-height: 40px; padding: .55rem .8rem; font-size: .82rem; }
	.chain-archive-hero__count { font-size: .84rem; }
	.chain-archive-hero__count strong { font-size: 1.1rem; }
	.hotel-chain-brand-hero { left: .75rem; bottom: .75rem; grid-template-columns: 82px minmax(0, 1fr); gap: .75rem; width: calc(100% - 1.5rem); padding: .75rem; border-radius: 11px; }
	.hotel-chain-brand-hero__logo { min-height: 70px; padding: .45rem; }
	.hotel-chain-brand-hero__logo img { max-height: 54px; }
	.hotel-chain-brand-hero__eyebrow { font-size: .61rem; letter-spacing: .1em; }
	.hotel-chain-brand-hero .hotel-detail-name { font-size: clamp(1.3rem, 5.3vw, 1.85rem); }
	.hotel-chain-brand-hero__meta { gap: .25rem .6rem; margin-top: .4rem; font-size: .8rem; }
	.hotel-chain-brand-hero__meta span + span::before { margin-right: .6rem; }
	.hotel-chain-brand-hero__link { grid-column: 1 / -1; min-height: 40px; }
	.hotel-chain-empty-hero { min-height: 310px; }
}

@media (max-width: 430px) {
	.chain-archive-hero__inner { grid-template-columns: 1fr; gap: .9rem; }
	.chain-archive-hero__logo-box { justify-self: start; width: 150px; min-height: 84px; }
	.chain-archive-hero__content .breadcrumbs { margin-bottom: .5rem; }
	.chain-archive-hero__intro { max-width: 100%; }
}

/* Final refinement: quiet the chain breadcrumb and make the hotel brand + photos one balanced split hero. */
.chain-archive-hero__content .breadcrumbs {
	position: absolute;
	right: max(1rem, calc((100vw - 1240px) / 2));
	bottom: 1rem;
	z-index: 3;
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	opacity: .62;
	background: transparent;
	backdrop-filter: none;
	font-size: .72rem;
	transition: opacity .18s ease;
}
.chain-archive-hero__content .breadcrumbs:hover { opacity: .92; }
.chain-archive-hero__content .breadcrumbs .container { padding: 0; }
.chain-archive-hero__content .breadcrumb-item,
.chain-archive-hero__content .breadcrumb-item.active { color: rgba(255,255,255,.86); }
.chain-archive-hero__content .breadcrumb-item a { color: rgba(255,255,255,.86); text-decoration: none; }
.chain-archive-hero__content .breadcrumb-item + .breadcrumb-item::before { color: rgba(231,201,141,.65); }

.hotel-hero-gallery--branded {
	grid-template-columns: minmax(230px, .9fr) minmax(0, 1.65fr) repeat(2, minmax(0, .68fr));
	grid-template-rows: repeat(2, minmax(0, 1fr));
	gap: .45rem;
	height: 450px;
	background: #102235;
}
.hotel-hero-gallery--branded .hotel-chain-brand-hero {
	position: relative;
	z-index: 2;
	left: auto;
	bottom: auto;
	grid-column: 1;
	grid-row: 1 / 3;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.15rem;
	width: auto;
	min-width: 0;
	margin: 0;
	padding: clamp(1.15rem, 2.4vw, 2rem);
	border: 0;
	border-radius: 0;
	background: linear-gradient(155deg, #142b40 0%, #0d1d2e 100%);
	box-shadow: none;
	backdrop-filter: none;
}
.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo {
	width: 100%;
	min-height: 106px;
	max-width: 190px;
	padding: .85rem;
	border-radius: 10px;
	box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo img { max-height: 78px; }
.hotel-hero-gallery--branded .hotel-chain-brand-hero__content { width: 100%; }
.hotel-hero-gallery--branded .hotel-chain-brand-hero__eyebrow { line-height: 1.5; }
.hotel-hero-gallery--branded .hotel-detail-name { overflow-wrap: anywhere; }
.hotel-hero-gallery--branded .hotel-chain-brand-hero__meta { gap: .45rem; }
.hotel-hero-gallery--branded .hotel-chain-brand-hero__meta span + span::before { margin-right: .45rem; }
.hotel-hero-gallery--branded .hotel-chain-brand-hero__link { margin-top: auto; }
.hotel-hero-gallery--branded .hero-gallery-main { grid-column: 2; grid-row: 1 / 3; }
.hotel-hero-gallery--branded.count-1 { grid-template-rows: 1fr; }
.hotel-hero-gallery--branded.count-1 .hotel-chain-brand-hero,
.hotel-hero-gallery--branded.count-1 .hero-gallery-main { grid-row: 1; }
.hotel-hero-gallery--branded.count-1 .hero-gallery-main { grid-column: 2 / 5; }
.hotel-hero-gallery--branded.count-2 { grid-template-rows: 1fr; }
.hotel-hero-gallery--branded.count-2 .hotel-chain-brand-hero,
.hotel-hero-gallery--branded.count-2 .hero-gallery-main,
.hotel-hero-gallery--branded.count-2 .hero-gallery-side { grid-row: 1; }
.hotel-hero-gallery--branded.count-2 .hero-gallery-side { grid-column: 3 / 5; }
.hotel-hero-gallery--branded.count-3 .hero-gallery-side { grid-row: 1 / 3; }
.hotel-hero-gallery--branded.count-3 .hero-gallery-side:nth-of-type(2) { grid-column: 3; }
.hotel-hero-gallery--branded.count-3 .hero-gallery-side:nth-of-type(3) { grid-column: 4; }
.hotel-hero-gallery--branded.count-4 .hero-gallery-side:last-of-type { grid-column: 3 / 5; grid-row: 2; }
.hotel-chain-empty-hero .hotel-chain-brand-hero { position: relative; inset: auto; width: 100%; min-height: 350px; border-radius: inherit; }
/* Desktop: the panel is 450px tall, so long hotel names pushed the button out of view. */
@media (min-width: 761px) {
	.hotel-hero-gallery--branded .hotel-chain-brand-hero { gap: .8rem; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo { min-height: 84px; max-width: 170px; padding: .7rem; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo img { max-height: 60px; }
	.hotel-hero-gallery--branded .hotel-detail-name { display: -webkit-box; overflow: hidden; font-size: clamp(1.3rem, 1.85vw, 1.85rem); -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__link { min-height: 40px; padding: .55rem 1rem; }
}

@media (max-width: 760px) {
	.chain-archive-hero__inner { padding-bottom: 3.6rem; }
	.chain-archive-hero__content .breadcrumbs { right: .9rem; bottom: .65rem; font-size: .67rem; }
	.hotel-hero-gallery--branded,
	.hotel-hero-gallery--branded.count-1,
	.hotel-hero-gallery--branded.count-2 { grid-template-columns: 1fr 1fr; grid-template-rows: auto 220px 132px; height: auto; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero,
	.hotel-hero-gallery--branded.count-1 .hotel-chain-brand-hero,
	.hotel-hero-gallery--branded.count-2 .hotel-chain-brand-hero { grid-column: 1 / 3; grid-row: 1; display: grid; grid-template-columns: 82px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; gap: .6rem .8rem; padding: .85rem; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo { grid-column: 1; grid-row: 1 / 3; min-height: 70px; max-width: none; padding: .45rem; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__logo img { max-height: 54px; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__content { grid-column: 2; grid-row: 1; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__eyebrow { margin-bottom: .25rem; font-size: .59rem; letter-spacing: .08em; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__stars { margin-bottom: .2rem; font-size: .82rem; }
	.hotel-hero-gallery--branded .hotel-detail-name { font-size: clamp(1.2rem, 5vw, 1.65rem); }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__meta { margin-top: .3rem; font-size: .76rem; }
	.hotel-hero-gallery--branded .hotel-chain-brand-hero__link { grid-column: 2; grid-row: 2; justify-self: start; min-height: 34px; padding: .45rem .65rem; font-size: .76rem; }
	.hotel-hero-gallery--branded .hero-gallery-main,
	.hotel-hero-gallery--branded.count-1 .hero-gallery-main,
	.hotel-hero-gallery--branded.count-2 .hero-gallery-main { grid-column: 1 / 3; grid-row: 2; height: 220px; }
	.hotel-hero-gallery--branded.count-2 .hero-gallery-side { grid-column: 1 / 3; grid-row: 3; }
	.hotel-hero-gallery--branded.count-3 .hero-gallery-side:nth-of-type(2),
	.hotel-hero-gallery--branded.count-3 .hero-gallery-side:nth-of-type(3) { grid-column: auto; grid-row: 3; }
	/* Two tiles under the main photo: the first side photo and the last one (it carries the "+N photos" button).
	   main.css hides children 4-5 by position, which the brand panel shifts, so set display explicitly. */
	.hotel-hero-gallery.hotel-hero-gallery--branded .hero-gallery-side { display: none; }
	.hotel-hero-gallery.hotel-hero-gallery--branded .hero-gallery-side:nth-of-type(2),
	.hotel-hero-gallery.hotel-hero-gallery--branded .hero-gallery-side:last-of-type { display: block; grid-column: auto; grid-row: 3; }
	.hotel-hero-gallery.hotel-hero-gallery--branded.count-2 .hero-gallery-side { grid-column: 1 / 3; }
	.hotel-chain-empty-hero .hotel-chain-brand-hero { min-height: 290px; }
}
