/*
Theme Name: Las Flores de mi Lola
Theme URI: https://lasfloresdemilola.com
Author: Grupo Doscar
Author URI: https://doscar.es
Description: Tema a medida para Las Flores de mi Lola (floristería y mayorista de flores y plantas en Badajoz). Funciona junto al plugin «Lola Gestión».
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: lasfloresdemilola
*/

/* =========================================================================
   Variables
   ========================================================================= */
:root {
	--background: 40 25% 97%;
	--foreground: 150 20% 12%;
	--card: 40 20% 95%;
	--primary: 145 35% 32%;
	--primary-foreground: 40 30% 97%;
	--secondary: 38 20% 91%;
	--muted: 38 15% 91%;
	--muted-foreground: 150 10% 42%;
	--accent: 28 45% 45%;
	--accent-foreground: 40 30% 97%;
	--destructive: 0 84.2% 60.2%;
	--border: 38 15% 86%;
	--radius: .5rem;
	--font-heading: 'Cormorant Garamond', Georgia, serif;
	--font-body: 'Jost', system-ui, sans-serif;
	--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
	--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
}

/* =========================================================================
   Base
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; border: 0 solid hsl(var(--border)); }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: hsl(var(--background)); color: hsl(var(--foreground)); font-family: var(--font-body); line-height: 1.5; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-heading); font-size: inherit; font-weight: inherit; margin: 0; }
p, figure, blockquote, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; text-decoration: inherit; }
img, svg, iframe, video { display: block; max-width: 100%; }
img { height: auto; }
button, input, textarea, select { font: inherit; color: inherit; margin: 0; }
button { background: transparent; cursor: pointer; padding: 0; }
address { font-style: normal; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 2px; }
.no-scroll { overflow: hidden; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 200; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); padding: .5rem 1rem; }
.skip-link:focus { left: 1rem; top: 1rem; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

.icon { width: 1rem; height: 1rem; flex-shrink: 0; }
.text-primary { color: hsl(var(--primary)); }
.center { text-align: center; }
.muted { color: hsl(var(--muted-foreground)); }
.small { font-size: .875rem; line-height: 1.25rem; }

/* Tipografía */
.h-display { font-family: var(--font-heading); letter-spacing: .02em; font-weight: 500; }
.h-italic { font-family: var(--font-heading); font-style: italic; letter-spacing: .02em; font-weight: 300; }
.body-text { font-family: var(--font-body); font-weight: 300; line-height: 1.625; }
.eyebrow { font-family: var(--font-body); font-size: .75rem; line-height: 1rem; letter-spacing: .3em; text-transform: uppercase; color: hsl(var(--muted-foreground)); margin-bottom: 1.5rem; }
.h-section { font-size: 2.25rem; line-height: 2.5rem; color: hsl(var(--foreground)); margin-bottom: 1rem; }
.h-sub { font-size: 1.5rem; line-height: 2rem; margin-bottom: .5rem; }
.h-local { font-size: 1.875rem; line-height: 2.25rem; margin-bottom: 1rem; }
.lead { font-size: 1rem; line-height: 1.625; margin-bottom: 1.5rem; }
.lead:last-child { margin-bottom: 0; }

.link-underline { position: relative; display: inline-block; }
.link-underline::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: hsl(var(--primary)); transform: scaleX(0); transform-origin: bottom right; transition: transform .3s; }
.link-underline:hover::after { transform: scaleX(1); transform-origin: bottom left; }

.floral-divider { width: 4rem; height: 1px; background: hsl(var(--primary) / .3); margin: 2rem auto; }
.floral-divider.is-left { margin-left: 0; margin-top: 0; }
.divider-light { width: 4rem; height: 1px; background: hsl(var(--primary-foreground) / .3); margin-bottom: 2rem; }

/* Layout */
.section-padding { padding: 6rem 1.5rem; }
.container { max-width: 72rem; margin: 0 auto; }
.container.narrow { max-width: 48rem; }
.bg-secondary-10 { background: hsl(var(--secondary) / .1); }
.bg-secondary-20 { background: hsl(var(--secondary) / .2); }
.bg-secondary-30 { background: hsl(var(--secondary) / .3); }
.bg-secondary-50 { background: hsl(var(--secondary) / .5); }

