/* SABOR DE @CASA — Design System */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;600;700&family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500&display=swap');

:root {
  --cream: #F5F5DC; --cream-light: #FDFDF5; --cream-dark: #EDE8CD;
  --terracotta: #E2725B; --terracotta-dark: #C75D48; --terracotta-light: #F0A090;
  --chocolate: #3E2723; --chocolate-light: #5D4037;
  --sage: #9CAF88; --sage-light: #B8C9A8; --sage-dark: #7A9166;
  --white: #FFFFFF; --overlay: rgba(62,39,35,0.55);
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --font-script: 'Dancing Script', cursive;
  --space-xs: 0.5rem; --space-sm: 1rem; --space-md: 1.5rem;
  --space-lg: 2.5rem; --space-xl: 4rem; --space-2xl: 6rem;
  --max-width: 1200px; --header-height: 80px;
  --shadow-sm: 0 2px 8px rgba(62,39,35,0.08);
  --shadow-md: 0 4px 20px rgba(62,39,35,0.12);
  --shadow-lg: 0 8px 40px rgba(62,39,35,0.16);
  --shadow-card: 0 6px 30px rgba(62,39,35,0.1);
  --transition-fast: 0.2s ease; --transition-base: 0.3s ease; --transition-slow: 0.5s ease;
  --radius-sm: 6px; --radius-md: 12px; --radius-lg: 20px; --radius-xl: 30px; --radius-round: 50%;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--font-body);color:var(--chocolate);background:var(--cream-light);line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit;transition:color var(--transition-fast)}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;outline:none}
input,textarea,select{font-family:inherit;outline:none}

h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:600;line-height:1.2;color:var(--chocolate)}
h1{font-size:clamp(2.2rem,5vw,3.5rem)}
h2{font-size:clamp(1.8rem,4vw,2.8rem)}
h3{font-size:clamp(1.3rem,3vw,1.8rem)}
h4{font-size:clamp(1.1rem,2.5vw,1.4rem)}
p{font-size:1rem;line-height:1.8;color:var(--chocolate-light)}
.font-script{font-family:var(--font-script)}
.text-terracotta{color:var(--terracotta)}
.text-center{text-align:center}
.container{width:100%;max-width:var(--max-width);margin:0 auto;padding:0 1.5rem}
.section{padding:var(--space-2xl) 0}
.section-sm{padding:var(--space-xl) 0}

.section-header{text-align:center;margin-bottom:var(--space-xl)}
.section-header h2{margin-bottom:var(--space-xs)}
.section-header .subtitle{font-family:var(--font-script);font-size:1.3rem;color:var(--terracotta);display:block;margin-bottom:var(--space-sm)}
.section-header p{max-width:600px;margin:0 auto;font-size:1.05rem}
.section-divider{width:60px;height:3px;background:var(--terracotta);margin:var(--space-sm) auto;border-radius:2px}

