/* Capa visual moderna: tarjetas con foto protagonista, esquinas amplias, etiquetas de cristal y movimiento suave.
   Se carga al final para unificar las tarjetas de anuncios, empresas, conciertos y directorio. */
.card{position:relative;display:flex;flex-direction:column;background:#101410;border:1px solid #222a21;border-radius:20px;overflow:hidden;padding-bottom:16px;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.card:hover,.card:focus-visible{transform:translateY(-4px);border-color:#b6ff0059;box-shadow:0 18px 40px #0009,0 0 0 1px #b6ff0014}
.card .photo{height:210px;border-radius:0;margin:0 0 14px;background:#161c16}
.card .photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.card:hover .photo img{transform:scale(1.05)}
.card .photo::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 55%,#080a09b3);pointer-events:none}
.card>small,.card>h3,.card>.price,.card>.place,.card>p{padding:0 16px}
.card>small{color:#9aa894;font-size:12px;letter-spacing:.01em}
.card h3{font-size:17px;line-height:1.3;letter-spacing:-.01em;margin:6px 0 8px;font-weight:650}
.card:hover h3{text-decoration:none}
.card .price{color:#B6FF00;font-size:20px;font-weight:750;letter-spacing:-.01em}
.card .price span{color:#9aa894;font-size:13px;font-weight:500;margin-left:4px}
.card .place{color:#c6d0c1;font-size:13px;margin-top:4px}
.tag,.photo .tag{top:12px;bottom:auto;left:12px;height:auto;z-index:2;background:#080a09a6;color:#f4f7f3;border:1px solid #ffffff26;border-radius:999px;padding:5px 10px;font-size:10px;font-weight:700;letter-spacing:.06em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.photo-credit{position:absolute;right:8px;bottom:6px;z-index:2;max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ffffffcc!important;background:#0007;border-radius:6px;padding:2px 6px;font-size:9px;line-height:1.4;text-decoration:none}
.photo-credit:hover{color:#fff!important;text-decoration:underline}
/* Carteles de conciertos con foto de fondo: el texto sigue siendo el protagonista. */
.poster{border-radius:20px}
.card .poster,.concert-card .poster{border-radius:0}
.concert-card{border-radius:20px;overflow:hidden;background:#101410;border:1px solid #222a21;transition:transform .25s ease,border-color .25s ease}
.concert-card:hover{transform:translateY(-4px);border-color:#b6ff0059}
.concert-card h3,.concert-card p{padding:0 16px}.concert-card p{padding-bottom:16px}
.poster.has-photo{position:relative;background:linear-gradient(180deg,#080a0933 0%,#080a0966 45%,#080a09f0 100%),var(--photo) center/cover no-repeat!important;color:#fff!important;border:0}
.poster.has-photo strong{color:#fff;text-shadow:0 2px 24px #000a}
.poster.has-photo span{color:#B6FF00}
.poster.has-photo::after{content:attr(data-credit);position:absolute;right:10px;bottom:10px;font-size:9px;letter-spacing:0;color:#ffffffc0;background:#0006;border-radius:6px;padding:2px 6px}
#detail .poster.has-photo{min-height:320px}
/* Tarjetas del piloto y del directorio: mismo lenguaje visual. */
.pilot-card{border-radius:20px;background:#101410;border-color:#222a21;transition:transform .25s ease,border-color .25s ease}
.pilot-card:hover{transform:translateY(-3px);border-color:#b6ff0040}
.pilot-card img{transition:transform .5s ease}.pilot-card:hover img{transform:scale(1.04)}
.dir-card{border-radius:20px;transition:transform .25s ease,border-color .25s ease}.dir-card:hover{transform:translateY(-3px);border-color:#b6ff0040}
@media(prefers-reduced-motion:reduce){.card,.card .photo img,.concert-card,.pilot-card,.pilot-card img,.dir-card{transition:none}.card:hover,.concert-card:hover,.pilot-card:hover,.dir-card:hover{transform:none}.card:hover .photo img,.pilot-card:hover img{transform:none}}
@media(max-width:600px){.card .photo{height:180px}.card h3{font-size:15px}.card .price{font-size:18px}}
/* Barra inferior (celular) */
.tabbar{display:none}
@media(max-width:800px){
 .tabbar{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:45;display:grid;grid-template-columns:repeat(5,1fr);align-items:end;padding:6px 6px 7px;background:#0c100dcc;border:1px solid #ffffff1f;border-radius:22px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 10px 36px #000b}
 .tabbar a{display:grid;justify-items:center;gap:3px;padding:6px 2px;color:#a7b3a2;text-decoration:none;font-size:10.5px;font-weight:600;border-radius:14px}
 .tabbar svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
 .tabbar a[aria-current]{color:#B6FF00}
 .tabbar .tab-main{color:#080a09}.tabbar .tab-main svg{width:26px;height:26px;padding:9px;box-sizing:content-box;background:#B6FF00;border-radius:16px;margin-top:-22px;box-shadow:0 8px 24px #b6ff0040;stroke-width:2.4}
 .tabbar .tab-main span{color:#dfe6da}
 body.has-tabbar{padding-bottom:96px}
 body.has-tabbar .ai-fab{bottom:calc(92px + env(safe-area-inset-bottom));right:14px;padding:11px 15px;font-size:13px}
 body.has-tabbar .ai-panel{bottom:0}
}
/* Con la barra inferior, el encabezado del celular queda limpio: logo y Publicar. */
@media(max-width:800px){header>nav,header .head-actions .account{display:none!important}header{padding-top:10px;padding-bottom:10px}}

/* Planes */
.pricing{max-width:1180px;margin:auto;padding:28px 24px 48px}
.pricing-hero{padding:34px 28px;border-radius:26px;border:1px solid #3b4a2c;background:radial-gradient(circle at 85% 10%,#b6ff002e,transparent 50%),linear-gradient(160deg,#141d10,#0b0f0c 70%)}
.pricing-hero .eyebrow{color:#B6FF00;font-size:12px;letter-spacing:.16em;font-weight:700}.pricing-hero h1{font-size:clamp(36px,6vw,64px);line-height:1;letter-spacing:-.04em;margin:10px 0 14px}.pricing-hero p{max-width:640px;color:#dfe6da;font-size:17px;line-height:1.55;margin:0}.pricing-hero b{color:#B6FF00}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px;margin:20px 0}
.pricing-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:24px 20px;background:#101410;border:1px solid #222a21;border-radius:22px}
.pricing-card.is-star{border-color:#B6FF00;box-shadow:0 0 0 1px #b6ff0055,0 20px 50px #b6ff0012}
.pricing-card h2{margin:0;font-size:22px}.pricing-price{margin:0;display:grid;gap:2px}.pricing-price strong{font-size:44px;line-height:1;letter-spacing:-.03em}.pricing-price span{color:#9aa894;font-size:13px}
.pricing-card ul{margin:4px 0 8px;padding:0;list-style:none;display:grid;gap:8px;font-size:14px;color:#dfe6da}.pricing-card li::before{content:'✓ ';color:#B6FF00;font-weight:800}.pricing-card li.soon{color:#8e9b88}.pricing-card li.soon::before{content:'✦ ';color:#8e9b88}
.pricing-card .button{margin-top:auto;text-align:center}
.pricing-off{align-self:flex-start;background:#b6ff001f;color:#B6FF00;border:1px solid #b6ff0055;border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800}
.pricing-flag{position:absolute;top:-12px;right:18px;background:#B6FF00;color:#080a09;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:800}
.pricing-note{color:#8e9b88;font-size:13px}
/* Botón secundario: una regla antigua (graphite.css) le ponía texto oscuro sobre fondo oscuro. */
.button.light{background:transparent!important;color:#fff!important;border:1px solid #4a5a42}.button.light:hover{border-color:#B6FF00;color:#B6FF00!important}
.ai-fab b{font-weight:700}
/* En el celular el asistente es un botón redondo para no tapar el contenido. */
@media(max-width:800px){body .ai-fab,body.has-tabbar .ai-fab{width:52px;height:52px;padding:0;justify-content:center;border-radius:50%}.ai-fab b{display:none}.ai-fab span{font-size:22px}}
/* Anuncio y ficha de negocio a pantalla ancha: foto a la izquierda, datos a la derecha. */
@media(min-width:900px){
 .pilot .pilot-single-card{max-width:1100px}
 .pilot-single-card .pilot-card:has(.pilot-media){position:relative;padding-left:52%;min-height:460px}
 .pilot-single-card .pilot-card>.pilot-media{position:absolute;left:0;top:0;bottom:0;width:52%}
 .pilot-single-card .pilot-card>.pilot-media img{height:100%}
 .pilot-single-card .pilot-card>div{padding:32px}
 .pilot .biz-page-card{display:block;max-width:1100px}
 .biz-page-card .dir-card:has(>.dir-photo){position:relative;padding:32px 32px 32px calc(52% + 32px);min-height:460px}
 .biz-page-card .dir-card>.dir-photo{position:absolute;left:0;top:0;bottom:0;width:52%;height:auto;margin:0}
 .biz-page-card .dir-card h3{font-size:30px}
}

.home-featured{margin:0 0 18px}.home-featured .section-title{margin-bottom:12px}
.featured-row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;-webkit-overflow-scrolling:touch}
.featured-card{flex:0 0 220px;scroll-snap-align:start;display:grid;gap:4px;padding:0 0 14px;border-radius:18px;border:1px solid #b6ff0066;background:linear-gradient(160deg,#151d10,#0b0f0c 70%);color:#fff;text-decoration:none;overflow:hidden}
.featured-card:hover{border-color:#b6ff00}.featured-img{position:relative;display:block;height:120px;margin-bottom:26px;background:radial-gradient(circle at 70% 20%,#b6ff0033,transparent 60%),#10150f center/cover no-repeat}
.featured-img img,.featured-img b{position:absolute;left:14px;bottom:-24px;width:52px;height:52px;border-radius:50%;object-fit:cover;background:#fff;border:3px solid #0b0f0c}
.featured-img b{display:grid;place-items:center;background:#b6ff00;color:#0b0f0c;font-size:24px}
.featured-card strong,.featured-card small{padding:0 14px}.featured-card strong{font-size:17px}.featured-card small{color:#9aa596;font-size:12.5px}
/* Opened from the home-screen icon (app mode): keep the page below the phone's clock and battery, with a black strip behind them. */
@media (display-mode:standalone){html{background:#000}body{padding-top:env(safe-area-inset-top)}body::before{content:'';position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top);background:#000;z-index:1000}}
.featured-img{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important}
/* App-like feel on phones: nothing slides sideways, no rubber-band bounce, no double-tap zoom, and tapping a field
   does not zoom the page (iPhone zooms into inputs with text under 16px). */
html,body{max-width:100%;overflow-x:hidden;overflow-x:clip;overscroll-behavior:none}
body{touch-action:manipulation;-webkit-text-size-adjust:100%}
.dto-hero-orbit{max-width:100%}.campaign,.hero,.campaign-copy,#react-hero{overflow-x:clip}
@media(max-width:700px){input,select,textarea{font-size:16px!important}}
.tabbar .tab-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;background:#fff;border:2px solid #9aa596;display:block;margin:0 auto 2px}.tabbar a[aria-current] .tab-avatar{border-color:#b6ff00}
