/* ═══════════════════════════════════════════════════════════════════════════
   ARREGLOS caminsdevent — 2026-10-06 (auditoria ~/growth/audit/cde_web_audit_2026-10-06.md)
   Fitxer propi: per desfer-ho tot, treure el <link> de index.php.
   ═══════════════════════════════════════════════════════════════════════════ */

/* Text només per a Google i lectors de pantalla */
.cde-sr-only{ position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

/* ── Fitxa: "botó fals" (Premium, Entre setmana, Gastronòmic) ──────────────
   Fins triar l'opció, VirtueMart posa un quadre gris amb text BLANC: invisible.
   Ara: avís groc clar, text fosc i llegible, que indica què cal fer. */
.addtocart-bar .addtocart-button-disabled,
span.addtocart-button-disabled{
  display:inline-flex !important; align-items:center; justify-content:center;
  min-width:240px; min-height:52px; padding:.7em 1.4em !important;
  background:#fff6d1 !important; background-image:none !important;
  color:#4a3d00 !important; border:2px dashed #d8a800 !important; border-radius:10px !important;
  font-weight:700 !important; font-size:1rem !important; line-height:1.3 !important;
  opacity:1 !important; text-shadow:none !important; cursor:default;
}

/* ── Barra fixa inferior (mòbil + tauleta ≤1199) ──────────────────────────
   - El WhatsApp flotant del plugin "whatsappchat" quedava duplicat darrere la
     barra (que ja té WhatsApp): s'amaga on hi ha barra.
   - "Configuració de cookies" tapava "Reserva el teu vol": puja per sobre. */
@media (max-width:1199px){
  body:has(#cde-mobile-cta) .whatsappchat.is_bottom_right{ display:none !important; }
  body:has(#cde-mobile-cta) #cde-cookie-manage{ bottom:78px !important; }
}
/* tauleta: barra centrada i no tan ampla */
@media (min-width:768px) and (max-width:1199px){
  #cde-mobile-cta{ padding-left:max(10px, calc(50% - 300px)) !important; padding-right:max(10px, calc(50% - 300px)) !important; }
}

/* ── Cupó de descompte a la fitxa: sortia 24–56px de la pantalla al mòbil ──
   La caixa (399px) no s'encongia dins la fila flex del botó (343px). */
.addtocart-bar{ flex-wrap:wrap; }
.addtocart-bar .cdv-cupo{ flex:1 1 100%; max-width:100%; min-width:0; box-sizing:border-box; }
.addtocart-bar .cdv-cupo-fila{ min-width:0; max-width:100%; }
.addtocart-bar .cdv-cupo-inp{ flex:1 1 auto; min-width:0; width:auto !important; }
.addtocart-bar .cdv-cupo-btn{ flex:0 0 auto; }

/* ── Carret ────────────────────────────────────────────────────────────── */
/* H1 "Carret / 1 producte" feia 60px fixos (2 línies gegants al mòbil) */
#ProOPC h1.cart-page-title{ font-size:clamp(1.6rem, 4.2vw, 2.8rem) !important; line-height:1.15 !important; }
#ProOPC h1.cart-page-title *{ font-size:inherit !important; line-height:inherit !important; }
/* "Continuar comprant" quedava tallat per la dreta al mòbil */
@media (max-width:575px){
  #ProOPC .proopc-continue-link{ display:block !important; text-align:center; margin:8px 0 0 !important; }
  #ProOPC .proopc-continue-link a, #ProOPC .proopc-continue-link button{ max-width:100%; white-space:normal; }
}

/* ── Portada: capa de titular + botons damunt del vídeo (escriptori/tauleta) ── */
.cde-hero-host{ position:relative; }
.cde-hero{ position:absolute; inset:0; display:flex; align-items:flex-end; justify-content:flex-start; pointer-events:none;
  background:linear-gradient(180deg, rgba(20,16,8,0) 35%, rgba(20,16,8,.55) 100%); }
.cde-hero-in{ pointer-events:auto; padding:0 clamp(24px,6vw,120px) clamp(48px,10vh,120px); max-width:min(1100px, 92vw); }
.cde-hero-h{ margin:0 0 .35em; color:#fff; font-family:"Roboto Slab",Georgia,serif; font-weight:700;
  font-size:clamp(2rem,4.2vw,4.4rem); line-height:1.08; letter-spacing:-.01em; text-shadow:0 2px 18px rgba(0,0,0,.45); text-wrap:balance; }
.cde-hero-p{ margin:0 0 1.4em; color:#fff; font-size:clamp(1rem,1.4vw,1.35rem); text-shadow:0 1px 8px rgba(0,0,0,.5); }
.cde-hero-cta{ display:flex; flex-wrap:wrap; gap:12px; }
.cde-hero-cta a{ display:inline-flex; align-items:center; min-height:54px; padding:.8em 1.8em; border-radius:10px; font-weight:700;
  font-size:clamp(1rem,1.1vw,1.15rem); text-decoration:none !important; }
.cde-hero-a{ background:#fbc817; color:#211c12 !important; border:1px solid #e6b40d; box-shadow:0 10px 26px -12px rgba(0,0,0,.6); }
.cde-hero-a:hover{ background:#e3b30b; }
.cde-hero-b{ background:rgba(255,255,255,.14); color:#fff !important; border:1.5px solid rgba(255,255,255,.85); backdrop-filter:blur(4px); }
.cde-hero-b:hover{ background:rgba(255,255,255,.26); }
.cde-hero-cta a:focus-visible{ outline:3px solid #fff; outline-offset:3px; }
/* el vídeo feia 1.433px d'alt a 2560: que càpiga a la pantalla */
.cde-hero-host{ max-height:calc(100vh - 115px); overflow:hidden; }
.cde-hero-host .sppb-addon-video-local-video-wrap, .cde-hero-host video{ max-height:calc(100vh - 115px); object-fit:cover; width:100%; }

/* ── Portada 768–1199: les fotos dels blocs Premium/Privat tenen amplada FIXA
   de 750px dins una columna de 480px → el text quedava damunt de la foto. ── */
@media (max-width:1199px){
  .sppb-addon-single-image .sppb-addon-single-image-container{ max-width:100% !important; width:100% !important; }
  .sppb-addon-single-image img.sppb-img-responsive{ max-width:100% !important; width:100% !important; height:auto !important; }
  .sppb-addon-wrapper:has(> .clearfix > .sppb-addon-single-image), .sppb-addon-wrapper:has(> .clearfix > .sppb-addon-single-image) > .clearfix,
  .sppb-addon-wrapper:has(> .clearfix > .sppb-addon-single-image) .sppb-addon, .sppb-addon-wrapper:has(> .clearfix > .sppb-addon-single-image) .sppb-addon-content{ width:100% !important; max-width:100% !important; }
}

/* ── Contrast (abans blanc sobre groc ≈1,6:1; mínim 4,5:1) ──────────────── */
/* Franja "Regala un vol en globus" de la portada (mateix id als 4 idiomes) */
#section-id-1654038849126, #section-id-1654038849126 h1, #section-id-1654038849126 h2, #section-id-1654038849126 h3,
#section-id-1654038849126 p, #section-id-1654038849126 span, #section-id-1654038849126 strong{ color:#211c12 !important; text-shadow:none !important; }
#section-id-1654038849126 a.sppb-btn, #section-id-1654038849126 .sppb-btn{ background:#211c12 !important; border-color:#211c12 !important; color:#fff !important; }
#section-id-1654038849126 a.sppb-btn:hover{ background:#3a3222 !important; }
/* Peu groc: el text (no els enllaços) era blanc */
footer, footer p, footer span, footer div, footer li, footer strong, footer joomla-hidden-mail{ color:#211c12 !important; }
footer a{ color:#211c12 !important; }
footer a:hover{ color:#5a4300 !important; text-decoration:underline; }
/* Enllaç "Política de privacitat" del formulari de newsletter (daurat sobre blanc 2,1:1) */
#mr-news-cat a{ color:#6b5200 !important; text-decoration:underline; }
/* Botó "Configuració de cookies" (blanc sobre taronja 2,1:1) */
#cde-cookie-manage{ color:#211c12 !important; }

/* ── Llistat de vols (/reserva-ara i equivalents) ───────────────────────── */
/* Ordre de targeta: foto → títol → text → preu → botó (abans foto després del preu) */
.browse-view .product .spacer{ display:flex; flex-direction:column; height:100%; }
.browse-view .product .vm-product-media-container{ order:1; }
.browse-view .product .vm-product-descr-container-1{ order:2; margin-top:14px; }
.browse-view .product .vm3pr-3{ order:3; }
.browse-view .product .boto_detalls{ order:4; margin-top:auto; padding-top:12px; }
.browse-view .product .vm3pr-2{ order:5; }
/* Preu: era el text més petit (~12–18px) */
.browse-view .product .product-price{ margin:6px 0 4px; }
.browse-view .product .PricesalesPrice, .browse-view .product .product-price .vm-price-value{ font-size:1.5rem !important; font-weight:700 !important; color:#211c12 !important; }
.browse-view .product .product-price .PricebasePriceWithTax, .browse-view .product .product-price del, .browse-view .product .product-price s{ font-size:1rem !important; color:#7a6f57 !important; }
/* Tauleta: 3 columnes des de 768 (els grups són de 3; a 2 columnes en quedava 1 sol a cada fila) */
@media (min-width:768px){ .browse-view .product.vm-col-3{ width:33.3333% !important; } }
/* Soroll de VirtueMart amb 10 productes: "Resultats 1 - 10 de 10" + selector "24" */
.browse-view .orderby-displaynumber, .browse-view .vm-pagination-top, .browse-view .display-number{ display:none !important; }

/* ── Menú hamburguesa: botó de reserva + telèfon ─────────────────────────── */
.cde-mm-cta{ display:none; }
@media (max-width:1199px){
  .cde-mm-cta{ display:flex; flex-direction:column; align-items:stretch; gap:10px; padding:18px 20px 24px 60px; max-width:420px; }
  .cde-mm-cta .cde-mm-tel{ text-align:left !important; }
  .cde-mm-cta .cde-mm-book{ display:flex; align-items:center; justify-content:center; min-height:50px; border-radius:10px;
    background:#fbc817; color:#211c12 !important; font-weight:700; text-decoration:none !important; border:1px solid #e6b40d; }
  .cde-mm-cta .cde-mm-tel{ text-align:center; color:#fbc817 !important; text-decoration:none; }
}

/* ── Passos del carret: el "4" fix de custom.css (2026-09-30) ja no cal ──────
   Ara un JS d index.php renumera els passos visibles (1·2·3). Sense això, el
   pas de confirmar mostrava "4" pintat per sobre del "3" real. */
.proopc-confirm-order .proopc-step{ color:#fff; }
.proopc-confirm-order .proopc-step::after{ content:none; }

/* ── Carret mòbil: fila TOTAL duplicada ──────────────────────────────────────
   Al mòbil el plugin posa l'etiqueta "Total" a cada cel·la (::before), així que
   la cel·la "TOTAL:" de la fila final sortia com una fila buida a sobre. */
@media (max-width:767px){
  #ProOPC table.cart-summary tr.grand-total td.sub-headings{ display:none !important; }
  #ProOPC table.cart-summary tr.cart-sub-total td:before{ content:none !important; }
  #ProOPC table.cart-summary tr.cart-sub-total td{ padding-left:8px !important; }
}

/* ── Bloc final de reserva als articles (FAQ, 4 idiomes) ───────────────────── */
.cde-end-cta{ max-width:720px; margin:2.5rem 0 1rem; padding:1.6rem 1.4rem; border-radius:12px; background:#fff8e1; border:1px solid #f3dc8a; text-align:center; }
.cde-end-cta p{ margin:0; max-width:none !important; }
.cde-end-cta__t{ font-size:1.15rem; font-weight:700; color:#211c12; margin-bottom:1rem !important; text-wrap:balance; }
.cde-end-cta__b{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 14px; }
.cde-end-cta__btn, .cde-end-cta__alt{ display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.6em 1.6em; border-radius:10px; font-weight:700; text-decoration:none !important; }
.cde-end-cta__btn{ background:#fbc817; color:#211c12 !important; border:1px solid #e6b40d; }
.cde-end-cta__btn:hover{ background:#e3b30b; }
.cde-end-cta__alt{ background:#fff; color:#211c12 !important; border:1px solid #d8c47a; }
.cde-end-cta__alt:hover{ border-color:#211c12; }
.cde-end-cta__tel{ margin-top:.9rem !important; color:#5b5340; }
.cde-end-cta__tel a{ color:#211c12; font-weight:700; white-space:nowrap; }
@media (max-width:480px){ .cde-end-cta__btn, .cde-end-cta__alt{ width:100%; } }

/* ── Contacte (SPPB 6-9): H1 real + formulari a una amplada llegible ─────── */
.cde-contact-h1{ font-size:clamp(1.7rem,3vw,2.3rem); font-weight:400; margin:0 0 .4em; color:#211c12; }
.cde-contact-info a{ white-space:nowrap; }
body.com-sppagebuilder #userForm.formResponsive{ max-width:760px; }
body.com-sppagebuilder #userForm.formResponsive input[type=text],
body.com-sppagebuilder #userForm.formResponsive input[type=email],
body.com-sppagebuilder #userForm.formResponsive input[type=tel],
body.com-sppagebuilder #userForm.formResponsive textarea,
body.com-sppagebuilder #userForm.formResponsive button[type=submit]{ width:100% !important; max-width:100% !important; box-sizing:border-box; }

/* ── Llistat del blog: títol llegible i per sobre del resum ─────────────────
   Era groc clar (#dbab04) a 18px/300, igual de mida que el resum. */
body.blog .items-row .page-header h2{ margin:0 0 .5em; font-size:clamp(1.3rem,1.6vw,1.65rem); line-height:1.25; font-weight:700; text-wrap:balance; }
body.blog .items-row .page-header h2 a{ color:#211c12 !important; text-decoration:none; }
body.blog .items-row .page-header h2 a:hover{ color:#8a6a00 !important; text-decoration:underline; text-underline-offset:3px; }

/* ── Articles: fotos verticals gegants ───────────────────────────────────────
   Una foto 1080×1920 dins un <figure> sortia a 1140×2027 (un terç de l'article).
   Alçada màxima i centrada; les apaïsades no es veuen afectades. */
.item-page figure img{ max-height:min(80vh, 900px); width:auto !important; max-width:100%; height:auto !important; display:block; margin-left:auto; margin-right:auto; }

/* ── Empreses (B2B): títol del cas Desperados quedava SOTA el degradat ::after ── */
.b2b__caseTitle{ z-index:1; }
.b2b__caseTitle h2{ text-shadow:0 2px 12px rgba(0,0,0,.45); }
/* Passos "Del briefing al dia de l'activació": la plantilla limita els <ol> a
   ~62ch (708px) i quedaven 5 columnes de ~120px amb 2-3 paraules per línia. */
.b2b .b2b__steps{ max-width:none; padding-left:0; }
@media (min-width:1101px){ .b2b .b2b__steps{ grid-template-columns:repeat(5,minmax(0,1fr)); } }

/* ── Fitxa de producte al mòbil: bloc de compra AL FINAL (petició usuari 06/10) ──
   W1 (custom.css) el pujava a dalt de tot (order:1). Ara: títol → fotos i
   descripció → preu + opcions + "Afegir al carret". Només canvia l'ordre. */
@media (max-width:767px){
  .productdetails-view.cdv-pv > .vm-product-container{ order:9; margin:22px 0 0; padding:16px 0 0; border-bottom:0; border-top:1px solid rgba(0,0,0,.08); }
}
