/* Lotería 40th birthday (Custom) — papel picado, a full Lotería tabla of cards, bold folk palette on cream */
.t-lot { --bg: #F8EEDC; --surface: #FFFBF2; --surface-2: #F1E2C6; --ink: #1E1A17; --ink-2: #5B4E44; --accent: #C2185B; --accent-hover: #A3134C; --accent-ink: #FFFFFF; --accent-text: #A3134C; --tint: #F8DCE6; --line: #E6D3AF; --line-strong: #1E1A17; --display: "Playfair Display", Georgia, serif; --body: "Figtree", system-ui, sans-serif; --radius: 8px; }
.t-lot h1, .t-lot h2, .t-lot h3 { font-family: var(--display); color: var(--ink); }
.t-lot .lt-hero { min-height: auto; display: block; padding: 0 0 clamp(50px, 8vw, 90px); color: var(--ink); text-align: center; background: var(--bg); }
.t-lot .lt-hero::after { display: none; }
.lt-picado { display: block; width: 100%; height: clamp(70px, 10vw, 120px); animation: flutter 5s var(--ease-inout, ease-in-out) infinite alternate; transform-origin: top; }
@keyframes flutter { from { transform: skewX(-1deg); } to { transform: skewX(1deg); } }
.t-lot .hero .langbtn { top: auto; bottom: 18px; background: var(--surface); color: var(--ink); border-color: var(--ink); }
.lt-hero-in { padding-top: clamp(24px, 5vw, 50px); }
.lt-pre { font: 800 14px/1.3 var(--body); letter-spacing: .2em; text-transform: uppercase; color: var(--accent-text); }
.lt-hero h1 { margin-top: 10px; font: 900 clamp(64px, 13vw, 150px)/.88 var(--display); letter-spacing: -.03em; }
.lt-hero h1 span { display: block; font: italic 400 .36em/1.2 var(--display); letter-spacing: 0; color: var(--ink-2); }
.lt-badge { width: clamp(84px, 13vw, 120px); height: clamp(84px, 13vw, 120px); margin: 18px auto 0; display: grid; place-items: center; border-radius: 50%; background: #F2A900; border: 4px solid var(--ink); font: 900 clamp(38px, 6vw, 54px)/1 var(--display); box-shadow: 6px 6px 0 var(--ink); transform: rotate(-8deg); }
.lt-when { margin-top: 20px; font: 600 18px/1.4 var(--body); }
.lt-cta { margin-top: 22px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.t-lot .btn { border-radius: 6px; border-width: 2.5px; }
.t-lot .btn.solid { box-shadow: 4px 4px 0 var(--ink); border-color: var(--ink); }
.t-lot .btn.line { color: var(--ink); border-color: var(--ink); }
.lt-sec { padding-block: clamp(56px, 8vw, 96px); }
.lt-sec h2 { font-size: clamp(36px, 5.5vw, 56px); font-weight: 900; text-align: center; }
.lt-tabla { margin: 30px auto 0; max-width: 980px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding: 14px; background: var(--ink); border-radius: 12px; }
.lt-card { position: relative; display: flex; flex-direction: column; padding: 14px 14px 16px; border-radius: 6px; background: #FFFBF2; border: 3px solid var(--ink); outline: 2px solid #FFFBF2; outline-offset: -9px; text-align: center; }
.lt-card .n { position: absolute; top: 10px; left: 12px; font: 900 22px/1 var(--display); }
.lt-card svg { width: 72%; max-width: 150px; margin: 18px auto 8px; height: auto; }
.lt-card h3 { margin-top: auto; padding-top: 8px; border-top: 2px solid var(--ink); font: 900 clamp(15px, 2vw, 19px)/1.2 var(--display); letter-spacing: .06em; }
.lt-card p { font-size: 14.5px; color: var(--ink-2); margin-top: 6px; }
.lt-card a { margin-top: 6px; color: var(--accent-text); font-weight: 700; font-size: 14px; }
.lt-card.c1 { background: #FDE7EF; } .lt-card.c3 { background: #E2F3F1; } .lt-card.c4 { background: #FFF1D0; } .lt-card.c6 { background: #FBE3DA; }
.lt-rsvp { text-align: center; background: var(--surface-2); }
.lt-sub { color: var(--ink-2); margin-top: 8px; }
.lt-rsvp .rsvp { margin-top: 24px; text-align: left; border: 3px solid var(--ink); box-shadow: 8px 8px 0 var(--ink); }
.lt-foot { padding: 50px 20px 40px; text-align: center; background: var(--ink); color: #F8EEDC; }
.lt-foot .big { font: 900 clamp(40px, 7vw, 60px)/1 var(--display); color: #F2A900; }
.lt-foot .made { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: inherit; text-decoration: none; font-size: 14px; }
@media (max-width: 760px) { .lt-tabla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 10px; } }
@media (max-width: 420px) { .lt-card p { font-size: 13.5px; } }
@media (prefers-reduced-motion: reduce) { .lt-picado { animation: none; } }