/* ==========================================================================
   Amarante — EDITION Residences, Miami Edgewater
   Scoped stylesheet (all rules under .amr-edition).
   Brand: Oswald headlines, Helvetica Neue body, blue/grey editorial palette.
   Mobile-first. No heavy animation. Refined luxury / newspaper aesthetic.
   ========================================================================== */

.amr-edition {
	--amr-primary: #4A60A1;
	--amr-secondary: #5B7BC4;
	--amr-text: #333;
	--amr-muted: #6b6f76;
	--amr-light: #f4f4f4;
	--amr-border: #ddd;
	--amr-white: #fff;
	--amr-ink: #1f2433;
	--amr-maxw: 1080px;
	--amr-pad: 22px;

	color: var(--amr-text);
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	line-height: 1.65;
	font-size: 17px;
	background: var(--amr-white);
	-webkit-font-smoothing: antialiased;
}

.amr-edition *,
.amr-edition *::before,
.amr-edition *::after { box-sizing: border-box; }

.amr-edition img { max-width: 100%; height: auto; display: block; }
.amr-edition a { color: var(--amr-primary); text-decoration: none; }
.amr-edition a:hover { text-decoration: underline; }

/* ---- Full-bleed wrapper + centered container ----------------------------
   The module breaks out to viewport width ONCE, on the wrapper. --amr-vw is set
   by JS to document.documentElement.clientWidth (which EXCLUDES the scrollbar),
   eliminating the classic 100vw horizontal-overflow gutter; it falls back to
   100vw before JS runs. overflow-x: clip contains any incidental child overflow
   without creating a scroll container and without clipping the position:fixed
   sticky CTA / lightbox. For sidebar/narrow templates, use contained mode. */
.amr-edition {
	--amr-vw: 100vw;
	width: var(--amr-vw);
	margin-left: calc(50% - (var(--amr-vw) / 2));
	margin-right: calc(50% - (var(--amr-vw) / 2));
	overflow-x: clip;
}
.amr-edition.amr-edition--contained {
	width: auto;
	margin-left: 0;
	margin-right: 0;
}
.amr-container {
	max-width: var(--amr-maxw);
	margin: 0 auto;
	padding-left: var(--amr-pad);
	padding-right: var(--amr-pad);
}

/* ---- Section rhythm ------------------------------------------------------ */
.amr-section { padding: 48px 0; }
.amr-alt { background: var(--amr-light); }
.amr-section-title {
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--amr-primary);
	font-size: clamp(24px, 5vw, 34px);
	line-height: 1.15;
	margin: 0 0 22px;
	padding-bottom: 12px;
	border-bottom: 3px solid var(--amr-primary);
}
.amr-section-lead {
	font-size: 1.05rem;
	color: var(--amr-muted);
	max-width: 68ch;
	margin: 0 0 28px;
}
.amr-subheading {
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	letter-spacing: .02em;
	color: var(--amr-secondary);
	font-size: 1.2rem;
	margin: 26px 0 8px;
}
.amr-prose p { margin: 0 0 16px; max-width: 72ch; }
.amr-advisor-note {
	border-left: 4px solid var(--amr-secondary);
	background: var(--amr-light);
	padding: 14px 18px;
	border-radius: 0 6px 6px 0;
}
.amr-finenote, .amr-license, .amr-consent {
	font-size: .86rem;
	color: var(--amr-muted);
	line-height: 1.55;
}
.amr-finenote { margin-top: 22px; }

/* ---- Draft banner & breadcrumb ------------------------------------------ */
.amr-crumbs {
	background: var(--amr-white);
	border-bottom: 1px solid var(--amr-border);
	font-size: .82rem;
	color: var(--amr-muted);
	padding: 10px var(--amr-pad);
}
.amr-crumbs span { margin: 0 6px; color: var(--amr-border); }
.amr-crumbs a { color: var(--amr-muted); }

/* ---- Buttons -------------------------------------------------------------
   Scoped under .amr-edition and using !important on color/background/border so
   the labels are always visible regardless of the active theme's global anchor
   or .button styles (fixes "blue-on-blue, label only on hover"). Every state —
   normal, hover, focus, active — keeps an explicit, high-contrast pairing. */
.amr-edition .amr-btn {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 26px;
	margin: 0;
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	font-size: .92rem;
	line-height: 1.1;
	border-radius: 4px;
	border: 2px solid transparent;
	cursor: pointer;
	transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
	text-align: center;
	text-decoration: none !important;
	box-shadow: none;
	opacity: 1;
	-webkit-appearance: none;
	appearance: none;
}