/* HEADER */
.header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(253,253,245,0.95);backdrop-filter:blur(10px);border-bottom:1px solid rgba(62,39,35,0.08);transition:all var(--transition-base);height:var(--header-height)}
.header.scrolled{box-shadow:var(--shadow-md);height:70px}
.header .container{display:flex;align-items:center;justify-content:space-between;height:100%}
.logo{display:flex;align-items:center;gap:0.6rem;z-index:1001}
.logo-icon{font-size:1.8rem}
.logo-text{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--chocolate)}
.logo-text span{color:var(--terracotta)}
.custom-logo-link{display:flex;align-items:center}
.custom-logo{height:50px!important;width:auto!important;max-width:150px!important;object-fit:contain;object-position:left center}
@media (max-width:768px){
.custom-logo{height:40px!important;max-width:120px!important}
}
@media (max-width:480px){
.custom-logo{height:35px!important;max-width:100px!important}
}
.nav-links{display:flex;align-items:center;gap:2rem}
.nav-links a{font-size:0.9rem;font-weight:500;letter-spacing:0.3px;color:var(--chocolate-light);position:relative;padding:0.3rem 0}
.nav-links a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--terracotta);transition:width var(--transition-base)}
.nav-links a:hover,.nav-links a.active{color:var(--terracotta)}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-cta{background:var(--terracotta)!important;color:var(--white)!important;padding:0.6rem 1.4rem!important;border-radius:var(--radius-xl);font-weight:600!important;font-size:0.85rem!important;transition:all var(--transition-base)!important}
.nav-cta::after{display:none!important}
.nav-cta:hover{background:var(--terracotta-dark)!important;transform:translateY(-2px);box-shadow:0 4px 15px rgba(226,114,91,0.4)}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;z-index:1001;padding:5px}
.hamburger span{display:block;width:26px;height:2.5px;background:var(--chocolate);border-radius:2px;transition:all var(--transition-base)}
.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.85rem 2rem;border-radius:var(--radius-xl);font-weight:600;font-size:0.95rem;transition:all var(--transition-base);cursor:pointer;border:2px solid transparent;letter-spacing:0.3px}
.btn-primary{background:var(--terracotta);color:var(--white);border-color:var(--terracotta)}
.btn-primary:hover{background:var(--terracotta-dark);border-color:var(--terracotta-dark);transform:translateY(-3px);box-shadow:0 6px 25px rgba(226,114,91,0.35)}
.btn-secondary{background:transparent;color:var(--terracotta);border-color:var(--terracotta)}
.btn-secondary:hover{background:var(--terracotta);color:var(--white);transform:translateY(-3px);box-shadow:0 6px 25px rgba(226,114,91,0.35)}
.btn-white{background:var(--white);color:var(--terracotta);border-color:var(--white)}
.btn-white:hover{background:var(--cream);transform:translateY(-3px);box-shadow:0 6px 25px rgba(255,255,255,0.3)}
.btn-sm{padding:0.6rem 1.4rem;font-size:0.85rem}
.btn-lg{padding:1rem 2.5rem;font-size:1.05rem}

/* HERO */
.hero{position:relative;height:100vh;min-height:600px;max-height:900px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(62,39,35,0.65)0%,rgba(62,39,35,0.4)50%,rgba(226,114,91,0.25)100%);z-index:1}
.hero-content{position:relative;z-index:2;text-align:center;max-width:800px;padding:0 1.5rem}
.hero-content .subtitle{font-family:var(--font-script);font-size:clamp(1.2rem,3vw,1.6rem);color:var(--terracotta-light);margin-bottom:var(--space-sm);display:block}
.hero-content h1{color:var(--white);font-size:clamp(2.4rem,5.5vw,3.8rem);margin-bottom:var(--space-md);text-shadow:0 2px 10px rgba(0,0,0,0.2);line-height:1.15}
.hero-content .hero-desc{color:rgba(255,255,255,0.9);font-size:clamp(1rem,2.2vw,1.2rem);margin-bottom:var(--space-lg);font-weight:300;max-width:600px;margin-left:auto;margin-right:auto}
.hero-buttons{display:flex;gap:var(--space-sm);justify-content:center;flex-wrap:wrap}
.hero-scroll{position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:2;animation:bounce 2s infinite}
.hero-scroll span{display:block;width:28px;height:44px;border:2px solid rgba(255,255,255,0.6);border-radius:14px;position:relative}
.hero-scroll span::before{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:4px;height:8px;background:rgba(255,255,255,0.8);border-radius:2px;animation:scroll-down 2s infinite}
@keyframes bounce{0%,20%,50%,80%,100%{transform:translateX(-50%) translateY(0)}40%{transform:translateX(-50%) translateY(-8px)}60%{transform:translateX(-50%) translateY(-4px)}}
@keyframes scroll-down{0%{opacity:1;top:8px}100%{opacity:0;top:22px}}
