/* Homepage "Abholschein" layer. Loaded after home-editorial.css and home-refresh.css; every rule is scoped to
   .ha-main (or body.home-atelier) so the shared header, footer, dialogs and the receipt/contact result states keep
   their existing look. Rules stay specific by scope, not by force. */
body.home-atelier {
  background: #f2ebdd radial-gradient(#10233f1c 1px, transparent 1.2px) 0 0 / 22px 22px;
}
.ha-main {
  --ha-paper: #f2ebdd; --ha-card: #fffcf6; --ha-ink: #10233f; --ha-ink2: #4a5b70; --ha-ink3: #80705c;
  --ha-copper: #a4562b; --ha-stamp: #b8412b; --ha-navy: #0f2747; --ha-navy2: #173a63;
  --ha-gold1: #f0d47e; --ha-gold2: #d5a947; --ha-line: #dfd2bb; --ha-mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, monospace;
  --ha-sh: 0 1px 2px #10233f10, 0 18px 40px -18px #10233f44;
  min-height: 0; color: var(--ha-ink); font: 16px/1.55 "Work Sans", system-ui, sans-serif; position: relative;
}
.ha-main *, .ha-main *::before, .ha-main *::after { box-sizing: border-box; }
.ha-main img { display: block; max-width: 100%; height: auto; }
:where(.ha-main) a { color: inherit; }
.ha-wrap { width: min(1260px, 100% - 48px); margin-inline: auto; position: relative; }
.ha-main h1, .ha-main h2, .ha-main h3 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; letter-spacing: -.012em; margin: 0; color: var(--ha-ink); }
.ha-eyebrow { display: block; margin: 0; font: 600 11.5px/1 var(--ha-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--ha-copper); }
.ha-lead { margin: 8px 0 0; font: italic 500 clamp(20px, 2vw, 26px)/1.25 "Cormorant Garamond", serif; color: var(--ha-copper); }
.ha-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 12px; padding: 12px 18px; font: 600 14px/1 "Work Sans", sans-serif; text-decoration: none; border: 1.5px solid transparent; cursor: pointer; transition: transform .18s, box-shadow .18s, background .18s; min-height: 44px; }
.ha-btn:hover { transform: translateY(-2px); }
.ha-main .ha-btn--gold { background: linear-gradient(135deg, var(--ha-gold1), var(--ha-gold2)); color: #2a1d02; box-shadow: 0 12px 24px -12px #b98a1faa; }
.ha-main .ha-btn--navy { background: var(--ha-navy); color: #fff; }
.ha-main .ha-btn--out { border-color: var(--ha-ink); color: var(--ha-ink); background: transparent; }
.ha-main .ha-btn--out:hover { background: var(--ha-ink); color: #fff; }
.ha-main .ha-btn--line { border-color: #ffffff66; color: #fff; background: transparent; }
.ha-btn--sm { padding: 9px 13px; font-size: 13px; min-height: 40px; }
.ha-main :focus-visible { outline: 3px solid var(--ha-copper); outline-offset: 2px; }

/* reading ruler */
.ha-tape { position: fixed; left: 0; right: 0; top: 0; height: 9px; z-index: 70; pointer-events: none; background: repeating-linear-gradient(90deg, #10233f 0 1px, transparent 1px 10px) 0 100% / 100% 5px no-repeat, repeating-linear-gradient(90deg, #10233f 0 1px, transparent 1px 50px) 0 100% / 100% 9px no-repeat; }
.ha-tape i { position: absolute; inset: 0; transform-origin: 0 50%; transform: scaleX(0); background: linear-gradient(90deg, #a4562b33, #a4562b); opacity: .55; }

/* hero */
.ha-hero { padding: 26px 0 0; overflow-x: clip; }
.ha-hero-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 22px; min-height: 600px; align-items: center; }
.ha-hero-grid > * { min-width: 0; }
.ha-copy { grid-column: 1 / 6; grid-row: 1; position: relative; z-index: 3; padding: 10px 0 20px; display: flex; flex-direction: column; gap: 20px; }
.ha-main .ha-copy h1 { font-size: clamp(52px, 6.1vw, 94px); line-height: .9; letter-spacing: -.025em; }
.ha-eyebrow + .ha-h1, .ha-copy h1 .ha-eyebrow { margin-bottom: 18px; }
.ha-h1 { display: block; }
.ha-h1 > span { display: block; }
.ha-h1 .ha-l2 { font-style: italic; font-weight: 500; margin-left: .35em; }
.ha-h1 .ha-l3 { color: var(--ha-copper); font-weight: 700; margin-left: .1em; }
.ha-sig { margin: 0; font: 500 15px/1.4 "Work Sans", sans-serif; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; color: var(--ha-ink2); }
.ha-sig i { width: 5px; height: 5px; border-radius: 50%; background: var(--ha-copper); }
.ha-berlin { background: linear-gradient(90deg, #d35400, #d4a300, #2e8b57, #2563b8, #7a3b9e); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 700; }
.ha-brand { background: var(--ha-navy); color: #fff; border-radius: 6px; padding: 3px 9px; font: 700 11.5px/1.2 var(--ha-mono); letter-spacing: .1em; text-transform: uppercase; }
.ha-sub { margin: 0; font-size: 17px; color: var(--ha-ink2); max-width: 44ch; }
.ha-photo { grid-column: 6 / 13; grid-row: 1; height: 560px; margin: 0; border-radius: 26px; overflow: hidden; position: relative; box-shadow: var(--ha-sh); background: #d9d2c4; }
.ha-photo picture, .ha-photo img { width: 100%; height: 100%; }
.ha-photo img { object-fit: cover; object-position: 62% 50%; transform: scale(1.04); transition: transform 1.6s cubic-bezier(.2, .7, .2, 1); }
.ha-photo:hover img { transform: translateX(10%) scale(1.25); }
/* desktop: the ticket covers the left of the photo, so the photo is zoomed from its top left corner to bring the reception TV with the LeoClean logo into the free area on the right */
@media (min-width: 1181px) {
  .ha-photo img { transform-origin: 0% 0%; transform: translateX(10%) scale(1.2); }
  .ha-photo:hover img { transform: translateX(10%) scale(1.25); }
}
.ha-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, transparent 50%, #0f274777); pointer-events: none; }
.ha-now, .ha-cap { position: absolute; z-index: 2; border-radius: 12px; font-size: 12.5px; line-height: 1.35; box-shadow: var(--ha-sh); }
.ha-now { right: 16px; top: 16px; max-width: 250px; padding: 9px 12px; background: #fffcf6e6; font: 600 12px/1.35 var(--ha-mono); }
.ha-now:empty { display: none; }
.ha-now small { display: block; font-weight: 500; color: var(--ha-ink2); }
.ha-cap { right: 16px; bottom: 16px; max-width: 262px; padding: 11px 13px; background: #0f2747d9; color: #fff; }

/* ticket */
.ha-ticket-wrap { grid-column: 6 / 10; grid-row: 1; z-index: 4; align-self: center; margin-left: -30px; max-width: 410px; position: relative; filter: drop-shadow(0 26px 30px #10233f40); transform: rotate(-1.6deg) perspective(900px) rotateX(var(--ha-rx, 0deg)) rotateY(var(--ha-ry, 0deg)); transition: transform .3s ease-out; }
.ha-ticket { position: relative; background: var(--ha-card); padding: 22px 24px 0; border-radius: 6px; --ha-perf: 72%;
  -webkit-mask: radial-gradient(circle 11px at left var(--ha-perf), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 11px at right var(--ha-perf), #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle 11px at left var(--ha-perf), #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 11px at right var(--ha-perf), #0000 97%, #000) right / 51% 100% no-repeat; }
.ha-ticket::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 7px; background: repeating-linear-gradient(90deg, var(--ha-navy) 0 10px, var(--ha-stamp) 10px 20px); }
.ha-th { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding-top: 6px; }
.ha-th b { font: 700 12px/1 var(--ha-mono); letter-spacing: .2em; }
.ha-th span { font: 500 10.5px/1.2 var(--ha-mono); color: var(--ha-ink3); text-align: right; padding-right: 62px; }
.ha-picker { margin: 12px 0 0; padding: 0; border: 0; min-width: 0; }
.ha-tq { padding: 0; font: 600 11px/1 var(--ha-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ha-ink3); }
.ha-tb { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 8px 0 0; }
.ha-branch { position: relative; display: block; text-align: left; cursor: pointer; border: 1.5px dashed #b9a98a; border-radius: 10px; padding: 9px 11px; background: #fffdf8; color: var(--ha-ink); font: inherit; transition: .18s; min-height: 44px; }
.ha-branch strong { display: block; font: 600 22px/1 "Cormorant Garamond", serif; }
.ha-branch span { display: block; font: 500 10.5px/1.35 var(--ha-mono); color: var(--ha-ink3); margin-top: 4px; }
.ha-open { display: inline-flex; gap: 5px; align-items: center; margin-top: 6px; font: 600 10.5px/1 var(--ha-mono); font-style: normal; color: #1f6b3a; }
.ha-open:empty { display: none; }
.ha-open::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #2e9b5a; box-shadow: 0 0 0 3px #2e9b5a33; }
.ha-open.is-closed { color: #8a4b00; }
.ha-open.is-closed::before { background: #d98a1f; box-shadow: 0 0 0 3px #d98a1f33; }
.ha-branch:hover { border-color: var(--ha-ink); }
.ha-branch[aria-pressed="true"] { border: 1.5px solid var(--ha-navy); background: #fff; box-shadow: inset 0 0 0 1px var(--ha-navy); }
.ha-branch[aria-pressed="true"]::after { content: "✓"; position: absolute; right: 9px; top: 7px; font: 700 13px var(--ha-mono); color: var(--ha-navy); }
.ha-hintl { margin: 7px 0 0; font: 500 11px/1.3 var(--ha-mono); color: var(--ha-ink3); }
.ha-rows { margin: 14px 0 0; padding: 0; }
.ha-rw { display: grid; grid-template-columns: 78px 1fr; gap: 10px; padding: 9px 0; border-top: 1px dashed #cdbd9f; align-items: baseline; }
.ha-rw dt { font: 700 11px/1.2 var(--ha-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--ha-copper); }
.ha-rw dd { margin: 0; font-size: 13px; line-height: 1.4; color: var(--ha-ink2); }
.ha-perf { position: relative; margin: 2px -24px 0; border-top: 2px dashed #b9a98a; height: 0; }
.ha-perf::after { content: "✂"; position: absolute; left: 34px; top: -12px; font-size: 15px; color: #8d7c60; background: var(--ha-card); padding: 0 4px; }
.ha-stub { padding: 18px 0 20px; display: grid; gap: 10px; }
.ha-cta { display: flex; align-items: center; justify-content: center; text-align: center; width: 100%; min-height: 52px; padding: 14px 16px; border-radius: 12px; background: linear-gradient(135deg, var(--ha-gold1), var(--ha-gold2)); color: #2a1d02; font: 700 15px/1.2 "Work Sans", sans-serif; text-decoration: none; box-shadow: 0 12px 24px -12px #b98a1faa; transition: transform .18s; }
.ha-cta::after { content: "→"; margin-left: 8px; transition: transform .2s; }
.ha-cta:hover { transform: translateY(-2px); }
.ha-cta:hover::after { transform: translateX(3px); }
.ha-offer { font: 500 11.5px/1.45 var(--ha-mono); color: var(--ha-ink2); }
.ha-offer b { color: var(--ha-ink); }
.ha-stamp { position: absolute; right: -26px; top: -30px; z-index: 5; width: 92px; height: 92px; border-radius: 50%; border: 3px double var(--ha-stamp); color: var(--ha-stamp); display: grid; place-items: center; text-align: center; font: 800 11px/1.15 var(--ha-mono); letter-spacing: .06em; transform: rotate(-14deg); background: #fffcf6cc; animation: ha-thud .7s .5s both cubic-bezier(.2, 1.4, .4, 1); pointer-events: none; }
.ha-stamp b { display: block; font: 700 26px/1 "Cormorant Garamond", serif; letter-spacing: 0; }
@keyframes ha-thud { from { transform: rotate(-30deg) scale(1.9); opacity: 0; } to { transform: rotate(-14deg) scale(1); opacity: .95; } }
.ha-punch { grid-column: 10 / 13; grid-row: 1; z-index: 4; align-self: end; justify-self: end; width: min(300px, 100%); margin: 0 8px 28px 0; display: block; background: linear-gradient(150deg, #10233f, #1a4272); color: #fff; border-radius: 16px; padding: 14px 16px; box-shadow: var(--ha-sh); transform: rotate(2.4deg); text-decoration: none; transition: transform .25s; }
.ha-punch:hover { transform: rotate(0) translateY(-4px); }
.ha-pt { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.ha-pt small { font: 700 10.5px/1.2 var(--ha-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ha-gold1); }
.ha-pt i { font: 700 15px/1 "Cormorant Garamond", serif; font-style: normal; background: linear-gradient(135deg, var(--ha-gold1), var(--ha-gold2)); color: #2a1d02; border-radius: 999px; padding: 4px 9px; }
.ha-punch strong { display: block; font: 600 17px/1.2 "Work Sans", sans-serif; margin: 8px 0 4px; }
.ha-pc { display: block; font-size: 12px; color: #c9d7e8; line-height: 1.4; }
.ha-dots { display: flex; gap: 5px; margin-top: 9px; }
.ha-dots i { width: 16px; height: 16px; border-radius: 50%; border: 1.5px dashed #ffffff66; }
.ha-dots i:first-child { background: var(--ha-gold1); border: 0; position: relative; }
.ha-dots i:first-child::after { content: "+"; position: absolute; inset: 0; display: grid; place-items: center; font: 800 11px var(--ha-mono); color: #2a1d02; }
.ha-pgo { display: inline-block; margin-top: 9px; font: 700 12px/1 "Work Sans", sans-serif; color: var(--ha-gold1); }

/* receipt slip (existing form, collapsed bar by default) */
.ha-strip { margin-top: 34px; }
.ha-slipw { filter: drop-shadow(0 10px 16px #10233f22); }
.ha-slip { position: relative; background: var(--ha-card); border-radius: 8px; padding: 18px 26px;
  -webkit-mask: radial-gradient(circle 10px at left 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 10px at right 50%, #0000 97%, #000) right / 51% 100% no-repeat;
  mask: radial-gradient(circle 10px at left 50%, #0000 97%, #000) left / 51% 100% no-repeat, radial-gradient(circle 10px at right 50%, #0000 97%, #000) right / 51% 100% no-repeat; }
.ha-slip .receipt-lookup { margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.ha-slip .receipt-lookup.is-collapsed { padding-bottom: 0; }
.ha-slip .receipt-lookup-copy { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.ha-slip .receipt-lookup-copy h3 { font: 600 28px/1.05 "Cormorant Garamond", serif; display: flex; align-items: center; gap: 12px; }
.ha-slip .receipt-lookup-copy h3::after { content: ""; display: inline-block; height: 26px; width: 74px; background: repeating-linear-gradient(90deg, #10233f 0 2px, transparent 2px 4px, #10233f 4px 5px, transparent 5px 9px, #10233f 9px 12px, transparent 12px 14px); opacity: .82; }
.ha-slip .receipt-lookup-copy p { margin: 4px 0 0; font-size: 12.5px; color: var(--ha-ink2); max-width: 64ch; }
.ha-slip .receipt-toggle { border-radius: 12px; background: var(--ha-navy); color: #fff; border: 0; min-height: 44px; padding: 10px 18px; font: 600 14px/1 "Work Sans", sans-serif; cursor: pointer; }
.ha-slip .receipt-lookup-grid { margin-top: 14px; display: grid; grid-template-columns: 150px repeat(3, minmax(0, 1fr)) auto; gap: 10px; align-items: end; }
.ha-slip .receipt-lookup label { font: 600 10.5px/1.2 var(--ha-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ha-ink3); }
.ha-slip .receipt-lookup input, .ha-slip .receipt-lookup select { min-height: 44px; background: #fbf6ea; border: 1.5px solid var(--ha-line); border-radius: 10px; color: var(--ha-ink); }
.ha-slip .receipt-lookup .button-dark { border-radius: 12px; background: var(--ha-navy); color: #fff; border: 0; min-height: 44px; }
.ha-slip .receipt-lookup-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px; padding-top: 12px; border-top: 1px dashed #cdbd9f; }
.ha-slip .receipt-lookup-actions .button { border-radius: 10px; min-height: 40px; }
.ha-slip .receipt-lookup-note, .ha-slip .receipt-system-trust { font: 500 12px/1.45 var(--ha-mono); color: var(--ha-ink2); background: transparent; border-left: 0; padding: 0; margin: 8px 0 0; }
.ha-slip .receipt-system-trust a { color: var(--ha-ink); font-weight: 700; }

/* sections */
.ha-block { padding: clamp(44px, 5vw, 70px) 0 0; }
.ha-sh2 { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; margin-bottom: 20px; }
.ha-sh2 > div { flex: 1 1 560px; }
.ha-sh2 > p { margin: 0; max-width: 40ch; color: var(--ha-ink2); font-size: 14.5px; }
.ha-main h2 { font-size: clamp(34px, 3.9vw, 56px); line-height: .95; }
.ha-sh2 h2, .ha-why-copy h2 { margin-top: 12px; }

/* why: polaroids */
.ha-why-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: center; }
.ha-why-grid > * { min-width: 0; }
.ha-pol { position: relative; height: 400px; }
.ha-pol figure { position: absolute; margin: 0; background: #fffefa; padding: 10px; box-shadow: var(--ha-sh); transition: transform .4s; }
.ha-pol figure picture, .ha-pol figure img { width: 100%; height: 100%; }
.ha-pol figure img { object-fit: cover; }
.ha-pol figure::before { content: ""; position: absolute; left: 50%; top: -12px; width: 78px; height: 24px; transform: translateX(-50%) rotate(-3deg); background: #e9d9a8aa; border: 1px solid #d3c088aa; z-index: 2; }
.ha-p1 { left: 0; top: 10px; width: 58%; height: 280px; transform: rotate(-3.4deg); }
.ha-p2 { right: 0; top: 0; width: 48%; height: 220px; transform: rotate(3.2deg); }
.ha-p3 { right: 6%; bottom: 0; width: 50%; height: 190px; transform: rotate(-1.6deg); }
.ha-pol figure:hover { transform: rotate(0) scale(1.04); z-index: 5; }
.ha-pol-note { position: absolute; left: 0; bottom: 6px; width: 46%; margin: 0; font: italic 600 21px/1.15 "Cormorant Garamond", serif; color: var(--ha-copper); }
.ha-intro { margin: 0 0 16px; color: var(--ha-ink2); }
.ha-proofs { display: grid; gap: 8px; margin: 14px 0; }
.ha-proof { display: grid; grid-template-columns: 42px 1fr; gap: 12px; align-items: center; padding: 8px 12px; background: #fffcf6; border: 1px solid var(--ha-line); border-radius: 12px; }
.ha-proof i { width: 42px; height: 42px; border-radius: 50%; border: 2px double var(--ha-stamp); color: var(--ha-stamp); display: grid; place-items: center; font: 800 12px var(--ha-mono); font-style: normal; transform: rotate(-8deg); }
.ha-proof b { display: block; font: 600 21px/1.05 "Cormorant Garamond", serif; }
.ha-proof span { font-size: 13px; color: var(--ha-ink2); line-height: 1.4; display: block; margin-top: 2px; }
.ha-ai { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, #0f2747, #173a63); color: #fff; }
.ha-ai-av { width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #5b7cff, #2b50d8); display: grid; place-items: center; font: 700 13px "Work Sans", sans-serif; position: relative; }
.ha-ai-av::after { content: ""; position: absolute; right: -3px; top: -3px; width: 11px; height: 11px; border-radius: 50%; background: #2fd37c; border: 2px solid #173a63; }
.ha-ai-t { flex: 1; min-width: 220px; font-size: 13.5px; line-height: 1.4; }
.ha-ai-t b { display: block; font-size: 15px; }
.ha-ai-t p { margin: 0; }
.ha-ai .leoai-discovery-link { text-decoration: none; margin: 0; }

/* services menu */
.ha-menu { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(24px, 4vw, 64px); align-items: start; }
.ha-menu > * { min-width: 0; }
.ha-items { border-top: 2px solid var(--ha-ink); }
.ha-item { position: relative; display: grid; grid-template-columns: 34px 38px 1fr auto; gap: 14px; align-items: center; padding: 9px 4px; border-bottom: 1px dashed #b9a98a; transition: padding .25s, background .25s; }
.ha-no { font: 600 12px var(--ha-mono); color: var(--ha-ink3); }
.ha-ic { display: grid; color: var(--ha-copper); }
.ha-ic-svg { width: 30px; height: 30px; }
.ha-it h3 { font-size: clamp(26px, 2.3vw, 34px); line-height: 1; }
.ha-it p { margin: 3px 0 0; font-size: 13.5px; color: var(--ha-ink2); }
.ha-go { font: 600 12.5px/1 "Work Sans", sans-serif; white-space: nowrap; color: var(--ha-ink); text-decoration: none; background: none; border: 0; padding: 0; cursor: pointer; opacity: .55; transition: .25s; }
.ha-go::before { content: ""; position: absolute; inset: 0; }
.ha-go::after { content: " →"; }
.ha-item:hover, .ha-item.is-on { padding-left: 14px; background: linear-gradient(90deg, #a4562b14, transparent); }
.ha-item:hover .ha-go, .ha-item.is-on .ha-go { opacity: 1; color: var(--ha-copper); }
.ha-item--act { background: var(--ha-navy); color: #fff; border-radius: 10px; border: 0; margin-top: 10px; padding: 13px 16px; }
.ha-item--act h3, .ha-item--act .ha-go { color: #fff; }
.ha-item--act p { color: #cfdbea; }
.ha-item--act .ha-ic { color: var(--ha-gold1); }
.ha-item--act .ha-no { color: #9fb3cc; }
.ha-item--act .ha-go { color: var(--ha-gold1); opacity: 1; }
.ha-item--act:hover { background: var(--ha-navy2); padding-left: 16px; }
.ha-preview { position: sticky; top: 96px; margin: 0; aspect-ratio: 4 / 4.1; border-radius: 22px; overflow: hidden; box-shadow: var(--ha-sh); background: #d9d0bd; }
.ha-preview img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.06); transition: opacity .5s, transform 1.2s; }
.ha-preview img.is-on { opacity: 1; transform: scale(1); }
.ha-preview figcaption { position: absolute; left: 14px; bottom: 14px; right: 14px; z-index: 2; background: #0f2747d9; color: #fff; border-radius: 10px; padding: 10px 13px; font: 600 12px/1.3 var(--ha-mono); letter-spacing: .04em; }
.ha-preview::after { content: ""; position: absolute; inset: 0; border: 1px solid #ffffff55; border-radius: 22px; pointer-events: none; }

/* gift tag + LeoCan comic */
.ha-duo { display: grid; grid-template-columns: 1.1fr 1fr; gap: 20px; }
.ha-duo > * { min-width: 0; }
.ha-tagw { position: relative; filter: drop-shadow(0 20px 24px #10233f44); transform-origin: 20px 20px; transition: transform .8s cubic-bezier(.3, 1.6, .5, 1); }
.ha-tagw:hover { transform: rotate(1.8deg); }
.ha-tag { position: relative; background: linear-gradient(140deg, #0b1f3c, #16385f); color: #fff; padding: 30px 0 30px 34px; display: grid; grid-template-columns: 1fr 250px; min-height: 300px; clip-path: polygon(44px 0, 100% 0, 100% 100%, 0 100%, 0 44px); border-radius: 0 28px 28px 28px; overflow: clip; }
.ha-tag::before { content: ""; position: absolute; left: 14px; top: 14px; width: 16px; height: 16px; border-radius: 50%; background: #f2ebdd; box-shadow: inset 0 0 0 3px #ffffff33; }
.ha-tag-copy { display: flex; flex-direction: column; gap: 13px; align-items: flex-start; justify-content: center; padding-left: 14px; min-width: 0; }
.ha-new { font: 700 10.5px/1.3 var(--ha-mono); letter-spacing: .1em; text-transform: uppercase; background: var(--ha-gold1); color: #2a1d02; border-radius: 4px; padding: 6px 9px; }
.ha-main .ha-tag h2 { color: #fff; font-size: clamp(36px, 3.8vw, 56px); }
.ha-tag p { margin: 0; color: #cddbec; font-size: 14.5px; max-width: 36ch; }
.ha-tag-actions { display: flex; gap: 9px; flex-wrap: wrap; }
.ha-tag-media { position: relative; display: block; }
.ha-tag-media img { position: absolute; right: -26px; top: 50%; width: 300px; max-width: none; height: auto; transform: translateY(-50%) rotate(-6deg); border-radius: 14px; box-shadow: 0 26px 40px -16px #000b; transition: transform .5s; }
.ha-tagw:hover .ha-tag-media img { transform: translateY(-50%) rotate(-2deg) scale(1.04); }
.ha-comic { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; background: #161616; padding: 8px; border-radius: 22px; min-height: 300px; box-shadow: var(--ha-sh); }
.ha-comic::before { content: ""; border-radius: 10px; background: #f7efdc url("/images/leocan/home-teaser-lion-v20261020.webp") center 30% / cover no-repeat; }
.ha-comic .lc-home-teaser { position: static; display: flex; flex-direction: column; justify-content: center; gap: 10px; min-width: 0; padding: 18px; border: 0; border-radius: 10px; background: #f7efdc; color: var(--ha-ink); box-shadow: none; overflow: hidden; }
.ha-comic .lc-home-teaser::before { display: none; }
.ha-comic .lc-home-teaser-media { width: 100%; justify-self: stretch; }
.ha-comic .lc-home-teaser-media img { aspect-ratio: auto; max-height: 150px; object-fit: cover; border-radius: 8px; }
.ha-comic .lc-home-teaser-copy { display: flex; flex-direction: column; gap: 8px; }
.ha-comic .lc-kicker { margin: 0; font: 600 11px/1 var(--ha-mono); letter-spacing: .16em; color: var(--ha-copper); }
.ha-comic .lc-home-teaser h2 { margin: 0; max-width: none; font: 600 27px/1.02 "Cormorant Garamond", serif; color: var(--ha-ink); }
.ha-comic .lc-home-teaser p { margin: 0; max-width: none; font-size: 13px; line-height: 1.4; color: #5a4a33; }
.ha-comic .lc-home-teaser-actions { gap: 8px; margin-top: 6px; }
.ha-comic .lc-button { min-height: 40px; padding: 9px 13px; border-radius: 12px; background: var(--ha-navy); color: #fff; font: 600 13px/1 "Work Sans", sans-serif; }
.ha-comic .lc-home-teaser-all { min-height: 40px; padding: 9px 13px; border-radius: 12px; background: #fffcf6; color: var(--ha-ink); text-decoration: none; font: 600 13px/1 "Work Sans", sans-serif; }

/* visit */
.ha-visit-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 20px; align-items: start; }
.ha-visit-grid > * { min-width: 0; }
.ha-bgrid { display: grid; gap: 14px; }
.ha-bc { background: var(--ha-card); border: 1px solid var(--ha-line); border-radius: 18px; overflow: hidden; box-shadow: var(--ha-sh); display: grid; grid-template-columns: 230px 1fr; }
.ha-bc-media { min-height: 100%; }
.ha-bc-media img { width: 100%; height: 100%; min-height: 100%; object-fit: cover; }
.ha-bc-in { padding: 16px 20px 18px; display: grid; gap: 8px; align-content: start; min-width: 0; }
.ha-bc h3 { font-size: 34px; }
.ha-addr { margin: 0; font-size: 14px; color: var(--ha-ink2); line-height: 1.45; }
.ha-hrs { margin: 0; font: 500 12.5px/1.5 var(--ha-mono); color: var(--ha-ink2); background: #f6efe0; border-radius: 8px; padding: 8px 10px; }
.ha-chips { display: flex; gap: 5px; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.ha-chips li { font: 600 11px/1 var(--ha-mono); border: 1px solid var(--ha-line); border-radius: 999px; padding: 5px 8px; color: var(--ha-ink2); background: #fffdf8; }
.ha-ml { margin: 0; font-size: 13px; color: var(--ha-ink2); }
.ha-ml a { font-weight: 600; color: var(--ha-ink); }
.ha-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.ha-gnote { margin: 2px 4px 0; font-size: 12.5px; color: var(--ha-ink3); }
.ha-gnote a { font-weight: 700; color: var(--ha-ink); }
.ha-form { background: var(--ha-card); border: 1px solid var(--ha-line); border-radius: 18px; box-shadow: var(--ha-sh); padding: 22px; position: sticky; top: 96px; }
.ha-form h2 { font-size: 32px; margin-top: 8px; }
.ha-form .ha-lead { font-size: 21px; margin-top: 4px; }
.ha-sm { font-size: 13px; color: var(--ha-ink2); margin: 8px 0 10px; }
.ha-cts { display: grid; gap: 10px; font: 500 11.5px/1.45 var(--ha-mono); color: var(--ha-ink2); padding: 0 0 12px; margin: 0 0 12px; border-bottom: 1px dashed #cdbd9f; }
.ha-cts a { font-weight: 700; color: var(--ha-ink); text-decoration: none; width: auto; overflow-wrap: anywhere; }
.ha-cts a:hover, .ha-cts a:focus-visible { color: var(--ha-copper); text-decoration: underline; }
.ha-ct-main { font-size: 12.5px; }
.ha-ct-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ha-ct-col { display: grid; align-content: start; gap: 4px; padding: 9px 11px; border: 1.5px dashed #cdbd9f; border-radius: 10px; background: #fffcf6; }
.ha-ct-col b { font: 800 10.5px/1.2 var(--ha-mono); letter-spacing: .14em; color: var(--ha-copper); margin-bottom: 2px; }
.ha-form .contact-form { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.ha-form .form-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
.ha-form .form-field label { margin: 0 0 5px; font: 600 10.5px/1.2 var(--ha-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ha-ink3); }
.ha-form .contact-form input, .ha-form .contact-form select, .ha-form .contact-form textarea { min-height: 44px; background: #fbf6ea; border: 1.5px solid var(--ha-line); border-radius: 10px; color: var(--ha-ink); }
.ha-form .contact-form textarea { min-height: 70px; }
.ha-form .privacy-check, .ha-form .form-field label.privacy-check { font: 400 12px/1.4 "Work Sans", sans-serif; letter-spacing: 0; text-transform: none; color: var(--ha-ink2); }
.ha-form .contact-form-actions .button-primary { border-radius: 12px; background: linear-gradient(135deg, var(--ha-gold1), var(--ha-gold2)); color: #2a1d02; border: 0; font-weight: 700; min-height: 46px; }

/* care label strip */
.ha-label { margin-top: clamp(44px, 5vw, 72px); background: #e9dcc0; border-top: 2px dashed #a58f66; border-bottom: 2px dashed #a58f66; padding: 14px 0; color: #5b4a2c; }
.ha-label .ha-wrap { display: flex; gap: 26px; align-items: center; justify-content: center; }
.ha-label svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

/* reveal */
.ha-rv { opacity: 0; transform: translateY(20px); transition: opacity .7s, transform .7s cubic-bezier(.2, .7, .2, 1); }
.ha-rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .ha-rv { opacity: 1; transform: none; transition: none; }
  .ha-stamp { animation: none; }
  .ha-photo img, .ha-pol figure, .ha-preview img, .ha-tagw, .ha-tag-media img, .ha-punch, .ha-cta, .ha-btn { transition: none; }
  .ha-ticket-wrap { transform: rotate(-1.6deg); }
}

@media (max-width: 1180px) {
  .ha-hero-grid { grid-template-columns: 1fr; min-height: 0; gap: 18px; }
  .ha-copy, .ha-photo, .ha-ticket-wrap, .ha-punch { grid-column: 1; grid-row: auto; }
  .ha-photo { height: 340px; order: 3; }
  .ha-ticket-wrap { margin: 0; max-width: none; transform: none; }
  .ha-stamp { right: 8px; }
  .ha-punch { justify-self: stretch; width: auto; margin: 0; transform: none; order: 4; }
  .ha-slip .receipt-lookup-grid { grid-template-columns: 1fr 1fr; }
  .ha-slip .receipt-lookup-grid .button-dark { grid-column: 1 / -1; }
  .ha-why-grid, .ha-menu, .ha-duo, .ha-visit-grid { grid-template-columns: 1fr; }
  .ha-preview { display: none; }
  .ha-form { position: static; }
}
@media (max-width: 640px) {
  .ha-wrap { width: calc(100% - 28px); }
  .ha-hero { padding-top: 14px; }
  .ha-main .ha-copy h1 { font-size: clamp(48px, 14.5vw, 60px); }
  .ha-copy { gap: 12px; }
  .ha-photo { height: 190px; border-radius: 20px; }
  .ha-cap { display: none; }
  .ha-sub { font-size: 15.5px; }
  .ha-stamp { width: 76px; height: 76px; top: -34px; right: -2px; font-size: 9px; }
  .ha-stamp b { font-size: 20px; }
  .ha-dots { display: none; }
  .ha-punch { padding: 12px 14px; }
  .ha-punch strong { font-size: 15.5px; }
  .ha-strip { margin-top: 30px; }
  .ha-slip { padding: 14px 16px; }
  .ha-slip .receipt-lookup-copy h3::after { display: none; }
  .ha-slip .receipt-lookup-copy p { display: none; }
  .ha-slip .receipt-lookup-grid { grid-template-columns: 1fr; }
  .ha-pol { height: 262px; }
  .ha-p1 { width: 60%; height: 196px; }
  .ha-p2 { width: 48%; height: 160px; }
  .ha-p3 { display: none; }
  .ha-pol-note { font-size: 15px; width: 50%; left: 44%; top: auto; }
  .ha-proofs { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: 14px; gap: 10px; margin: 12px -14px; padding: 2px 14px 8px; scrollbar-width: none; }
  .ha-proofs::-webkit-scrollbar { display: none; }
  .ha-proof { flex: 0 0 84%; scroll-snap-align: start; }
  .ha-items { border-top-width: 1px; }
  .ha-item { grid-template-columns: 26px 30px 1fr; gap: 10px; }
  .ha-item .ha-go { display: block; grid-column: 3; justify-self: start; opacity: 1; font-size: 12px; }
  .ha-ic-svg { width: 25px; height: 25px; }
  .ha-it h3 { font-size: 27px; }
  .ha-tag { grid-template-columns: 1fr; padding: 26px 20px 0 22px; min-height: 0; }
  .ha-tag-media { height: 150px; overflow: hidden; }
  .ha-tag-media img { position: static; transform: none; width: 76%; margin: 8px auto 0; }
  .ha-tag-copy { padding-left: 12px; }
  .ha-comic { grid-template-columns: 1fr; min-height: 0; }
  .ha-comic::before { min-height: 150px; }
  .ha-bc { grid-template-columns: 96px 1fr; }
  .ha-bc-in { padding: 10px 12px; gap: 6px; }
  .ha-bc h3 { font-size: 26px; }
  .ha-hrs { font-size: 11.5px; padding: 6px 8px; }
  .ha-addr { font-size: 13px; }
  .ha-ct-cols { grid-template-columns: 1fr; }
  .ha-form { padding: 16px; }
  .ha-label .ha-wrap { gap: 16px; }
  .ha-label svg { width: 22px; height: 22px; }
}
