/* Brickell ad landing page (concept). Shared by lp-brickell.html and lp-brickell-es.html.
   Same tokens, type and shapes as gpt-taste.html. Ad visitors get no site menu: one job, one form. */
:root{
  --bg:#0E0E0D; --surface:#1B1A18; --ink:#F3EFE7; --muted:#A8A195; --line:rgba(243,239,231,.12);
  --gold:#C9A24A; --gold-2:#E1BE63; --on-gold:#111; --err:#E57A6E;
  --sans:"Outfit",system-ui,-apple-system,"Segoe UI",sans-serif; --serif:"Cormorant Garamond",Georgia,serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6}
img,video{max-width:100%;display:block}
a{color:inherit}
em{font-family:var(--serif);font-style:italic;font-weight:500;color:var(--gold-2)}
main{overflow-x:clip}
.wrap{max-width:1280px;margin:0 auto;padding-inline:clamp(16px,4vw,48px)}
.chapter{padding-block:clamp(88px,10vw,144px)}
h1,h2,h3{margin:0;font-weight:500;letter-spacing:-.025em;line-height:1.04;text-wrap:balance}
h2{font-size:clamp(2.2rem,4.4vw,3.8rem)}
p{margin:0;text-wrap:pretty}
.lead{color:var(--muted);font-size:1.1rem;max-width:58ch;margin-top:20px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:1em 1.6em;border-radius:999px;font:inherit;font-weight:600;font-size:.95rem;text-decoration:none;cursor:pointer;border:1px solid transparent;transition:background .25s,color .25s}
.btn.gold{background:var(--gold);color:var(--on-gold)}
.btn.gold:hover{background:var(--gold-2)}
.btn.line{border-color:rgba(243,239,231,.45);color:var(--ink);background:rgba(0,0,0,.2)}
.btn.line:hover{background:var(--ink);color:var(--bg)}
a:focus-visible,.btn:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold-2);outline-offset:2px}

