/* laia's food club: estils del tema */

:root {
	--fons: #FCFAF2;
	--fons-2: #F4EFE3;
	--tinta: #2A231D;
	--suau: #5E5448;
	--text-2: #4A4036;
	--linia: #DDD6C6;
	--accent: #A2302C;
	--verd: #B4C4AD;
	--serif: 'Instrument Serif', Georgia, serif;
	--sans: 'Instrument Sans', system-ui, sans-serif;
	--ample: 1360px;
	--marge: clamp(16px, 4vw, 48px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fons); color: var(--tinta); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--tinta); text-decoration: none; }
a:hover { color: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
h1, h2, h3, h4 { font-weight: 400; }
em { font-style: italic; }
.screen-reader-text, .sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.salta { position: absolute; left: -999px; top: 8px; background: var(--tinta); color: var(--fons); padding: 8px 12px; z-index: 10; }
.salta:focus { left: 8px; color: var(--fons); }

.contenidor { max-width: var(--ample); margin: 0 auto; padding-left: var(--marge); padding-right: var(--marge); }
.label { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }
.label-fort { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
.serif { font-family: var(--serif); }
.suau { color: var(--suau); }

/* Etiquetes de color */
.etiqueta { display: inline-block; padding: 5px 9px 4px; font-size: 11px; line-height: 1.2; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
a.etiqueta:hover { filter: brightness(0.95); }

/* Botons */
.boto { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 22px; font: inherit; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; border: 1px solid var(--tinta); background: transparent; color: var(--tinta); cursor: pointer; }
.boto:hover { background: var(--tinta); color: var(--fons); }
.boto-ple { background: var(--accent); border-color: var(--accent); color: #FCFAF2; }
.boto-ple:hover { background: #8a2925; border-color: #8a2925; color: #FCFAF2; }
.boto-clar { background: #FCFAF2; border-color: #FCFAF2; color: var(--accent); }
.boto-clar:hover { background: transparent; color: #FCFAF2; }
.boto-net { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 2px; font: inherit; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--tinta); background: transparent; border: 0; cursor: pointer; }
.boto-reel { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 18px; background: var(--accent); color: #FCFAF2 !important; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; text-decoration: none !important; }
.boto-reel:hover { background: #8a2925; }

/* Capçalera */
.cap { border-bottom: 1px solid var(--linia); }
.cap .contenidor { padding-top: 22px; padding-bottom: 22px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
.cap nav { flex: 1 1 260px; }
.cap nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }
.cap nav.dreta ul { justify-content: flex-end; }
.cap .current-menu-item > a, .cap .current-menu-ancestor > a, .cap .current-category-ancestor > a, .cap .current-post-ancestor > a { color: var(--accent); }
.logo { font-family: var(--serif); font-size: 30px; line-height: 1; letter-spacing: -0.01em; flex: 0 0 auto; }
@media (max-width: 720px) {
	.cap .contenidor { justify-content: center; }
	.cap .logo { order: -1; flex-basis: 100%; text-align: center; }
	.cap nav ul, .cap nav.dreta ul { justify-content: center; }
}

/* Peu */
.peu { border-top: 1px solid var(--linia); }
.peu .contenidor { padding-top: 56px; padding-bottom: 40px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px; }
.peu ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }

/* Newsletter */
.news { background: var(--accent); color: #FCFAF2; }
.news .contenidor { padding-top: clamp(48px, 5vw, 72px); padding-bottom: clamp(48px, 5vw, 72px); display: flex; flex-wrap: wrap; gap: 24px 64px; align-items: flex-end; justify-content: space-between; }
.news .text { flex: 1 1 320px; min-width: 0; max-width: 560px; }
.news h2 { margin: 0 0 6px; }
.news p { margin: 0; font-family: var(--serif); font-size: 26px; line-height: 1.2; }
.news-gran p { font-size: clamp(32px, 3.6vw, 52px); line-height: 1.08; }
.news-form { flex: 1 1 360px; min-width: 0; max-width: 520px; display: flex; flex-wrap: wrap; gap: 12px 24px; align-items: flex-end; }
.news-form .camp { flex: 1 1 220px; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.news-form label { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }
.news-form input { font: inherit; font-size: 16px; color: #FCFAF2; background: transparent; border: 0; border-bottom: 1px solid #FCFAF2; padding: 8px 0; border-radius: 0; }
.news-form input::placeholder { color: rgba(252, 250, 242, 0.7); }

/* Títols de secció */
.titol-seccio { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 20px; margin-bottom: 40px; border-bottom: 1px solid var(--linia); }
.titol-seccio h2 { margin: 0; font-family: var(--serif); font-size: clamp(32px, 3.4vw, 48px); line-height: 1.05; }
.titol-seccio a { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }

/* Targetes */
.graella { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 56px 24px; }
.graella-guies { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.targeta img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.graella-guies .targeta img { aspect-ratio: 4 / 5; }
.targeta .meta { margin: 16px 0 10px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.targeta .titol { margin: 0; font-family: var(--serif); font-size: 26px; line-height: 1.15; }
.graella-guies .targeta .titol { font-size: 30px; line-height: 1.1; }
.targeta .peu-t { margin: 6px 0 0; font-size: 14px; color: var(--suau); }
.targeta[hidden] { display: none; }

/* Filtres */
.filtres { display: flex; flex-wrap: wrap; gap: 8px; }
.filtre { font: inherit; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; min-height: 40px; padding: 0 14px; cursor: pointer; border: 1px solid transparent; opacity: 0.85; }
.filtre[aria-pressed="true"] { border-color: var(--tinta); box-shadow: 0 0 0 1px var(--tinta); opacity: 1; }

/* Portades (receptari i guies) */
.portada-cap { padding-top: clamp(56px, 7vw, 104px); padding-bottom: clamp(40px, 4vw, 56px); text-align: center; }
.portada-cap h1 { margin: 0; font-family: var(--serif); font-size: clamp(56px, 9vw, 140px); line-height: 0.92; letter-spacing: -0.03em; }
.portada-cap p { margin: 28px auto 0; max-width: 580px; font-size: 18px; color: var(--text-2); }
.destacada { display: flex; flex-wrap: wrap; background: var(--fons-2); }
.destacada img { flex: 1 1 480px; min-width: 0; aspect-ratio: 4 / 3; max-height: 620px; object-fit: cover; }
.destacada .text { flex: 1 1 360px; min-width: 0; padding: clamp(32px, 5vw, 72px); display: flex; flex-direction: column; justify-content: center; }
.destacada h2 { margin: 20px 0 0; font-family: var(--serif); font-size: clamp(44px, 5vw, 76px); line-height: 1; letter-spacing: -0.02em; }
.destacada p { margin: 20px 0 0; max-width: 440px; color: var(--text-2); }
.nova { color: var(--accent); }
.seccio { padding-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(96px, 10vw, 152px); }

/* Home */
.home-seccio { padding-top: clamp(48px, 6vw, 88px); padding-bottom: clamp(72px, 8vw, 120px); }
.home-seccio .titol-seccio h2 { font-size: clamp(26px, 2.4vw, 34px); }
.sobre-mi { background: var(--verd); }
.sobre-mi .contenidor { padding-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(72px, 8vw, 120px); display: flex; flex-wrap: wrap; gap: 48px 96px; align-items: center; }
.sobre-mi img { flex: 1 1 360px; min-width: 0; max-width: 520px; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; }
.sobre-mi .text { flex: 1 1 360px; min-width: 0; max-width: 560px; }
.sobre-mi .text p.gran { margin: 18px 0 0; font-family: var(--serif); font-size: clamp(28px, 3vw, 42px); line-height: 1.2; }

/* Capçalera d'article (receptes i guies) */
.article-cap { padding-top: clamp(56px, 7vw, 104px); padding-bottom: clamp(48px, 5vw, 72px); text-align: center; }
.molla { margin: 0 0 28px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; align-items: center; color: var(--suau); }
.molla a { color: var(--suau); }
.article-cap h1 { margin: 0 auto; max-width: 1000px; font-family: var(--serif); font-size: clamp(52px, 8vw, 120px); line-height: 0.98; letter-spacing: -0.025em; }
.article-cap .subtitol { margin: 32px auto 0; max-width: 600px; font-size: 18px; color: var(--text-2); }
.dades { margin: 48px auto 0; max-width: 760px; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); border-top: 1px solid var(--linia); border-bottom: 1px solid var(--linia); }
.dades > div { padding: 18px 12px; }
.dades dt { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }
.dades dd { margin: 4px 0 0; font-family: var(--serif); font-size: 24px; }
.accions { margin: 28px auto 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 28px; }
.menu-compartir { margin: 4px auto 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 0 24px; font-size: 14px; }
.menu-compartir a, .menu-compartir button { min-height: 44px; display: inline-flex; align-items: center; color: var(--suau); font: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.menu-compartir[hidden] { display: none; }
.foto-gran img { width: 100%; height: clamp(360px, 50vw, 680px); object-fit: cover; }
.foto-gran figcaption { margin-top: 12px; font-size: 13px; color: var(--suau); }
.descripcio .fila { display: flex; flex-wrap: wrap; gap: 32px 96px; padding-top: clamp(64px, 7vw, 104px); padding-bottom: clamp(64px, 7vw, 104px); border-bottom: 1px solid var(--linia); }
.descripcio .frase { margin: 0; flex: 1 1 380px; min-width: 0; max-width: 600px; font-family: var(--serif); font-size: clamp(26px, 2.6vw, 34px); line-height: 1.25; }
.descripcio .cos { flex: 1 1 380px; min-width: 0; max-width: 560px; color: var(--text-2); }
.descripcio .cos > :first-child { margin-top: 0; }

/* Recepta: tres columnes */
.recepta { display: flex; flex-wrap: wrap; gap: 56px 64px; align-items: flex-start; padding-top: clamp(64px, 7vw, 104px); padding-bottom: clamp(80px, 9vw, 136px); }
.recepta .col-ing { flex: 1 1 260px; min-width: 0; max-width: 340px; }
.recepta .col-pas { flex: 999 1 400px; min-width: 0; max-width: 600px; }
.recepta .col-video { flex: 1 1 280px; min-width: 0; max-width: 340px; }
.recepta h2 { margin: 0 0 20px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; font-family: var(--sans); }
.quantitat { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 0 16px; }
.quantitat .num { font-family: var(--serif); font-size: 26px; line-height: 1.1; display: block; }
.quantitat .porc { font-size: 14px; color: var(--suau); }
.quantitat .botons { display: flex; gap: 6px; }
.quantitat button { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: transparent; color: var(--tinta); border: 1px solid var(--tinta); cursor: pointer; padding: 0; }
.quantitat button:disabled { opacity: 0.3; cursor: default; }
.ingredients { margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--linia); }
.ingredients li { padding: 12px 0; border-top: 1px solid var(--linia); }
.ingredients .nota { display: block; font-size: 14px; color: var(--suau); }
.nota-quantitat { margin: 14px 0 0; font-size: 14px; color: var(--suau); }
.recepta .necessitaras { margin: 40px 0 12px; }
.passos { margin: 0; padding: 0; list-style: none; counter-reset: pas; }
.passos li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 8px; padding: 22px 0; border-top: 1px solid var(--linia); counter-increment: pas; }
.passos li:last-child { border-bottom: 1px solid var(--linia); }
.passos li::before { content: counter(pas); font-family: var(--serif); font-size: 30px; line-height: 1; color: var(--accent); }
.passos p { margin: 0; }
.reel { margin: 0; border: 1px solid var(--linia); background: #fff; }
.reel .instagram-media { margin: 0 !important; min-width: 0 !important; width: 100% !important; border: 0 !important; box-shadow: none !important; }
.reel iframe { width: 100% !important; }
.reel-buit { padding: 24px; font-size: 14px; color: var(--suau); }

/* Pas a pas (slider) */
.pas-a-pas { background: #4A4036; color: #FCFAF2; }
.pas-a-pas .contenidor { padding-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(72px, 8vw, 120px); }
.pas-a-pas .cap-slider { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px 40px; margin-bottom: 40px; }
.pas-a-pas h2 { margin: 0; font-family: var(--serif); font-size: clamp(36px, 4vw, 56px); line-height: 1.02; }
.pas-a-pas .fletxes { display: flex; gap: 8px; }
.pas-a-pas .fletxes button { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: transparent; color: #FCFAF2; border: 1px solid #FCFAF2; cursor: pointer; }
.pista { margin: 0; padding: 0 0 16px; list-style: none; display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.pista li { flex: 0 0 clamp(240px, 24vw, 320px); scroll-snap-align: start; }
.pista img { width: 100%; aspect-ratio: 520 / 734; object-fit: cover; }
.pista p { margin: 16px 0 0; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 8px; }
.pista p span:first-child { font-family: var(--serif); font-size: 26px; line-height: 1; }

/* Consells */
.consells .contenidor { padding-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(72px, 8vw, 120px); }
.consells h2 { margin: 0 0 40px; }
.consells .llista { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px 80px; }
.consells .llista p { margin: 0; padding-top: 20px; border-top: 1px solid var(--tinta); font-family: var(--serif); font-size: clamp(26px, 2.8vw, 38px); line-height: 1.2; }

/* Cos de les guies i pàgines (contingut de blocs) */
.cos-guia { padding-bottom: clamp(80px, 9vw, 136px); }
.cos-guia > *, .cos-pagina > * { max-width: 760px; margin-left: auto; margin-right: auto; }
.cos-guia > .alignwide, .cos-pagina > .alignwide { max-width: var(--ample); }
.cos-guia > .alignfull, .cos-pagina > .alignfull { max-width: none; }
.cos-guia h2, .cos-pagina h2 { font-family: var(--serif); font-size: clamp(36px, 4vw, 56px); line-height: 1.02; margin-top: clamp(72px, 8vw, 120px); margin-bottom: 24px; }
.cos-guia h3, .cos-pagina h3 { font-family: var(--serif); font-size: clamp(28px, 2.6vw, 38px); line-height: 1.1; margin-top: 48px; margin-bottom: 8px; padding-top: 24px; border-top: 1px solid var(--linia); }
.cos-guia h4 { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; margin: 40px 0 12px; padding-top: 16px; border-top: 1px solid var(--tinta); }
.cos-guia p, .cos-guia li, .cos-pagina p, .cos-pagina li { color: var(--text-2); }
.cos-guia a, .cos-pagina a { text-decoration: underline; text-underline-offset: 3px; }
.cos-guia .wp-block-gallery, .cos-guia .wp-block-image { margin-top: 24px; margin-bottom: 24px; }
.cos-guia .wp-block-gallery.has-nested-images figure.wp-block-image img { aspect-ratio: 3 / 4; object-fit: cover; }
.cos-guia figcaption, .cos-pagina figcaption { font-size: 13px; color: var(--suau); text-align: left; }
.cos-guia table { width: 100%; border-collapse: collapse; font-size: 15px; }
.cos-guia th, .cos-guia td { text-align: left; padding: 12px 12px 12px 0; border-top: 1px solid var(--linia); }
.cos-guia .wp-block-table { overflow-x: auto; }
.index-guia { margin-top: 40px; }
.index-guia ul { margin: 0; padding: 20px 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px 32px; border-top: 1px solid var(--tinta); border-bottom: 1px solid var(--linia); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }

/* Pàgines */
.pagina-cap { padding-top: clamp(56px, 7vw, 104px); padding-bottom: clamp(40px, 4vw, 56px); text-align: center; }
.pagina-cap h1 { margin: 0; font-family: var(--serif); font-size: clamp(48px, 7vw, 108px); line-height: 0.98; letter-spacing: -0.025em; }
.cos-pagina { padding-bottom: clamp(80px, 9vw, 136px); }

/* Contacte */
.contacte { display: flex; flex-wrap: wrap; gap: 64px 112px; align-items: flex-start; padding-top: clamp(56px, 7vw, 104px); padding-bottom: clamp(80px, 9vw, 136px); }
.contacte .info { flex: 1 1 380px; min-width: 0; max-width: 560px; }
.contacte h1 { margin: 0; font-family: var(--serif); font-size: clamp(52px, 7vw, 108px); line-height: 0.98; letter-spacing: -0.025em; }
.contacte .info > p { margin: 32px 0 0; font-size: 18px; color: var(--text-2); }
.contacte dl { margin: 48px 0 0; border-top: 1px solid var(--linia); }
.contacte dl div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 24px; padding: 18px 0; border-bottom: 1px solid var(--linia); }
.contacte dt { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); padding-top: 8px; }
.contacte dd { margin: 0; font-family: var(--serif); font-size: 26px; }
.contacte dd a { border-bottom: 1px solid var(--tinta); }
.contacte .formulari { flex: 1 1 420px; min-width: 0; max-width: 620px; padding: clamp(28px, 4vw, 56px); background: #fff; border: 1px solid var(--linia); }

/* Formularis (WPForms i similars) amb l'estil de la web */
.formulari input[type=text], .formulari input[type=email], .formulari textarea, .formulari select { width: 100%; font: inherit; font-size: 17px; color: var(--tinta); background: transparent; border: 0; border-bottom: 1px solid var(--tinta); border-radius: 0; padding: 8px 0; }
.formulari label { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }
.formulari button[type=submit], .formulari input[type=submit] { font: inherit; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: #FCFAF2; background: var(--accent); border: 1px solid var(--accent); padding: 0 28px; min-height: 48px; cursor: pointer; border-radius: 0; }

/* Paginació */
.paginacio { margin-top: 64px; display: flex; justify-content: center; gap: 8px; font-size: 14px; }
.paginacio .page-numbers { min-width: 40px; min-height: 40px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--linia); }
.paginacio .current { border-color: var(--tinta); }

/* Impressió de receptes */
@media print {
	.cap, .peu, .news, .accions, .menu-compartir, .foto-gran, .pas-a-pas, .col-video, .quantitat .botons, .relacionades, .no-imprimir { display: none !important; }
	body { background: #fff; }
	.article-cap { padding: 0 0 16px; }
	.article-cap h1 { font-size: 40px; }
	.recepta { padding: 16px 0; }
	.consells { background: none !important; }
}

/* Patrons de blocs: serveis i crida */
.cos-pagina > .servei { max-width: none; }
.servei .wp-block-media-text__media { min-height: 420px; }
.servei .wp-block-media-text__content { padding: clamp(40px, 5vw, 80px) clamp(24px, 5vw, 80px) !important; }
.servei .servei-num { margin: 0; font-family: var(--serif); font-size: clamp(96px, 12vw, 180px); line-height: 0.8; letter-spacing: -0.03em; }
.servei .servei-etiqueta { display: inline-block; margin: 28px 0 0; padding: 5px 9px 4px; font-size: 11px; line-height: 1.2; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
.servei .servei-titol { margin: 16px 0 0; padding: 0; border: 0; font-family: var(--serif); font-size: clamp(40px, 4.6vw, 68px); line-height: 1; letter-spacing: -0.015em; }
.servei .servei-text { margin: 24px 0 0; max-width: 460px; font-size: 18px; line-height: 1.5; color: var(--tinta); }
.cos-pagina > .crida { max-width: none; padding: clamp(80px, 9vw, 136px) var(--marge); }
.crida h2 { margin: 0 !important; font-size: clamp(40px, 5vw, 76px) !important; line-height: 1 !important; }
.wp-block-button.is-style-outline .wp-block-button__link { border: 1px solid var(--tinta); border-radius: 0; color: var(--tinta); background: transparent; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; padding: 14px 28px; }
.wp-block-button__link { border-radius: 0; }

/* Guies: blocs editorials (dies, forats per a fotos i vídeos, franges) */
.cos-guia > .wp-block-columns { max-width: var(--ample); gap: 48px 80px; margin-top: clamp(96px, 10vw, 152px); margin-bottom: 0; }
.cos-guia > .wp-block-columns.intro-guia { margin-top: 0; padding-bottom: clamp(56px, 6vw, 88px); border-bottom: 1px solid var(--linia); }
.cos-guia .intro-guia .frase-gran { margin: 0; font-family: var(--serif); font-size: clamp(26px, 2.6vw, 34px); line-height: 1.25; color: var(--tinta); }
.cos-guia .wp-block-columns h2 { margin-top: 20px; }
.cos-guia .wp-block-column > :first-child { margin-top: 0; }
.cos-guia .dia-num { margin: 0; font-family: var(--serif); font-size: clamp(88px, 10vw, 150px); line-height: 0.8; color: #9EBFE2 !important; }
.cos-guia .dia-num + h2 { margin-top: 20px; font-size: clamp(40px, 4.6vw, 64px); line-height: 1; }
.forat { display: flex; align-items: center; justify-content: center; text-align: center; aspect-ratio: 3 / 4; margin: 0 0 12px !important; padding: 16px; background: #E9E3D6; color: #5E5448 !important; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
.forat-ample { aspect-ratio: 16 / 10; }
.forat-horitzontal { aspect-ratio: 4 / 3; }
.forat-mapa { aspect-ratio: auto; min-height: 440px; }
.forat-video { position: relative; aspect-ratio: 9 / 16; flex-direction: column; gap: 12px; background: #2A231D; color: #FCFAF2 !important; }
.forat-video::before { content: '▶'; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; border: 1px solid #FCFAF2; border-radius: 50%; font-size: 16px; letter-spacing: 0; }
.cos-guia .forats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cos-guia .forats > .forat-horitzontal { grid-column: span 2; }
.cos-guia > .wp-block-group.alignfull.forat-franja { margin-top: clamp(96px, 10vw, 152px); }
.cos-guia > .forat-franja .forat { aspect-ratio: auto; height: clamp(320px, 42vw, 600px); margin: 0 !important; }
.cos-guia > .franja { max-width: none; margin-top: clamp(96px, 10vw, 152px); padding: clamp(72px, 8vw, 120px) var(--marge); }
.cos-guia > .franja > * { max-width: var(--ample); margin-left: auto; margin-right: auto; }
.franja-fosca { background: #4A4036; color: #FCFAF2; }
.franja-fosca p, .franja-fosca li { color: #E8E1D3; }
.franja-fosca h2, .franja-fosca h3 { color: #FCFAF2; border-color: #FCFAF2 !important; }
.franja-fosca .forat { background: #5C5145; color: #E8E1D3 !important; }
.franja-fosca .forat-video { background: #2A231D; }
.franja-blava { background: #9EBFE2; }
.franja-blava p { color: var(--tinta); }
.cos-guia .franja h2 { margin-top: 0; }
.cos-guia .franja .wp-block-columns { gap: 32px 48px; margin-top: 40px; }
.cos-guia .franja h3, .cos-guia .franja h4 { margin-top: 0; padding-top: 18px; border-top: 1px solid currentColor; }
.cos-guia .franja h4 { font-family: var(--sans); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; }
.cos-guia .moment { margin: 0 0 8px !important; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: #9EBFE2 !important; }
.cos-guia ul.pastilles { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cos-guia ul.pastilles li { padding: 8px 14px; border: 1px solid var(--linia); color: var(--tinta); }
.cos-guia ul.llista-neta, .cos-guia ol.llista-neta { list-style: none; padding: 0; border-bottom: 1px solid var(--linia); }
.cos-guia .llista-neta li { padding: 10px 0; border-top: 1px solid var(--linia); }
.cos-guia ol.dies { list-style: none; padding: 0; counter-reset: dia; border-bottom: 1px solid var(--linia); }
.cos-guia ol.dies li { counter-increment: dia; display: grid; grid-template-columns: 48px minmax(0, 1fr); padding: 14px 0; border-top: 1px solid var(--linia); font-family: var(--serif); font-size: 24px; line-height: 1.1; }
.cos-guia ol.dies li::before { content: counter(dia); color: var(--accent); font-size: 26px; }
.cos-guia ol.dies a { text-decoration: none; color: var(--tinta); }
.cos-guia .wp-block-image img { width: 100%; height: auto; }
.cos-guia .foto-alta img { aspect-ratio: 3 / 4; object-fit: cover; }
.cos-guia .foto-ampla img { aspect-ratio: 16 / 10; object-fit: cover; }
.cos-guia > .alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.cos-guia .wp-block-column:has(> .forat-video:only-child) { flex: 0 0 min(300px, 100%) !important; }
.cos-guia .wp-block-columns:has(.forat-video:only-child) { justify-content: space-between; }
.cos-guia .forats .wp-block-image { margin: 0; }
.cos-guia .forats .wp-block-image img { aspect-ratio: 3 / 4; object-fit: cover; }

/* Sobre mi */
.cos-sobre { padding-top: clamp(56px, 7vw, 104px); }
.cos-guia > .wp-block-columns.sobre-intro { margin-top: 0; gap: 56px 96px; align-items: flex-start; }
.sobre-intro .wp-block-image img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; }
.sobre-intro .etiqueta-sobre { margin: 0 0 24px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }
.cos-guia .sobre-intro h1 { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(44px, 5.6vw, 84px); line-height: 1; letter-spacing: -0.02em; }
.sobre-intro .entradeta { margin-top: 36px; font-family: var(--serif); font-size: clamp(24px, 2.2vw, 30px); line-height: 1.3; color: var(--tinta); }
.franja-verda { background: #B4C4AD; }
.franja-verda .manifest { max-width: 1100px; margin: 0 auto; font-family: var(--serif); font-size: clamp(30px, 3.6vw, 52px); line-height: 1.15; color: var(--tinta); }
.franja-verda .pd { max-width: 1100px; margin: 48px auto 0; padding-top: 20px; border-top: 1px solid var(--tinta); font-size: 15px; color: var(--tinta); }
.franja-verda .pd-in { max-width: 560px; }
.cos-guia > .wp-block-columns.continua { margin-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(72px, 8vw, 120px); gap: 24px; }
.continua .wp-block-column { padding-top: 20px; border-top: 1px solid var(--linia); }
.continua p { margin: 0; }
.continua .petit { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }
.continua .gran { margin-top: 8px; font-family: var(--serif); font-size: 30px; line-height: 1.1; }
.continua .gran a { text-decoration: none; color: var(--tinta); }

/* Serveis */
.cos-guia .cap-pagina { max-width: 1100px; text-align: center; padding-bottom: clamp(40px, 4vw, 56px); }
.cap-pagina .etiqueta-sobre { margin: 0 0 28px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--suau); }
.cos-guia .cap-pagina h1 { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(48px, 7vw, 108px); line-height: 0.98; letter-spacing: -0.025em; }
.cap-pagina .entradeta { margin: 32px auto 0; max-width: 620px; font-size: 18px; }
.cos-guia > .wp-block-columns.servei { width: 100vw; max-width: 100vw; margin: 0 calc(50% - 50vw); gap: 0; border-top: 1px solid var(--linia); align-items: stretch !important; }
.cos-guia > .wp-block-columns.servei.invers { flex-direction: row-reverse; }
.servei .wp-block-column { flex-basis: 50% !important; }
.servei .wp-block-image { margin: 0; height: 100%; }
.servei .wp-block-image img { width: 100%; height: 100%; min-height: 420px; max-height: 720px; aspect-ratio: 4 / 5; object-fit: cover; }
.servei .forat { height: 100%; min-height: 420px; margin: 0 !important; }
.servei .wp-block-column:has(.servei-num) { display: flex; flex-direction: column; justify-content: center; padding: clamp(40px, 5vw, 80px) clamp(24px, 5vw, 80px); }
.servei .servei-num { margin: 0; font-family: var(--serif); font-size: clamp(96px, 12vw, 180px); line-height: 0.8; letter-spacing: -0.03em; }
.servei .servei-etiqueta { align-self: flex-start; margin: 28px 0 0; padding: 5px 9px 4px; font-size: 11px; line-height: 1.2; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 600; color: var(--tinta) !important; }
.cos-guia .servei h2 { margin: 16px 0 0; font-size: clamp(40px, 4.6vw, 68px); line-height: 1; }
.servei h2::after { content: ''; display: block; width: 72px; height: 4px; margin-top: 20px; background: currentColor; }
.servei .servei-text { margin-top: 24px; max-width: 460px; font-size: 18px; line-height: 1.5; color: var(--tinta); }
.servei p.servei-text + p.servei-text { margin-top: 12px; font-size: 15px; }
.color-terracota .servei-num, .color-terracota h2::after { color: #D38D78; } .color-terracota .servei-etiqueta { background: #D38D78; }
.color-blau .servei-num, .color-blau h2::after { color: #9EBFE2; } .color-blau .servei-etiqueta { background: #9EBFE2; }
.color-rosa .servei-num, .color-rosa h2::after { color: #E3ADB2; } .color-rosa .servei-etiqueta { background: #E3ADB2; }
.color-verd .servei-num, .color-verd h2::after { color: #B4C4AD; } .color-verd .servei-etiqueta { background: #B4C4AD; }
.servei h2 { color: var(--tinta); }
.servei h2::after { color: inherit; }
.cos-guia > .clients { max-width: var(--ample); margin-top: 0; padding-top: clamp(72px, 8vw, 120px); padding-bottom: clamp(72px, 8vw, 120px); border-top: 1px solid var(--linia); }
.clients .clients-titol { margin: 0 0 40px; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; color: var(--tinta); }
.clients .logos { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); border-left: 1px solid var(--linia); border-top: 1px solid var(--linia); }
.clients .logos .wp-block-image { margin: 0; display: flex; align-items: center; justify-content: center; min-height: 160px; padding: 36px 24px; border-right: 1px solid var(--linia); border-bottom: 1px solid var(--linia); }
.clients .logos .wp-block-image img { width: auto; max-width: 100%; max-height: 84px; object-fit: contain; }
.cos-guia > .crida-blanca { background: #fff; border-top: 1px solid var(--linia); }
.crida-blanca h2 { margin: 0 !important; font-size: clamp(40px, 5vw, 76px) !important; line-height: 1 !important; }
.crida-blanca p { max-width: 520px; }
.crida-blanca .boto-p { margin-top: 32px; }
.crida-blanca .boto { text-decoration: none !important; }

/* Contacte: graella d'Instagram */
.insta-graella { padding-bottom: clamp(80px, 9vw, 136px); }
.insta-graella h2 em { font-style: italic; }
.insta-graella ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.insta-graella img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: opacity .2s; }
.insta-graella a:hover img { opacity: .85; }
@media (max-width: 760px) { .insta-graella ul { grid-template-columns: repeat(3, minmax(0, 1fr)); } }