/* Primary — solid blue, white label (all states keep white text). */
.amr-edition .amr-btn--primary,
.amr-edition a.amr-btn--primary,
.amr-edition button.amr-btn--primary {
	background: var(--amr-primary) !important;
	color: #fff !important;
	border-color: var(--amr-primary) !important;
}
.amr-edition .amr-btn--primary:hover,
.amr-edition .amr-btn--primary:focus {
	background: #36497f !important;
	color: #fff !important;
	border-color: #36497f !important;
}
.amr-edition .amr-btn--primary:active { background: #2c3c6a !important; color: #fff !important; }

/* Secondary — white fill, blue label + blue border; inverts on hover. On dark
   hero backgrounds this reads as a clear white button next to the solid one. */
.amr-edition .amr-btn--secondary,
.amr-edition a.amr-btn--secondary,
.amr-edition button.amr-btn--secondary {
	background: #fff !important;
	color: #2c3c6a !important;
	border-color: #fff !important;
}
.amr-edition .amr-btn--secondary:hover,
.amr-edition .amr-btn--secondary:focus {
	background: var(--amr-primary) !important;
	color: #fff !important;
	border-color: #fff !important;
}
.amr-edition .amr-btn--secondary:active { background: #2c3c6a !important; color: #fff !important; }

/* Ghost — used on light section backgrounds only. */
.amr-edition .amr-btn--ghost,
.amr-edition a.amr-btn--ghost,
.amr-edition button.amr-btn--ghost {
	background: transparent !important;
	color: var(--amr-primary) !important;
	border-color: var(--amr-primary) !important;
}
.amr-edition .amr-btn--ghost:hover,
.amr-edition .amr-btn--ghost:focus {
	background: var(--amr-primary) !important;
	color: #fff !important;
	border-color: var(--amr-primary) !important;
}

/* Accessible focus ring (keyboard) on every button variant. */
.amr-edition .amr-btn:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 2px;
	box-shadow: 0 0 0 5px rgba(74,96,161,.65);
}

.amr-edition .amr-btn--sm { min-height: 42px; padding: 9px 18px; font-size: .82rem; }
.amr-edition .amr-btn--lg { min-height: 54px; padding: 15px 30px; font-size: 1rem; }
.amr-edition .amr-btn--block { width: 100%; }
.amr-cta-inline { margin-top: 26px; }

/* ---- Hero ---------------------------------------------------------------- */
.amr-hero {
	position: relative;
	min-height: 76vh;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
	background: #20283f;
}
.amr-edition .amr-hero__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	z-index: 0;
}
/* <picture> must not generate a box, so the absolutely-positioned hero <img>
   and the grid gallery <img> lay out as direct children. */