/* header: logo + one action */
.top{position:fixed;top:calc(14px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;
  width:min(1180px,calc(100% - 24px));padding:8px 8px 8px 18px;border-radius:999px;background:rgba(20,19,17,.6);border:1px solid rgba(243,239,231,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.top img{height:30px;width:auto}
.top .r{display:flex;gap:8px;align-items:center}
.top .lang{font-size:.88rem;color:rgba(243,239,231,.8);text-decoration:none;padding:.5em .8em}
.top .btn{padding:.6em 1.1em;font-size:.88rem}

/* hero: sized to content, not the viewport */
.hero{position:relative;display:grid;place-items:center;text-align:center;overflow:hidden;padding-block:clamp(150px,18vw,220px) clamp(80px,9vw,120px)}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 45%,rgba(0,0,0,.2),rgba(0,0,0,.55) 85%),linear-gradient(180deg,rgba(0,0,0,.35),transparent 30%,transparent 70%,var(--bg))}
.hero .in{position:relative;z-index:1;max-width:1000px;padding-inline:16px;display:flex;flex-direction:column;align-items:center;gap:24px}
.hero h1{font-size:clamp(2.6rem,6vw,5.4rem);text-shadow:0 2px 28px rgba(0,0,0,.45)}
.hero p{color:#E6E0D4;font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:52ch;text-shadow:0 1px 14px rgba(0,0,0,.6)}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}

/* listings: filter bar, map left, cards right (same as the main concept) */
.lbar{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.lbar select,.lmeta select{font:inherit;font-size:.95rem;color:var(--ink);background-color:var(--surface);border:1px solid var(--line);border-radius:999px;padding:.8em 2.6em .8em 1.2em;min-width:0;appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23C9A24A' stroke-width='1.8'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.1em center}
.lbar #lbld{flex:1 1 260px}
.lmeta select{padding-block:.5em;font-size:.88rem}
.lmeta{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px;color:var(--muted);font-size:.9rem}
.lsplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;margin-top:14px;align-items:stretch}
/* isolation keeps Leaflet's z-index 400-1000 layers inside the map, under the sign-up pop-up and header */
.lmap{isolation:isolate;position:sticky;top:96px;align-self:start;height:min(calc(100vh - 120px),760px);min-height:420px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:#E5E3DF}
.lmap.leaflet-container{font:inherit}
.lmap .leaflet-control-attribution{background:rgba(255,255,255,.85);color:#555}
.lmap .leaflet-control-attribution a{color:#1a73e8}
.lgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-content:start}
.lcard{position:relative;aspect-ratio:4/3;max-width:100%;border-radius:18px;overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:20px;isolation:isolate}
.lcard.on{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold)}
.lcard .ph{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.lcard:hover .ph{transform:scale(1.05)}
.lcard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.25),transparent 30%,transparent 42%,rgba(0,0,0,.82))}
.lcard .badge{position:absolute;top:14px;left:14px;background:rgba(0,0,0,.8);color:#fff;font-size:.78rem;font-weight:600;padding:.45em .9em;border-radius:999px}
.lcard .price{font-size:clamp(1.4rem,1.9vw,1.8rem);font-weight:600;letter-spacing:-.02em;color:#fff}
.lcard .facts,.lcard .addr{color:#EDE8DE;font-size:.93rem}
.lcard .facts b{font-weight:600;color:#fff}
.lcard .courtesy{color:rgba(237,232,222,.72);font-size:.93rem} /* MIAMI Schedule A #9: same size as the card text, quieter color */
.lcard .addr{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.lcard .addr::after{content:"";position:absolute;inset:0;z-index:1}
.lempty{grid-column:1/-1;padding:48px 24px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:18px}
.lnote{margin-top:14px;color:var(--muted);font-size:.8rem}
.pin{display:inline-block;transform:translate(-50%,-50%);background:#111;color:#fff;font:600 12px/1 var(--sans);padding:6px 10px;border-radius:999px;border:1.5px solid var(--gold);white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.45);cursor:pointer}
.pin.on,.pin:hover{background:var(--gold);color:#111}
.pin.cl{min-width:34px;text-align:center;padding:9px 11px;background:var(--gold);color:#111;border-color:#111}
.leaflet-marker-icon.pinicon{background:none;border:0}

/* Luz */
.luz{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,72px);align-items:center}
.luz img{width:100%;max-width:440px;justify-self:center;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:24px;border:1px solid var(--line)}
.luz ul{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:14px}
.luz li{padding-left:22px;position:relative;color:var(--ink)}
.luz li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--gold)}

/* lead form */
.talk{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,72px);align-items:start}
.talk .wa{margin-top:28px;display:flex;flex-direction:column;gap:6px;color:var(--muted)}
.talk .wa b{font-size:1.4rem;font-weight:500;color:var(--gold-2)}
.uform{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:clamp(22px,3vw,36px);border-radius:24px;background:var(--surface);border:1px solid var(--line)}
.uform label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted)}
.uform .full{grid-column:1/-1}
.uform input,.uform select,.uform textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:.75em .9em;width:100%}
.uform .consent{flex-direction:row;align-items:flex-start;gap:10px;font-size:.78rem;line-height:1.5}
.uform .consent input{width:auto;margin-top:.25em}
.uform .hp{position:absolute;left:-9999px}
.uform .actions .btn{border:0}
.form-msg{padding:12px 14px;border-radius:12px;background:rgba(201,162,74,.12);color:var(--ink);font-size:.92rem}
.form-msg.err{background:rgba(229,122,110,.12);color:var(--err)}

footer{border-top:1px solid var(--line);padding-block:32px;color:var(--muted);font-size:.8rem}
footer .wrap{display:flex;flex-direction:column;gap:10px}
footer a{color:var(--muted)}
.concept{position:fixed;left:16px;bottom:16px;z-index:60;background:rgba(201,162,74,.95);color:#111;font-size:.75rem;font-weight:600;padding:.5em .9em;border-radius:999px}

@media (max-width:1000px){.lsplit{grid-template-columns:1fr}.lmap{position:relative;top:auto;height:380px;min-height:0}}
@media (max-width:860px){.luz,.talk{grid-template-columns:1fr}.luz img{max-width:420px}}
@media (max-width:600px){.lgrid{grid-template-columns:1fr}.lbar select{flex:1 1 45%}.lmap{height:300px}.uform{grid-template-columns:1fr}.top .lang{display:none}}
@media (prefers-reduced-motion:reduce){.lcard .ph{transition:none}.hero video{display:none}}