/* LZ city experience: hero + benefits. Loads after catalog-design.css; only the existing LZ type, #032926 and #d8011f. */

/* ---------- Hero ---------- */
.lzc-city .lzx-hero-section { padding:128px 0 32px;background:var(--lzc-paper); }
.lzx-hero { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);min-height:520px;position:relative;isolation:isolate;background:var(--lzc-ink);color:#fff;border-radius:20px;overflow:clip;box-shadow:0 1px 2px rgb(3 41 38 / .06),0 28px 52px -30px rgb(3 41 38 / .6); }
.lzx-hero-copy { position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-width:0;padding:clamp(40px,5vw,72px) clamp(32px,4.5vw,64px);background:radial-gradient(90% 70% at 0 0,#0b4a43 0,transparent 70%); }
.lzc-city .lzx-hero .lzx-eyebrow { display:flex;align-items:center;gap:12px;margin:0 0 20px;color:var(--lzc-mint);font-size:12px;font-weight:600;line-height:1.3;letter-spacing:.09em;text-transform:uppercase;text-align:left; }
.lzx-eyebrow::before { content:"";flex:none;width:30px;height:3px;background:repeating-linear-gradient(90deg,#ff6b7e 0 8px,transparent 8px 12px); }
.lzc-city .lzx-hero h1 { margin:0 0 20px;color:#fff;font-size:clamp(36px,4.2vw,62px);font-weight:600;line-height:1.04;letter-spacing:-.04em;text-align:left;text-wrap:balance; }
.lzc-city .lzx-hero-desc p { max-width:520px;margin:0 0 12px;color:#cfe0da;font-size:17px;line-height:1.65;text-align:left; }
.lzx-hero-desc { margin-bottom:14px; }
.lzx-hero .lzc-city-actions { margin-top:4px; }
.lzx-hero .lzc-button { box-shadow:0 0 0 1px rgb(255 255 255 / .22); }
.lzc-city .lzx-hero .lzc-city-phone { color:#fff;font-size:15px;text-decoration:none;border-bottom:1px solid rgb(255 255 255 / .3);min-height:0;padding-block:2px; }
.lzx-hero :is(.lzc-button,.lzc-city-phone):focus-visible { outline:3px solid #fff;outline-offset:3px; }
.lzc-city .lzx-hero .lzx-note { display:flex;align-items:flex-start;gap:8px;margin:26px 0 0;max-width:520px;color:#a9c4bc;font-size:13.5px;line-height:1.5;text-align:left; }
.lzx-note .lzc-icon { flex:none;width:16px;height:16px;margin-top:2px;color:var(--lzc-mint); }
.lzx-note a { color:#fff; }
.lzx-hero-photo { position:relative;margin:0;min-width:0;min-height:100%;overflow:hidden;background:#0b4a43; }
.lzx-hero-photo img { position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center; }
/* Road-line seam: dashed white with a red marker, plus a soft teal blend into the copy panel. */
.lzx-hero-photo::before { content:"";position:absolute;z-index:2;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--lzc-red),var(--lzc-red)) 0 36px/4px 64px no-repeat,repeating-linear-gradient(180deg,rgb(255 255 255 / .55) 0 14px,transparent 14px 28px); }
.lzx-hero-photo::after { content:"";position:absolute;z-index:1;inset:0;pointer-events:none;background:linear-gradient(90deg,rgb(3 41 38 / .5),transparent 28%); }
.lzx-pin { position:absolute;z-index:3;left:24px;bottom:24px;display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 12px;border-radius:999px;background:rgb(3 41 38 / .84);color:#fff;font-size:14px;font-weight:500;line-height:1.2;backdrop-filter:blur(8px); }
.lzx-pin .lzc-icon { width:16px;height:16px;color:var(--lzc-mint); }

/* Quick links keep their editable content; only polish here. */
.lzc-city .lzx-quick { margin-top:20px;gap:16px; }
.lzc-city .lzx-quick .lzk-home-quick-link-card { border-radius:14px;background:#fff;text-decoration:none; }
.lzx-quick .lzk-home-quick-link-card:focus-visible { outline:3px solid var(--lzc-red);outline-offset:3px; }

@keyframes lzx-rise { from { opacity:0;transform:translateY(14px); } to { opacity:1;transform:none; } }
@keyframes lzx-settle { from { transform:scale(1.07); } to { transform:scale(1); } }
@media (prefers-reduced-motion:no-preference) {
	.lzx-hero-copy>* { animation:lzx-rise .7s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--i,0) * 70ms + 80ms); }
	.lzx-hero-copy>:nth-child(2) { --i:1; }
	.lzx-hero-copy>:nth-child(3) { --i:2; }
	.lzx-hero-copy>:nth-child(4) { --i:3; }
	.lzx-hero-copy>:nth-child(5) { --i:4; }
	.lzx-hero-photo img { animation:lzx-settle 1.6s cubic-bezier(.2,.7,.2,1) backwards; }
	.lzx-pin { animation:lzx-rise .6s cubic-bezier(.2,.7,.2,1) .7s backwards; }
	.lzx-quick .lzk-home-quick-link-card { animation:lzx-rise .6s cubic-bezier(.2,.7,.2,1) .45s backwards; }
	.lzx-quick .lzk-home-quick-link-card:nth-child(2) { animation-delay:.53s; }
}
@media (hover:hover) and (pointer:fine) {
	.lzc-city .lzx-hero .lzc-city-phone:hover { border-bottom-color:#fff; }
	.lzx-quick .lzk-home-quick-link-card:hover { border-color:#b9cbbd;box-shadow:0 16px 30px -22px rgb(3 41 38 / .5); }
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
	.lzc-city .lzx-quick .lzk-home-quick-link-card { transition:transform 180ms ease-out,border-color 150ms ease,box-shadow 180ms ease; }
	.lzx-quick .lzk-home-quick-link-card:hover { transform:translateY(-2px); }
	.lzx-quick .lzk-outline-arrow-btn { transition:translate 180ms ease-out; }
	.lzx-quick .lzk-home-quick-link-card:hover .lzk-outline-arrow-btn { translate:4px 0; }
}

@media (max-width:1100px) {
	.lzx-hero { min-height:460px; }
}
@media (max-width:900px) {
	.lzx-hero { grid-template-columns:minmax(0,1fr);min-height:0; }
	.lzx-hero-photo { order:-1;min-height:0;aspect-ratio:16/9; }
	.lzx-hero-photo::before { top:auto;left:0;right:0;bottom:0;width:auto;height:4px;background:linear-gradient(var(--lzc-red),var(--lzc-red)) 32px 0/64px 4px no-repeat,repeating-linear-gradient(90deg,rgb(255 255 255 / .55) 0 14px,transparent 14px 28px); }
	.lzx-hero-photo::after { background:linear-gradient(0deg,rgb(3 41 38 / .45),transparent 35%); }
	.lzx-hero-copy { padding:36px 32px 40px;background:none; }
}
@media (max-width:767px) {
	.lzc-city .lzx-hero-section { padding:108px 0 24px; }
	.lzx-hero { border-radius:16px; }
	.lzx-hero-photo { aspect-ratio:3/2; }
	.lzx-hero-copy { padding:28px 22px 30px; }
	.lzc-city .lzx-hero h1 { font-size:clamp(32px,9.5vw,40px);margin-bottom:16px; }
	.lzc-city .lzx-hero-desc p { font-size:16px;line-height:1.6; }
	.lzx-pin { left:16px;bottom:18px;font-size:13px;padding:8px 14px 8px 10px; }
	.lzx-hero .lzc-city-actions { width:100%;gap:10px 18px; }
	.lzc-city .lzx-quick { gap:10px;margin-top:16px; }
}

/* ---------- Benefits ---------- */
.lzc-city .lz-choose-us-content::before { content:"";display:block;width:48px;height:4px;margin:0 0 18px;background:repeating-linear-gradient(90deg,var(--lzc-red) 0 12px,transparent 12px 18px); }
@media (min-width:1024px) {
	.lzc-city .lz-choose-us-content { position:sticky;top:112px;align-self:start; }
}
.lzc-city .lzc-benefits { counter-reset:lzxb;gap:16px; }
.lzc-city .lzc-benefits .lzc-benefit { counter-increment:lzxb;position:relative;overflow:clip;padding:28px 24px 24px;background:#fff;border:1px solid var(--lzc-line);border-radius:16px;box-shadow:0 1px 2px rgb(3 41 38 / .04),0 14px 30px -24px rgb(3 41 38 / .35); }
.lzc-city .lzc-benefits .lzc-benefit::before { content:"";position:absolute;left:24px;top:0;width:56px;height:3px;background:repeating-linear-gradient(90deg,var(--lzc-red) 0 10px,transparent 10px 14px);transform-origin:left; }
.lzc-city .lzc-benefits .lzc-benefit::after { content:counter(lzxb,decimal-leading-zero);content:counter(lzxb,decimal-leading-zero) / "";position:absolute;top:22px;right:22px;color:#5d6f66;font-size:12px;font-weight:600;letter-spacing:.08em; }
.lzc-city .lzc-benefits .lzc-benefit>img { float:none;display:block;box-sizing:border-box;width:56px;height:56px;padding:10px;margin:0 0 18px;object-fit:contain;background:#e4efe7;border-radius:14px; }
.lzc-city .lzc-benefits .lzc-benefit h3 { display:block;min-height:0;margin:0 0 10px;color:var(--lzc-ink);font-size:19px;font-weight:600;line-height:1.2;letter-spacing:-.02em;text-wrap:balance; }
.lzc-city .lzc-benefits .lzc-benefit p { margin:0;color:#4a5a52;font-size:14.5px;line-height:1.65; }
.lzc-city .lzc-benefits .lzc-benefit a { text-underline-offset:3px; }
.lzc-city .lzc-benefits .lzc-benefit:focus-within { border-color:var(--lzc-ink); }

@media (prefers-reduced-motion:no-preference) {
	/* Opacity is never touched: content stays readable even if this script never runs. */
	.lzc-benefits.lzx-motion .lzc-benefit { transform:translateY(22px);transition:transform .7s cubic-bezier(.2,.7,.2,1) var(--lzx-d,0ms),box-shadow .3s ease,border-color .3s ease; }
	.lzc-benefits.lzx-motion .lzc-benefit>img { transform:scale(.6);transition:transform .6s cubic-bezier(.34,1.56,.64,1) calc(var(--lzx-d,0ms) + 160ms); }
	.lzc-benefits.lzx-motion .lzc-benefit::before { transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.7,.2,1) calc(var(--lzx-d,0ms) + 250ms); }
	.lzc-benefits.lzx-motion .lzc-benefit.is-in,
	.lzc-benefits.lzx-motion .lzc-benefit.is-in>img,
	.lzc-benefits.lzx-motion .lzc-benefit.is-in::before { transform:none; }
	.lzc-benefits.lzx-motion .lzc-benefit.is-done { transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease,border-color .3s ease; }
	.lzc-benefits.lzx-motion .lzc-benefit.is-done>img { transition:transform .3s cubic-bezier(.2,.7,.2,1); }
}
@media (hover:hover) and (pointer:fine) {
	.lzc-city .lzc-benefits .lzc-benefit:hover { border-color:#b9cbbd;box-shadow:0 2px 4px rgb(3 41 38 / .06),0 24px 40px -22px rgb(3 41 38 / .45); }
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
	.lzc-city .lzc-benefits .lzc-benefit { transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease,border-color .3s ease; }
	.lzc-city .lzc-benefits .lzc-benefit>img { transition:transform .3s cubic-bezier(.2,.7,.2,1); }
	.lzc-city .lzc-benefits .lzc-benefit:hover { transform:translateY(-4px); }
	.lzc-city .lzc-benefits .lzc-benefit:hover>img { transform:translateY(-3px) rotate(-6deg); }
}
@media (max-width:479px) {
	.lzc-city .lzc-benefits .lzc-benefit { padding:24px 20px 20px; }
	.lzc-city .lzc-benefits .lzc-benefit>img { width:48px;height:48px;margin-bottom:14px; }
}