.amr-edition picture { display: contents; }
.amr-hero__img--placeholder {
	background:
		radial-gradient(120% 100% at 70% 10%, rgba(91,123,196,.55), transparent 60%),
		linear-gradient(160deg, #2b3656 0%, #4A60A1 55%, #5B7BC4 100%);
}
.amr-hero__scrim {
	position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(180deg, rgba(15,20,35,.15) 0%, rgba(15,20,35,.25) 45%, rgba(15,20,35,.78) 100%);
}
.amr-hero__inner { position: relative; z-index: 2; width: 100%; padding-top: 60px; padding-bottom: 46px; color: #fff; }
.amr-hero__eyebrow {
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	letter-spacing: .18em;
	font-size: .8rem;
	margin: 0 0 14px;
	color: #e9edf7;
}
.amr-hero__title {
	font-family: 'Oswald', sans-serif;
	font-weight: 600;
	font-size: clamp(32px, 8vw, 62px);
	line-height: 1.04;
	margin: 0 0 14px;
	color: #fff;
	text-shadow: 0 2px 18px rgba(0,0,0,.3);
}
.amr-hero__sub {
	font-size: clamp(16px, 2.6vw, 21px);
	max-width: 40ch;
	margin: 0 0 26px;
	color: #f1f3fa;
}
.amr-edition .amr-hero__ctas { display: flex !important; flex-direction: column; flex-wrap: wrap; gap: 14px; align-items: stretch; }
.amr-hero__rendering { margin: 20px 0 0; font-size: .76rem; color: #c7cee0; letter-spacing: .02em; }

/* ---- Quick facts --------------------------------------------------------- */
.amr-facts-grid {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px;
	background: var(--amr-border);
	border: 1px solid var(--amr-border);
	border-radius: 8px; overflow: hidden;
}
.amr-fact { background: #fff; padding: 16px 16px; display: flex; flex-direction: column; gap: 4px; }
.amr-fact__label {
	font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .08em;
	font-size: .68rem; color: var(--amr-secondary);
}
.amr-fact__value { font-size: .98rem; font-weight: 500; color: var(--amr-ink); }

/* ---- Highlight cards ----------------------------------------------------- */
.amr-cards { display: grid; grid-template-columns: 1fr; gap: 16px; }
.amr-card {
	background: #fff; border: 1px solid var(--amr-border); border-radius: 8px;
	padding: 22px 20px; transition: box-shadow .18s ease, transform .18s ease;
}
.amr-card:hover { box-shadow: 0 8px 26px rgba(31,36,51,.08); transform: translateY(-2px); }
.amr-card__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 46px; height: 46px; border-radius: 50%;
	background: var(--amr-light); color: var(--amr-primary);
	margin-bottom: 12px; border: 1px solid var(--amr-border);
}
.amr-card__title { font-family: 'Oswald', sans-serif; font-weight: 500; color: var(--amr-ink); font-size: 1.12rem; margin: 0 0 6px; }
.amr-card__text { margin: 0; font-size: .94rem; color: var(--amr-muted); }

/* ---- Image figure + placeholders ----------------------------------------- */
.amr-fig { margin: 0; }
.amr-img { width: 100%; border-radius: 8px; }
.amr-img--placeholder {
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	display: flex; align-items: flex-end; justify-content: flex-start;
	background:
		repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 12px, transparent 12px 24px),
		linear-gradient(150deg, #43507e 0%, #4A60A1 55%, #5B7BC4 100%);
}
.amr-img__ph-label {
	font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .06em;
	font-size: .62rem; color: #fff; background: rgba(0,0,0,.28);
	margin: 10px; padding: 4px 8px; border-radius: 4px;
}
.amr-fig__cap { font-size: .74rem; color: var(--amr-muted); margin-top: 6px; font-style: italic; }

/* ---- Amenities ----------------------------------------------------------- */
.amr-amenities { display: grid; gap: 26px; }
.amr-amenity-block { display: grid; gap: 16px; }
.amr-amenity__body { padding: 0; }
.amr-ticks { list-style: none; margin: 8px 0 0; padding: 0; }
.amr-ticks li { position: relative; padding-left: 24px; margin-bottom: 8px; font-size: .96rem; }
.amr-ticks li::before {
	content: ""; position: absolute; left: 2px; top: .55em;
	width: 8px; height: 8px; border-radius: 2px;
	background: var(--amr-secondary); transform: rotate(45deg);
}

/* ---- Floor-plan collections ---------------------------------------------- */
.amr-collections { display: grid; grid-template-columns: 1fr; gap: 16px; }
.amr-collection {
	background: #fff; border: 1px solid var(--amr-border); border-left: 4px solid var(--amr-secondary);
	border-radius: 6px; padding: 20px;
}
.amr-collection p { margin: 0 0 14px; color: var(--amr-muted); font-size: .95rem; }

/* ---- Gallery tabs -------------------------------------------------------- */
.amr-tabs__nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.amr-tab {
	font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .04em;
	font-size: .82rem; padding: 9px 16px; border-radius: 999px; cursor: pointer;
	background: #fff; color: var(--amr-primary); border: 1px solid var(--amr-border);
}
.amr-tab.is-active { background: var(--amr-primary); color: #fff; border-color: var(--amr-primary); }
.amr-tabs__panel[hidden] { display: none; }
.amr-gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.amr-gallery__item { cursor: zoom-in; }
.amr-gallery__item .amr-img,
.amr-gallery__item .amr-img--placeholder { aspect-ratio: 4 / 3; object-fit: cover; }

/* ---- Lightbox ------------------------------------------------------------ */
.amr-lightbox {
	position: fixed; inset: 0; z-index: 99999; display: none;
	align-items: center; justify-content: center;
	background: rgba(12,15,25,.92); padding: 24px;
}
.amr-lightbox.is-open { display: flex; }
.amr-lightbox img, .amr-lightbox .amr-lb-ph {
	max-width: 92vw; max-height: 84vh; border-radius: 6px;
}
.amr-lb-ph {
	width: min(720px, 90vw); aspect-ratio: 4/3;
	background: linear-gradient(150deg, #43507e, #5B7BC4);
	display: flex; align-items: center; justify-content: center; color: #fff;
	font-family: 'Oswald', sans-serif; text-transform: uppercase; letter-spacing: .06em; font-size: .8rem;
}
.amr-lightbox__cap { position: absolute; bottom: 18px; left: 0; right: 0; text-align: center; color: #d7ddec; font-size: .8rem; }
.amr-lightbox__close {
	position: absolute; top: 16px; right: 20px; background: none; border: 0;
	color: #fff; font-size: 2rem; line-height: 1; cursor: pointer;
}

/* ---- Video --------------------------------------------------------------- */
.amr-video-pending {
	background: #fff; border: 1px dashed var(--amr-border); border-radius: 8px;
	padding: 22px; color: var(--amr-muted); font-size: .92rem;
}
.amr-video-facade {
	position: relative; aspect-ratio: 16/9; border-radius: 8px; cursor: pointer;
	background: linear-gradient(150deg, #2b3656, #4A60A1);
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: #fff;
}
.amr-video-facade__play {
	width: 64px; height: 64px; border-radius: 50%; background: rgba(255,255,255,.18);
	display: flex; align-items: center; justify-content: center; font-size: 1.4rem;
}
.amr-video-facade__label { font-family: 'Oswald', sans-serif; letter-spacing: .04em; }
.amr-video-frame { width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 8px; }

/* Self-hosted native video (lazy, preload=none, poster). Portrait source is
   centered and width-constrained so a 4:5 clip never dominates the page. */
.amr-edition .amr-video-native { display: flex; justify-content: center; }
.amr-edition .amr-video-el {
	display: block; width: 100%; height: auto; border-radius: 10px;
	background: #11141f; box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.amr-edition .amr-video-native--portrait .amr-video-el { max-width: 420px; aspect-ratio: 4 / 5; object-fit: cover; }
.amr-edition .amr-video-native--landscape .amr-video-el { max-width: 960px; aspect-ratio: 16 / 9; object-fit: cover; }
.amr-edition .amr-video-native + .amr-finenote { text-align: center; margin-top: 14px; }

/* ---- Map ----------------------------------------------------------------- */
.amr-map { margin-top: 22px; border-radius: 8px; overflow: hidden; border: 1px solid var(--amr-border); }
.amr-map iframe { width: 100%; height: 360px; border: 0; display: block; }
.amr-map--facade {
	display: flex; align-items: center; justify-content: center; height: 200px;
	background: linear-gradient(150deg, #eef1f8, #dde3f3); color: var(--amr-primary);
	font-family: 'Oswald', sans-serif; letter-spacing: .03em; text-transform: uppercase; font-size: .9rem;
}
.amr-map--facade:hover { text-decoration: none; }

/* ---- FAQ ----------------------------------------------------------------- */
.amr-faq { border-top: 1px solid var(--amr-border); }
.amr-faq__item { border-bottom: 1px solid var(--amr-border); }
.amr-faq__q {
	cursor: pointer; list-style: none; padding: 18px 40px 18px 0; position: relative;
	font-family: 'Oswald', sans-serif; font-weight: 500; color: var(--amr-ink); font-size: 1.05rem;
}
.amr-faq__q::-webkit-details-marker { display: none; }
.amr-faq__q::after {
	content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
	font-size: 1.5rem; color: var(--amr-secondary); line-height: 1;
}
.amr-faq__item[open] .amr-faq__q::after { content: "\2013"; }
.amr-faq__a { padding: 0 0 18px; color: var(--amr-muted); }
.amr-faq__a p { margin: 0; max-width: 74ch; }

/* ---- Lead form ----------------------------------------------------------- */
.amr-leadsection { background: var(--amr-ink); color: #eef1f8; }
.amr-leadsection .amr-section-title { color: #fff; border-bottom-color: var(--amr-secondary); }
.amr-leadsection .amr-section-lead { color: #c7cee0; }
.amr-form { max-width: 720px; }
.amr-form__row { display: grid; grid-template-columns: 1fr; gap: 16px; }
.amr-field { margin-bottom: 16px; display: flex; flex-direction: column; }
.amr-field label { font-size: .82rem; letter-spacing: .03em; margin-bottom: 6px; color: #d7ddec; }
.amr-field input, .amr-field select, .amr-field textarea {
	font-family: inherit; font-size: 1rem; padding: 12px 14px; border-radius: 6px;
	border: 1px solid #46506e; background: #2a3148; color: #fff; min-height: 48px;
}
.amr-field textarea { min-height: 110px; resize: vertical; }
.amr-field input:focus, .amr-field select:focus, .amr-field textarea:focus {
	outline: 2px solid var(--amr-secondary); outline-offset: 1px; border-color: var(--amr-secondary);
}
.amr-req { color: #ff9b8a; }
.amr-opt { color: #9aa3bd; font-weight: 400; }
.amr-form__actions { display: flex; flex-direction: column; gap: 12px; margin-top: 6px; }
.amr-form__tertiary { margin-top: 14px; font-size: .9rem; color: #c7cee0; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.amr-link-btn {
	background: none; border: 0; color: #cfe; color: var(--amr-secondary); cursor: pointer;
	text-decoration: underline; font: inherit; padding: 0;
}
.amr-link-btn:hover { color: #fff; }
.amr-consent { margin-top: 18px; color: #aab2cb; }
.amr-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.amr-alert { padding: 12px 16px; border-radius: 6px; margin-bottom: 18px; font-size: .95rem; }
.amr-alert--ok { background: #1f6f4a; color: #fff; }
.amr-alert--err { background: #7a2f2f; color: #fff; }
.amr-disclaimer--form { margin-top: 22px; color: #97a0ba; }

/* ---- Footer disclaimer --------------------------------------------------- */
.amr-footnote { background: var(--amr-light); padding: 30px 0; }
.amr-footnote .amr-disclaimer, .amr-footnote .amr-license { max-width: 80ch; margin: 0 0 10px; }

/* ---- Sticky mobile CTA --------------------------------------------------- */
.amr-sticky-cta {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 9000;
	padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
	background: rgba(255,255,255,.96); border-top: 1px solid var(--amr-border);
	box-shadow: 0 -4px 18px rgba(0,0,0,.08);
}
.amr-sticky-cta.is-hidden { transform: translateY(120%); }
.amr-sticky-cta { transition: transform .25s ease; }

/* ==========================================================================
   Responsive — tablet & up
   ========================================================================== */
@media (min-width: 700px) {
	.amr-edition .amr-hero__ctas { flex-direction: row; align-items: center; }
	.amr-facts-grid { grid-template-columns: repeat(3, 1fr); }
	.amr-cards { grid-template-columns: repeat(2, 1fr); }
	.amr-collections { grid-template-columns: repeat(2, 1fr); }
	.amr-gallery-grid { grid-template-columns: repeat(3, 1fr); }
	.amr-form__row { grid-template-columns: 1fr 1fr; }
	.amr-form__actions { flex-direction: row; }
	.amr-amenity-block { grid-template-columns: 1fr 1fr; align-items: center; }
	.amr-amenity-block:nth-child(even) .amr-amenity__img { order: 2; }
}

@media (min-width: 1024px) {
	.amr-section { padding: 64px 0; }
	.amr-facts-grid { grid-template-columns: repeat(4, 1fr); }
	.amr-cards { grid-template-columns: repeat(3, 1fr); }
	.amr-collections { grid-template-columns: repeat(4, 1fr); }
	.amr-gallery-grid { grid-template-columns: repeat(4, 1fr); }
	/* Sticky bottom bar is a mobile pattern; hide on desktop. */
	.amr-sticky-cta { display: none; }
}

/* ---- Justified body text (per brand request) ----------------------------
   Applied to paragraph-level / running text only. Headings, button labels,
   quick-fact values, breadcrumbs, captions and form labels stay as-is because
   justification on short strings reads poorly. Hyphenation softens rivers. */
.amr-edition .amr-prose p,
.amr-edition .amr-section-lead,
.amr-edition .amr-hero__sub,
.amr-edition .amr-advisor-note,
.amr-edition .amr-card__text,
.amr-edition .amr-collection p,
.amr-edition .amr-ticks li,
.amr-edition .amr-faq__a p,
.amr-edition .amr-finenote,
.amr-edition .amr-consent,
.amr-edition .amr-disclaimer,
.amr-edition .amr-license {
	text-align: justify;
	text-justify: inter-word;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
/* Keep the very short last line / single-line strings from stretching badly. */
.amr-edition .amr-ticks li { text-align: left; } /* ticks are short list items */

/* ---- Honeypot: robustly hidden from humans, still submitted by bots ------ */
.amr-edition .amr-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
	padding: 0 !important;
	margin: -1px !important;
	pointer-events: none;
}

/* ---- Motion / accessibility --------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.amr-edition * { transition: none !important; animation: none !important; }
}
.amr-edition :focus-visible { outline: 2px solid var(--amr-secondary); outline-offset: 2px; }