.section-head { text-align: center; margin-bottom: 4rem; }
.section-head .pill { margin-bottom: 1.5rem; }
.section-intro { font-family: var(--font-body); font-weight: 300; line-height: 1.625; color: hsl(var(--muted-foreground)); margin: 1.5rem auto 0; max-width: 32rem; }
#products .section-intro { max-width: 42rem; }
#catalog .section-intro { max-width: 36rem; }
.section-cta { margin-top: 3.5rem; }
.section-cta-sm { margin-top: 2.5rem; }
#catalog .section-cta { margin-top: 3rem; }

.pill { display: inline-flex; align-items: center; gap: .5rem; padding: .375rem 1rem; border-radius: 9999px; background: hsl(var(--primary) / .1); color: hsl(var(--primary)); }
.pill .icon { width: .875rem; height: .875rem; }
.pill span { font-size: .75rem; line-height: 1rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; }
.pill.is-accent { background: hsl(var(--accent) / .1); color: hsl(var(--accent)); }

.grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.grid-lg-gap { gap: 2rem; }

.fade-up { opacity: 0; transform: translateY(30px); transition: opacity .8s ease-out, transform .8s ease-out; }
.fade-up.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .fade-up { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

/* =========================================================================
   Botones
   ========================================================================= */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .75rem 2rem; font-family: var(--font-body); font-size: .875rem; line-height: 1.25rem; letter-spacing: .05em; text-transform: uppercase; border: 1px solid transparent; transition: all .3s; cursor: pointer; text-align: center; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn-primary { background: hsl(var(--primary)); border-color: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-primary:hover:not(:disabled) { background: hsl(var(--primary) / .9); }
.btn-outline-light { border-color: hsl(var(--primary-foreground) / .4); color: hsl(var(--primary-foreground)); }
.btn-outline-light:hover { background: hsl(var(--primary-foreground) / .1); }
.btn-outline-primary { border-color: hsl(var(--primary)); color: hsl(var(--primary)); }
.btn-outline-primary:hover { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.btn-outline-dark { border-color: hsl(var(--border)); color: hsl(var(--foreground)); }
.btn-outline-dark:hover { background: hsl(var(--secondary)); }
.btn-ghost { color: hsl(var(--muted-foreground)); }
.btn-ghost:hover { color: hsl(var(--foreground)); }
.btn-rounded { border-radius: 2px; padding: .75rem 1.5rem; }
.btn-sm { padding: .625rem 1.25rem; font-size: .75rem; line-height: 1rem; border-radius: 2px; }
.btn-xs { padding: .375rem 1rem; font-size: .75rem; line-height: 1rem; border-radius: 2px; }
.btn-lg { padding: 1rem 2.5rem; }
.btn-wide-sm { width: 100%; padding-left: 2.5rem; padding-right: 2.5rem; margin-top: 1rem; }
.btn-self { align-self: flex-start; padding-left: 2.5rem; padding-right: 2.5rem; margin-top: 1rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: 1rem; }
.btn-row.center { justify-content: center; }
.text-link { display: inline-flex; align-items: center; gap: .375rem; font-size: .75rem; line-height: 1rem; color: hsl(var(--primary)); transition: color .2s; }
.text-link:hover { color: hsl(var(--primary) / .8); }
.text-link .icon { width: .875rem; height: .875rem; }

/* =========================================================================
   Navegación
   ========================================================================= */
.site-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; padding: .75rem 1.5rem; background: hsl(var(--background) / .9); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.admin-bar .site-nav { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-nav { top: 46px; } }
.brand { display: flex; align-items: center; gap: .75rem; }
.brand img { width: 2.5rem; height: 2.5rem; border-radius: 9999px; object-fit: cover; }
.brand span { display: none; font-family: var(--font-heading); font-size: 1.125rem; line-height: 1.75rem; letter-spacing: .025em; }
.menu-toggle { font-family: var(--font-heading); font-size: 1rem; line-height: 1.5rem; letter-spacing: .025em; }

.menu-overlay { position: fixed; inset: 0; z-index: 100; background: hsl(var(--background)); display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem; overflow-y: auto; }
.menu-close { position: absolute; top: 1.25rem; right: 1.5rem; font-size: .875rem; letter-spacing: .05em; color: hsl(var(--muted-foreground)); transition: color .2s; }
.menu-close:hover { color: hsl(var(--foreground)); }
.menu-logo { width: 5rem; height: 5rem; border-radius: 9999px; object-fit: cover; margin-bottom: 2rem; }
.menu-links { display: flex; flex-direction: column; align-items: center; gap: 2rem; }
.menu-links a { font-family: var(--font-heading); font-style: italic; font-weight: 300; letter-spacing: .02em; font-size: 1.875rem; line-height: 2.25rem; transition: color .2s; }
.menu-links a:hover { color: hsl(var(--primary)); }
@media (max-height: 640px) { .menu-links { gap: 1.25rem; } .menu-logo { width: 3.5rem; height: 3.5rem; margin-bottom: 1.25rem; } }

/* =========================================================================
   Hero y banners con imagen
   ========================================================================= */
.hero { position: relative; min-height: 100vh; min-height: 100svh; display: flex; align-items: flex-end; }
.hero-bg { position: absolute; inset: 0; overflow: hidden; }
.hero-bg img { width: 100%; height: 100%; object-fit: cover; }
.hero-shade { position: absolute; inset: 0; background: hsl(var(--foreground) / .3); }
.hero-shade.is-dark { background: hsl(var(--foreground) / .5); }
.hero-content { position: relative; z-index: 10; width: 100%; padding-bottom: 4rem; }
.hero-inner { max-width: 42rem; }
.hero-eyebrow { font-size: .75rem; line-height: 1rem; letter-spacing: .35em; text-transform: uppercase; color: hsl(var(--primary-foreground) / .6); margin-bottom: 1rem; }
.hero-title { font-size: 3rem; line-height: 1; color: hsl(var(--primary-foreground)); margin-bottom: 1.25rem; }
.hero-sub { font-size: 1.25rem; line-height: 1.75rem; color: hsl(var(--primary-foreground) / .85); margin-bottom: .75rem; }
.hero-text { font-size: 1rem; color: hsl(var(--primary-foreground) / .7); max-width: 32rem; margin-bottom: 2.5rem; }

.banner { position: relative; min-height: 50vh; display: flex; align-items: center; }
.banner-content { position: relative; z-index: 10; width: 100%; }
.banner-inner { max-width: 36rem; }
.eyebrow.on-dark { color: hsl(var(--primary-foreground) / .7); }
.banner-title { font-size: 2.25rem; line-height: 2.5rem; color: hsl(var(--primary-foreground)); margin-bottom: 1rem; }
.banner-text { font-size: 1rem; color: hsl(var(--primary-foreground) / .8); }

/* =========================================================================
   Secciones
   ========================================================================= */
/* Nosotros */
.about-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4rem; align-items: center; margin-bottom: 5rem; }
.about-img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.values-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.value { text-align: center; }
.value h3 { font-size: 1.125rem; line-height: 1.75rem; margin-bottom: .5rem; }
.icon-circle { width: 3.5rem; height: 3.5rem; margin: 0 auto 1rem; border-radius: 9999px; background: hsl(var(--primary) / .1); color: hsl(var(--primary)); display: flex; align-items: center; justify-content: center; transition: background .2s; }
.icon-circle .icon { width: 1.5rem; height: 1.5rem; }
.value:hover .icon-circle, .client-type:hover .icon-circle { background: hsl(var(--primary) / .2); }
.icon-circle.is-sm { width: 3rem; height: 3rem; margin: 0; flex-shrink: 0; }
.icon-circle.is-sm .icon { width: 1.25rem; height: 1.25rem; }

/* Servicios */
.services-group.has-gap { margin-bottom: 4rem; }
.services-intro { margin-bottom: 2.5rem; }
.service-card { background: hsl(var(--background)); padding: 2rem; border: 1px solid hsl(var(--border)); text-align: center; transition: all .5s; }
.service-card:hover { box-shadow: var(--shadow-lg); border-color: hsl(var(--primary) / .2); }
.service-icon { width: 2rem; height: 2rem; color: hsl(var(--primary)); margin: 0 auto 1.5rem; transition: transform .3s; }
.service-card:hover .service-icon { transform: scale(1.1); }
.service-card h4 { font-size: 1.125rem; line-height: 1.75rem; margin-bottom: .75rem; }

/* Pestañas del catálogo */
.tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-bottom: 3rem; }
.tab { padding: .5rem 1rem; border-radius: 9999px; font-size: .75rem; line-height: 1rem; letter-spacing: .05em; transition: all .3s; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); color: hsl(var(--muted-foreground)); }
.tab:hover { color: hsl(var(--foreground)); border-color: hsl(var(--primary) / .4); }
.tab.is-active { background: hsl(var(--primary)); border-color: hsl(var(--primary)); color: hsl(var(--primary-foreground)); box-shadow: var(--shadow-md); }
.tab-panel .fade-up { opacity: 1; transform: none; }

