﻿:root{--icona-black:#000000;--icona-wine:#8f4144;--icona-white:#FFFFFF;--icona-wine-light:#CA8083;--icona-wine-medium:#AD5A5E;--icona-gray-dark:#2c2c2c;--icona-gray-medium:#666666;--icona-gray-light:#f5f5f5;--icona-gold:#daa520;--icona-gold-star:#ffd700;--font-tundra:'TUNDRA',Georgia,serif;--font-clarika:'Clarika',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--spacing-xs:8px;--spacing-sm:15px;--spacing-md:25px;--spacing-lg:40px;--spacing-xl:60px;--spacing-xxl:80px;--radius-sm:12px;--radius-md:20px;--radius-lg:25px;--radius-xl:40px;--shadow-sm:0 4px 12px rgba(0,0,0,.1);--shadow-md:0 8px 25px rgba(0,0,0,.1);--shadow-lg:0 10px 30px rgba(0,0,0,.15);--transition-fast:.3s ease;--transition-medium:.5s ease}

@font-face{font-family:'TUNDRA';src:url('fonts/TUNDRA.woff2') format('woff2'),url('fonts/TUNDRA.woff') format('woff'),url('fonts/TUNDRA.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}

@font-face{font-family:'Clarika';src:url('fonts/Clarika-Regular.woff2') format('woff2'),url('fonts/Clarika-Regular.woff') format('woff'),url('fonts/Clarika-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}

@font-face{font-family:'Clarika';src:url('fonts/Clarika-Bold.woff2') format('woff2'),url('fonts/Clarika-Bold.woff') format('woff'),url('fonts/Clarika-Bold.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}

@font-face{font-family:'Clarika';src:url('fonts/Clarika-Light.woff2') format('woff2'),url('fonts/Clarika-Light.woff') format('woff'),url('fonts/Clarika-Light.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}

*{margin:0;padding:0;box-sizing:border-box}

body{font-family:var(--font-clarika);color:var(--icona-white);overflow-x:hidden;min-height:100vh}

.experiencia-container{max-width:1200px;margin:0 auto;padding:40px 20px}

.experiencia-title{font-family:var(--font-tundra);font-size:2.5em;font-weight:bold;color:var(--icona-wine);text-align:center;margin-bottom:60px;letter-spacing:2px;text-transform:uppercase}

.experiencia-gallery-section{margin-bottom:80px}

.experiencia-gallery-dual{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}

.experiencia-gallery-single{display:grid;grid-template-columns:1fr;margin-bottom:30px}

.experiencia-image-container{position:relative;overflow:hidden}

.experiencia-image{width:100%;height:300px;object-fit:cover;transition:transform .3s ease}

.experiencia-description{font-family:var(--font-clarika);font-size:.9em;line-height:1.6;color:#666;text-align:justify;margin:20px 0 40px 0;padding:0 10px}

.experiencia-highlight{font-family:var(--font-tundra);font-size:1.8em;color:#2c3e50;text-align:center;margin:60px 0 40px 0;font-weight:300;letter-spacing:1px}

.experiencia-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:40px;margin:60px 0}

.experiencia-feature{text-align:center;padding:30px 20px}

.experiencia-feature-title{font-family:var(--font-tundra);font-size:1.3em;color:#2c3e50;margin-bottom:15px;font-weight:500}

.experiencia-feature-text{font-family:var(--font-clarika);font-size:.95em;color:#777;line-height:1.6}

.experiencia-showcase{background:#f8f9fa;padding:60px 40px;border-radius:15px;margin:80px 0;text-align:center}

.experiencia-showcase-title{font-family:var(--font-tundra);font-size:2em;color:#2c3e50;margin-bottom:30px;font-weight:400}

.experiencia-showcase-text{font-family:var(--font-clarika);font-size:1.1em;color:#555;line-height:1.8;max-width:600px;margin:0 auto}

/* Responsive: mobile adjustments for Family Jewelry page */
@media (max-width: 767px) {
	.experiencia-container { padding: 18px 12px; }
	.experiencia-title { font-size: 28px; margin-bottom: 24px; }

	/* Stack layout vertically */
	.experiencia-layout { display: block; }

	/* Video adjustments: avoid using calc(100vh - X) on small screens */
	.experiencia-video { width: 100% !important; max-width: 100% !important; height: auto !important; max-height: 56vh !important; margin-bottom: 16px; }
	.experiencia-video video { width: 100% !important; height: auto !important; max-height: 56vh !important; object-fit: cover !important; border-radius: 8px !important; }

	.experiencia-text { padding: 8px 0 20px 0; }
	.experiencia-text h2 { font-size: 20px; }
	.experiencia-text p { font-size: 15px; color: #444; }

	/* Ensure header/hamburger remain accessible */
	header { position: relative; z-index: 1200; }
	.hamburger-menu { display: flex !important; position: absolute !important; top: 12px !important; right: 12px !important; z-index:1500 !important; }

	/* Reduce large paddings on showcase/features to avoid excessive scrolling */
	.experiencia-showcase, .experiencia-features { padding: 24px 12px; margin: 30px 0; }
}