/* Tarjetas de producto */
.card { background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); overflow: hidden; transition: box-shadow .5s; }
.card:hover { box-shadow: var(--shadow-lg); }
.card-media { position: relative; overflow: hidden; background: hsl(var(--muted)); }
.ratio-square { aspect-ratio: 1 / 1; }
.ratio-4-5 { aspect-ratio: 4 / 5; }
.ratio-3-4 { aspect-ratio: 3 / 4; }
.ratio-video { aspect-ratio: 16 / 9; }
.card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.card:hover .card-media img { transform: scale(1.05); }
.card-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: hsl(var(--muted-foreground) / .2); }
.card-placeholder .icon { width: 3rem; height: 3rem; }
.card-hover { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: hsl(var(--foreground) / 0); opacity: 0; transition: all .3s; }
.card:hover .card-hover, .card-hover:focus-within { background: hsl(var(--foreground) / .4); opacity: 1; }
.card-body { padding: 1.25rem; }
.card-title { font-family: var(--font-heading); font-size: 1.125rem; line-height: 1.75rem; margin-bottom: .25rem; }
.card-text { font-size: .75rem; line-height: 1.625; color: hsl(var(--muted-foreground)); margin-bottom: .75rem; }
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-card.is-small .card-body { padding: 1rem; }
.product-card.is-small .card-title { font-size: 1rem; line-height: 1.5rem; margin-bottom: .5rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (hover: none) { .card-hover { display: none; } }

/* Más solicitados */
.grid-popular { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.popular-card { position: relative; border-radius: var(--radius); overflow: hidden; }
.popular-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.popular-card:hover img { transform: scale(1.1); }
.popular-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 1rem; background: linear-gradient(to top, hsl(var(--foreground) / .7), hsl(var(--foreground) / .1), transparent); }
.popular-overlay .card-title { color: hsl(var(--primary-foreground)); margin-bottom: .5rem; text-shadow: 0 2px 6px rgb(0 0 0 / .4); }
.popular-overlay .btn { align-self: flex-start; padding: .5rem 1rem; }

/* Tipos de cliente */
.client-type { display: flex; gap: 1rem; align-items: flex-start; }
.client-type h3 { font-size: 1.125rem; line-height: 1.75rem; margin-bottom: .25rem; }

/* Galería */
.masonry { columns: 2; column-gap: .75rem; }
.masonry-item { break-inside: avoid; position: relative; overflow: hidden; margin-bottom: .75rem; }
.masonry-item img { width: 100%; object-fit: cover; transition: all .7s; }
.masonry-item:hover img { transform: scale(1.05); filter: brightness(.9); }
.masonry-hover { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 1rem; opacity: 0; transition: opacity .3s; }
.masonry-item:hover .masonry-hover, .masonry-hover:focus-within { opacity: 1; }
.masonry-hover span { font-family: var(--font-heading); font-size: .875rem; color: hsl(var(--primary-foreground)); margin-bottom: .5rem; text-shadow: 0 2px 6px rgb(0 0 0 / .5); }
.masonry-hover .icon { width: .75rem; height: .75rem; }

/* Inspiración */
.inspiration-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.inspiration-item { position: relative; overflow: hidden; border-radius: var(--radius); aspect-ratio: 1 / 1; }
.inspiration-item.is-tall { grid-row: span 2; aspect-ratio: 3 / 4; }
.inspiration-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s; }
.inspiration-item:hover img { transform: scale(1.05); }
.inspiration-hover { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; padding: 1rem; text-align: center; background: linear-gradient(to top, hsl(var(--foreground) / .6), transparent); opacity: 0; transition: opacity .3s; }
.inspiration-item:hover .inspiration-hover, .inspiration-hover:focus-within { opacity: 1; }
.inspiration-hover span { font-family: var(--font-heading); font-size: 1rem; color: hsl(var(--primary-foreground)); margin-bottom: .75rem; text-shadow: 0 2px 6px rgb(0 0 0 / .5); }
.inspiration-hover .btn { padding: .5rem 1rem; }
@media (hover: none) {
	.masonry-hover, .inspiration-hover { opacity: 1; }
	.masonry-hover .btn, .inspiration-hover .btn { display: none; }
}

/* Testimonios */
.testimonial { background: hsl(var(--secondary) / .4); border: 1px solid hsl(var(--border)); padding: 2rem; transition: border-color .5s; }
.testimonial:hover { border-color: hsl(var(--primary) / .2); }
.stars { display: flex; gap: .25rem; margin-bottom: 1.25rem; color: hsl(var(--primary)); }
.star-filled { fill: currentColor; }
.testimonial blockquote { font-size: 1rem; line-height: 1.625; margin-bottom: 1.5rem; }
.testimonial figcaption strong { display: block; font-size: .875rem; font-weight: 500; }
.testimonial figcaption span { display: block; font-size: .75rem; color: hsl(var(--muted-foreground)); letter-spacing: .025em; }

/* Vídeos */
.videos { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; }
.video-frame { width: 267px; height: 476px; max-width: 100%; border-radius: var(--radius); overflow: hidden; border: 1px solid hsl(var(--border)); box-shadow: var(--shadow-md); background: hsl(var(--background)); }
.video-frame iframe { width: 267px; height: 476px; border: 0; overflow: hidden; }

/* Productos destacados */
.shop-preview { padding: 5rem 0; }
.shop-preview .container, .shop .container { max-width: 1400px; padding: 0 1.5rem; }
.shop-preview .section-head { margin-bottom: 3.5rem; }
.shop-preview .eyebrow { margin-bottom: 0; }
.shop-preview .h-section { font-size: 1.875rem; line-height: 2.25rem; margin-top: .75rem; }
.shop-preview .section-intro { margin-top: 1rem; font-weight: 400; }
.shop-preview .grid { gap: 1.5rem; margin-bottom: 3rem; }
.shop-preview .card:hover { box-shadow: var(--shadow-md); }
.arrow-link { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; letter-spacing: .05em; transition: color .2s; }
.arrow-link:hover { color: hsl(var(--primary)); }

/* Ubicación */
.local-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: center; }
.h-local { margin-bottom: 1.5rem; }
#professional-signup .h-local, .insta-head .h-local { margin-bottom: 1rem; }
.local-text p { font-size: 1rem; margin-bottom: 1rem; }
.local-text strong { color: hsl(var(--foreground)); font-weight: 600; }
.local-address { margin-top: 2rem; display: flex; align-items: flex-start; gap: .75rem; }
.local-address .icon { width: 1.25rem; height: 1.25rem; margin-top: .125rem; }
.local-address address { font-weight: 300; font-size: .875rem; line-height: 1.625; }
.local-address a { color: hsl(var(--primary)); }
.local-btn { margin-top: 1.5rem; }
.map-frame { width: 100%; border: 1px solid hsl(var(--border)); overflow: hidden; }
.map-frame iframe { width: 100%; height: 100%; border: 0; }
.local-map { aspect-ratio: 1 / 1; }

/* Formularios */
.form-card { background: hsl(var(--background)); border: 1px solid hsl(var(--border)); padding: 2rem; display: flex; flex-direction: column; gap: 1.5rem; }
.form-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.field { display: block; }
.field > span { display: block; font-size: .75rem; line-height: 1rem; letter-spacing: .2em; text-transform: uppercase; color: hsl(var(--muted-foreground)); margin-bottom: .5rem; }
.field input, .field textarea { width: 100%; background: transparent; border-bottom: 1px solid hsl(var(--border)); padding: .75rem 0; color: hsl(var(--foreground)); outline: none; transition: border-color .2s; border-radius: 0; }
.field input:focus, .field textarea:focus { border-color: hsl(var(--primary)); }
.field textarea { resize: none; }
.field textarea::placeholder { color: hsl(var(--muted-foreground) / .8); }
.consents { display: flex; flex-direction: column; gap: .75rem; padding-top: .5rem; }
.consent { display: flex; align-items: flex-start; gap: .5rem; font-size: .75rem; line-height: 1.625; color: hsl(var(--muted-foreground)); cursor: pointer; }
.consent input { width: 1rem; height: 1rem; margin-top: .125rem; flex-shrink: 0; accent-color: hsl(var(--primary)); }
.consent a { color: hsl(var(--primary)); }
.consent a:hover { text-decoration: underline; }
#professional-signup .section-head { margin-bottom: 3rem; }
#professional-signup .icon-circle { margin-bottom: 1rem; }

/* Redes */
.social-links { display: flex; justify-content: center; gap: 1.5rem; margin-top: 2rem; }
.social-links a { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; color: hsl(var(--muted-foreground)); transition: color .2s; }
.social-links a:hover { color: hsl(var(--primary)); }
.social-links .icon { width: 1.25rem; height: 1.25rem; }
.insta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.insta-grid a { aspect-ratio: 1 / 1; overflow: hidden; display: block; }
.insta-grid img { width: 100%; height: 100%; object-fit: cover; transition: all .7s; }
.insta-grid a:hover img { transform: scale(1.05); filter: brightness(1.05); }
section .section-head:has(.social-links) { margin-bottom: 3rem; }

/* Contacto */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4rem; }
.contact-info { display: flex; flex-direction: column; gap: 1.5rem; align-items: flex-start; }
.contact-info .map-frame { margin-top: .5rem; }
.contact-item { display: flex; align-items: flex-start; gap: 1rem; }
.contact-item .icon { width: 1.25rem; height: 1.25rem; margin-top: .25rem; }
.contact-item .label { font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: hsl(var(--muted-foreground)); margin-bottom: .25rem; }
.contact-info > .btn { gap: .75rem; margin-top: .5rem; }
.contact-form { display: flex; flex-direction: column; gap: 1.5rem; }

/* =========================================================================
   Pie, botones flotantes, cookies y avisos
   ========================================================================= */
.site-footer { border-top: 1px solid hsl(var(--border)); }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; }
.footer-brand { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.footer-brand img { width: 3rem; height: 3rem; border-radius: 9999px; object-fit: cover; }
.footer-brand p { font-size: 1.5rem; line-height: 2rem; }
.site-footer .body-text { margin-bottom: 1rem; }
.footer-address { display: flex; align-items: flex-start; gap: .5rem; font-weight: 300; font-size: .875rem; line-height: 1.625; }
.footer-address .icon { margin-top: .125rem; }
.footer-title { font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: hsl(var(--muted-foreground)); margin-bottom: 1rem; }
.footer-links { display: flex; flex-direction: column; gap: .75rem; }
.footer-links a { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; color: hsl(var(--muted-foreground)); transition: color .2s; }
.footer-links a:hover { color: hsl(var(--foreground)); }
.footer-bottom { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid hsl(var(--border)); display: flex; flex-direction: column; align-items: center; gap: .5rem; text-align: center; }
.footer-bottom p { font-size: .75rem; line-height: 1rem; color: hsl(var(--muted-foreground)); }
.footer-bottom .footer-credit { color: hsl(var(--muted-foreground) / .6); }
.footer-credit a:hover { color: hsl(var(--foreground)); }

.floating { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 50; display: flex; flex-direction: column; align-items: flex-end; gap: .75rem; }
.floating-btn { width: 3.5rem; height: 3.5rem; border-radius: 9999px; display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-lg); transition: all .3s; }
.floating-btn .icon { width: 1.5rem; height: 1.5rem; }
.floating-phone { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
.floating-phone:hover { background: hsl(var(--primary) / .9); }
.floating-wa { display: flex; align-items: center; gap: .75rem; }
.floating-whatsapp { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.floating-whatsapp:hover { background: hsl(var(--accent) / .9); transform: scale(1.1); }
.floating-tip { display: none; background: hsl(var(--card)); font-size: .75rem; padding: .5rem .75rem; border-radius: var(--radius); box-shadow: var(--shadow-md); border: 1px solid hsl(var(--border)); white-space: nowrap; }
.floating-wa:hover .floating-tip { display: block; animation: tip-in .2s ease-out; }
@keyframes tip-in { from { opacity: 0; transform: translateX(.5rem); } to { opacity: 1; transform: none; } }

.cookie-banner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: 1rem; }
.cookie-box { max-width: 42rem; margin: 0 auto; background: hsl(var(--card)); border: 1px solid hsl(var(--border)); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 1.5rem; }
.cookie-intro { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1rem; }
.cookie-icon { width: 1.25rem; height: 1.25rem; color: hsl(var(--primary)); margin-top: .125rem; }
.cookie-title { font-size: .875rem; font-weight: 500; margin-bottom: .25rem; }
.cookie-text { font-size: .75rem; line-height: 1.625; color: hsl(var(--muted-foreground)); }
.cookie-text a { color: hsl(var(--primary)); }
.cookie-text a:hover { text-decoration: underline; }
.cookie-actions { display: flex; flex-direction: column; gap: .5rem; }
.cookie-actions .btn { padding: .625rem 1.25rem; border-radius: .25rem; }
.cookie-config-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem; }
.cookie-close { color: hsl(var(--muted-foreground)); }
.cookie-close:hover { color: hsl(var(--foreground)); }
.cookie-opt { display: flex; align-items: center; gap: .75rem; font-size: .75rem; margin-bottom: .75rem; cursor: pointer; }
.cookie-opt:last-of-type { margin-bottom: 1.25rem; }
.cookie-opt.is-disabled { cursor: not-allowed; }
.cookie-opt input { width: 1rem; height: 1rem; accent-color: hsl(var(--primary)); }
.cookie-opt strong { font-weight: 600; }
.cookie-opt em { font-style: normal; color: hsl(var(--muted-foreground)); }

.toast-region { position: fixed; top: 0; left: 0; right: 0; z-index: 110; display: flex; flex-direction: column-reverse; gap: .5rem; padding: 1rem; pointer-events: none; }
.toast { pointer-events: auto; background: hsl(var(--background)); border: 1px solid hsl(var(--border)); border-radius: .375rem; box-shadow: var(--shadow-lg); padding: 1rem 1.25rem; opacity: 0; transform: translateY(-.5rem); transition: all .3s; }
.toast.is-in { opacity: 1; transform: none; }
.toast strong { display: block; font-size: .875rem; font-weight: 600; }
.toast p { font-size: .875rem; opacity: .9; margin-top: .25rem; }
.toast.is-success { border-left: 3px solid hsl(var(--primary)); }
.toast.is-error { border-left: 3px solid hsl(var(--destructive)); }

/* =========================================================================
   Páginas interiores: legales, catálogo y 404
   ========================================================================= */
.page-main { padding: 8rem 1rem 5rem; }
.prose-legal { max-width: 48rem; margin: 0 auto; }
.page-title { font-size: 2.25rem; line-height: 2.5rem; margin-bottom: 2rem; }
.prose-legal h2 { font-family: var(--font-heading); letter-spacing: .02em; font-weight: 500; font-size: 1.5rem; line-height: 2rem; margin: 2.5rem 0 1rem; }
.prose-legal h3 { font-family: var(--font-body); font-size: 1.125rem; font-weight: 500; margin: 1.5rem 0 .75rem; }
.prose-legal p { font-weight: 300; color: hsl(var(--muted-foreground)); font-size: .875rem; line-height: 1.625; margin-bottom: 1rem; }
.prose-legal ul { list-style: disc; padding-left: 1.5rem; margin-bottom: 1rem; }
.prose-legal ol { list-style: decimal; padding-left: 1.5rem; margin-bottom: 1rem; }
.prose-legal li { font-weight: 300; color: hsl(var(--muted-foreground)); font-size: .875rem; line-height: 1.625; margin-bottom: .25rem; }
.prose-legal strong { color: hsl(var(--foreground)); font-weight: 600; }
.prose-legal a { color: hsl(var(--primary)); }
.prose-legal a:hover { text-decoration: underline; }
.prose-legal table { width: 100%; border: 1px solid hsl(var(--border)); border-collapse: collapse; margin-bottom: 1.5rem; font-size: .875rem; display: block; overflow-x: auto; }
.prose-legal th { background: hsl(var(--muted)); padding: .5rem 1rem; text-align: left; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; color: hsl(var(--muted-foreground)); border-bottom: 1px solid hsl(var(--border)); font-weight: 500; }
.prose-legal td { padding: .5rem 1rem; color: hsl(var(--muted-foreground)); border-bottom: 1px solid hsl(var(--border)); }
.prose-legal .updated { margin-top: 3rem; }

.shop { padding-top: 5rem; }
.shop-hero { padding: 4rem 0; text-align: center; background: hsl(var(--secondary) / .3); }
.shop-hero-icon { width: 2.5rem; height: 2.5rem; color: hsl(var(--primary)); margin: 0 auto 1rem; }
.shop-hero h1 { font-size: 2.25rem; line-height: 2.5rem; margin-bottom: 1rem; }
.shop-hero p { max-width: 36rem; margin: 0 auto 1.5rem; font-size: 1.125rem; line-height: 1.75rem; color: hsl(var(--muted-foreground)); }
.shop-filters { padding: 2rem 0; border-bottom: 1px solid hsl(var(--border)); }
.shop-filters .container { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.shop-filters span { font-size: .875rem; color: hsl(var(--muted-foreground)); margin-right: .5rem; }
.chip { display: inline-flex; align-items: center; border-radius: 9999px; border: 1px solid hsl(var(--border)); padding: .125rem .625rem; font-size: .75rem; line-height: 1rem; font-weight: 600; transition: all .2s; }
.chip.is-active { background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); border-color: transparent; }
.shop-grid-wrap { padding: 3rem 0; }
.shop-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.shop-card .card-title { line-height: 1.25; margin-bottom: .5rem; }
.shop-card .card-text { font-size: .875rem; line-height: 1.25rem; }
.card-foot { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.badge { display: inline-flex; border-radius: 9999px; padding: .125rem .625rem; font-size: .75rem; font-weight: 600; background: hsl(var(--secondary)); }
.shop-empty { text-align: center; padding: 5rem 0; color: hsl(var(--muted-foreground)); }
.shop-empty .icon { width: 3rem; height: 3rem; margin: 0 auto 1rem; opacity: .4; }
.shop-empty p { font-size: 1.125rem; }
.shop-cta { padding: 4rem 0; background: hsl(var(--primary) / .05); text-align: center; }
.shop-cta h2 { font-size: 1.5rem; line-height: 2rem; margin-bottom: 1rem; }
.shop-cta p { color: hsl(var(--muted-foreground)); max-width: 32rem; margin: 0 auto 2rem; }

.not-found { min-height: 80vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 8rem 1.5rem 4rem; }
.not-found h1 { font-size: 2.25rem; line-height: 2.5rem; }
.not-found p { margin-bottom: 2rem; }

/* =========================================================================
   Responsive (mismos puntos de corte que el original: 640 / 768 / 1024 / 1280)
   ========================================================================= */
@media (min-width: 640px) {
	.brand span { display: inline; }
	.grid-2, .grid-3, .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.values-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cookie-actions { flex-direction: row; gap: .75rem; }
	.toast-region { top: auto; bottom: 0; left: auto; flex-direction: column; max-width: 420px; width: 100%; }
}

@media (min-width: 768px) {
	.section-padding { padding: 8rem 3rem; }
	.site-nav { padding-left: 3rem; padding-right: 3rem; }
	.menu-close { right: 3rem; }
	.menu-links a { font-size: 3rem; line-height: 1; }
	.h-section { font-size: 3rem; line-height: 1; }
	.h-sub { font-size: 1.875rem; line-height: 2.25rem; }
	.h-local { font-size: 2.25rem; line-height: 2.5rem; }
	.lead { font-size: 1.125rem; }
	.hero-content { padding-bottom: 6rem; }
	.hero-title { font-size: 4.5rem; }
	.hero-sub { font-size: 1.5rem; line-height: 2rem; }
	.hero-text { font-size: 1.125rem; }
	.banner-title { font-size: 3rem; line-height: 1; }
	.banner-text { font-size: 1.125rem; }
	.about-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6rem; }
	.tabs { gap: .75rem; }
	.tab { padding: .625rem 1.25rem; font-size: .875rem; line-height: 1.25rem; }
	.grid-popular { gap: 1.5rem; }
	.popular-overlay { padding: 1.25rem; }
	.popular-overlay .card-title { font-size: 1.25rem; }
	.masonry { columns: 3; }
	.inspiration-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
	.testimonial { padding: 2.5rem; }
	.testimonial blockquote { font-size: 1.125rem; line-height: 1.75rem; }
	.shop-preview { padding: 7rem 0; }
	.shop-preview .h-section { font-size: 3rem; line-height: 1; }
	.form-card { padding: 2.5rem; }
	.form-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.btn-wide-sm { width: auto; align-self: flex-start; }
	.contact-grid { gap: 6rem; }
	.footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.floating-phone { display: none; }
	.cookie-banner { padding: 1.5rem; }
	.shop-hero { padding: 6rem 0; }
	.shop-hero h1 { font-size: 3.75rem; line-height: 1; }
	.shop-grid-wrap { padding: 5rem 0; }
	.shop-cta h2 { font-size: 2.25rem; line-height: 2.5rem; }
}

@media (min-width: 1024px) {
	.section-padding { padding-left: 6rem; padding-right: 6rem; }
	.hero-title { font-size: 6rem; }
	.banner-title { font-size: 3.75rem; }
	.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.values-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.grid-popular { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.local-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5rem; }
	.local-map { aspect-ratio: 4 / 3; }
	.contact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.shop-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.insta-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 768px) and (max-width: 1023px) {
	#products .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.insta-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 1280px) {
	.shop-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 380px) {
	.btn { padding-left: 1.25rem; padding-right: 1.25rem; }
	.hero-title { font-size: 2.5rem; }
	.floating { right: 1rem; bottom: 1rem; }
}