/* vietnamese */
@font-face { font-family:'Barlow';font-style:italic;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_01.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:italic;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_02.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:italic;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_03.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* vietnamese */
@font-face { font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url("/assets/fonts/barlow_04.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url("/assets/fonts/barlow_05.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:normal;font-weight:300;font-display:swap;src:url("/assets/fonts/barlow_06.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* vietnamese */
@font-face { font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_07.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_08.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_09.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* vietnamese */
@font-face { font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_10.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_11.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_12.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* vietnamese */
@font-face { font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_13.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_14.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_15.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* vietnamese */
@font-face { font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_16.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* latin-ext */
@font-face { font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_17.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
/* latin */
@font-face { font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_18.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* Barlow Condensed 500 */
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_19.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_20.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:500;font-display:swap;src:url("/assets/fonts/barlow_21.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* Barlow Condensed 600 */
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_22.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_23.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:600;font-display:swap;src:url("/assets/fonts/barlow_24.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* Barlow Condensed 700 */
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_25.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_26.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Barlow Condensed';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_27.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
/* Oswald */
@font-face { font-family:'Oswald';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_28.woff2") format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_29.woff2") format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_30.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_31.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_32.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:500 700;font-display:swap;src:url("/assets/fonts/barlow_28.woff2") format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:500 700;font-display:swap;src:url("/assets/fonts/barlow_31.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5;}
@font-face { font-family:'Oswald';font-style:normal;font-weight:500 700;font-display:swap;src:url("/assets/fonts/barlow_32.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC;}
/* Space Mono */
@font-face { font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_33.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_34.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;src:url("/assets/fonts/barlow_35.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face { font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_36.woff2") format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face { font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_37.woff2") format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face { font-family:'Space Mono';font-style:normal;font-weight:700;font-display:swap;src:url("/assets/fonts/barlow_38.woff2") format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ── Reset & base ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: #14161A; font-family: 'Barlow', -apple-system, BlinkMacSystemFont, sans-serif; font-size: 18px; color: #C9CED4; -webkit-font-smoothing: antialiased; }
a { color: inherit; }
button, input, select, textarea { font-family: inherit; }

/* ── Scroll-reveal ── */
[data-fade] { opacity: 0; transform: translateY(28px); transition: opacity 0.6s ease, transform 0.6s ease; }
[data-fade][data-d1] { transition-delay: 0.1s; }
[data-fade][data-d2] { transition-delay: 0.2s; }
[data-fade][data-d3] { transition-delay: 0.3s; }
[data-fade].du-v { opacity: 1; transform: translateY(0); }

/* ── Nav ── */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; background: #14161A; border-bottom: 2px solid #E11D2A; display: flex; align-items: center; justify-content: space-between; padding: 0 60px; height: 72px; }
.nav-logo { display: flex; align-items: center; gap: 14px; cursor: pointer; flex-shrink: 0; text-decoration: none; }
.nav-logo-text { line-height: 1; }
.nav-logo-name { font-family: 'Oswald'; font-weight: 700; font-size: 20px; letter-spacing: 3px; color: #fff; }
.nav-logo-sub { font-family: 'Space Mono'; font-size: 9px; letter-spacing: 4px; color: #9AA3AD; }
.nav-links { display: flex; align-items: center; gap: 40px; }
.nav-link { position: relative; padding-bottom: 4px; font-family: 'Oswald'; font-weight: 500; font-size: 15px; letter-spacing: 2px; color: #C9CED4; text-transform: uppercase; text-decoration: none; transition: color 0.2s; }
.nav-link:hover { color: #fff; }
.nav-link.active::after, .nav-link:hover::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 2px; background: #E11D2A; }
.nav-cta { background: #25D366; color: #fff; padding: 12px 24px; font-family: 'Oswald'; font-weight: 700; font-size: 14px; letter-spacing: 2px; text-decoration: none; display: flex; align-items: center; gap: 8px; }
.nav-cta:hover { opacity: .9; }

/* Hamburger menu */
.nav-hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 4px; }
.nav-hamburger span { display: block; width: 24px; height: 2px; background: #fff; transition: transform .3s, opacity .3s; }
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.nav-mobile { display: flex; position: fixed; top: 72px; left: 0; right: 0; background: #14161A; border-bottom: 2px solid #E11D2A; z-index: 999; flex-direction: column; padding: 0 30px; gap: 16px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease-in-out, padding 0.3s ease-in-out; }
.nav-mobile.open { max-height: 350px; padding: 20px 30px 28px; }
.nav-mobile .nav-link { font-size: 18px; }

/* ── WhatsApp flotante ── */
.wa-float { position: fixed; bottom: 32px; right: 32px; z-index: 999; width: 60px; height: 60px; border-radius: 50%; background: #25D366; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(37,211,102,0.45); text-decoration: none; transition: transform .2s; }
.wa-float:hover { transform: scale(1.08); }

/* ── Wrapper ── */
.page { min-height: 100vh; display: flex; flex-direction: column; }
.main { flex: 1; padding-top: 72px; }

/* ── Botón rojo estándar ── */
.btn-red { background: #E11D2A; color: #fff; padding: 16px 36px; font-family: 'Oswald'; font-weight: 700; font-size: 18px; letter-spacing: 2px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; border: none; cursor: pointer; transition: opacity .2s; }
.btn-red:hover { opacity: .88; }
.btn-dark { background: #14161A; color: #fff; padding: 16px 36px; font-family: 'Oswald'; font-weight: 700; font-size: 18px; letter-spacing: 2px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; border: none; cursor: pointer; transition: opacity .2s; }
.btn-dark:hover { opacity: .88; }
.btn-green { background: #25D366; color: #fff; padding: 16px 36px; font-family: 'Oswald'; font-weight: 700; font-size: 18px; letter-spacing: 2px; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.btn-green:hover { opacity: .9; }

/* ── Bottle CSS art ── */
.bottle { width: 180px; height: 320px; background: linear-gradient(160deg,#3a4048 0%,#2b2f36 30%,#2b2f36 100%); border-radius: 14px 14px 6px 6px; position: relative; box-shadow: 0 30px 80px rgba(0,0,0,0.6), inset 2px 0 8px rgba(255,255,255,0.06); }
.bottle-cap { position: absolute; top: -22px; left: 50%; transform: translateX(-50%); width: 44px; height: 26px; background: #1a1d22; border-radius: 8px 8px 0 0; }
.bottle-label { position: absolute; top: 30%; left: 0; right: 0; bottom: 28%; background: #E11D2A; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 14px 10px; }
.bottle-ml { position: absolute; bottom: 10px; left: 0; right: 0; text-align: center; font-family: 'Space Mono'; font-size: 9px; color: #9AA3AD; letter-spacing: 1px; }

/* ── Sección con patrón diagonal ── */
.pattern-bg::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, rgba(255,255,255,0.015) 0px, rgba(255,255,255,0.015) 1px, transparent 1px, transparent 28px); pointer-events: none; }

/* ── Formulario ── */
.form-label { display: block; font-family: 'Space Mono'; font-size: 11px; letter-spacing: 2px; color: #9AA3AD; margin-bottom: 6px; }
.form-input { width: 100%; background: #fff; border: 1px solid #dde0e3; padding: 14px 16px; font-size: 16px; color: #14161A; outline: none; transition: border-color .2s; }
.form-input:focus { border-color: #E11D2A; }
.form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* ── Footer ── */
.footer { background: #0c0d10; padding: 60px 80px 30px; border-top: 2px solid #E11D2A; }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 60px; margin-bottom: 50px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,0.08); padding-top: 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.footer-copy { font-family: 'Space Mono'; font-size: 11px; color: #4A5058; letter-spacing: 1px; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .nav { padding: 0 30px; }
  .nav-links { gap: 20px; }
  .footer { padding: 50px 30px 24px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
}

@media (max-width: 768px) {
  .nav-links, .nav-cta { display: none; }
  .nav-hamburger { display: flex; }
  .wa-float { bottom: 20px; right: 20px; width: 52px; height: 52px; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer { padding: 40px 20px 20px; }
  .form-grid-2 { grid-template-columns: 1fr; }
}

/* ── Grid System (Lightweight Tailwind-like Utilities) ── */
.grid {
  display: grid;
}

/* Default cols (Mobile first / Stacked by default unless specified) */
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Gaps */
.gap-0 { gap: 0px; }
.gap-4 { gap: 16px; }
.gap-6 { gap: 24px; }
.gap-8 { gap: 32px; }
.gap-12 { gap: 48px; }
.gap-16 { gap: 64px; }

/* Responsive Grid columns (Tablet - min-width: 768px) */
@media (min-width: 768px) {
  .md\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .md\:gap-6 { gap: 24px; }
  .md\:gap-8 { gap: 32px; }
}

/* Responsive Grid columns (Desktop - min-width: 1024px) */
@media (min-width: 1024px) {
  .lg\:grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  
  /* Proporciones específicas de DIKAL */
  .lg\:grid-cols-hero { grid-template-columns: 55% 45%; }
  .lg\:grid-cols-mayoreo-hero { grid-template-columns: 1fr auto; }
  .lg\:grid-cols-contacto { grid-template-columns: 1.1fr 1fr; }
  .lg\:grid-cols-faq { grid-template-columns: 1fr 1.4fr; }
  
  .lg\:gap-16 { gap: 64px; }
}

/* Rellenos Responsivos (Reemplaza los inline paddings rígidos) */
.section-padding {
  padding: 90px 80px;
}
@media (max-width: 1024px) {
  .section-padding {
    padding: 60px 40px;
  }
}
@media (max-width: 768px) {
  .section-padding {
    padding: 50px 20px;
  }
  .btn-red, .btn-dark, .btn-green {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}

/* Evitar desbordamiento en Hero (etiquetas de botella) y elementos absolutos */
@media (max-width: 768px) {
  section {
    overflow-x: hidden;
  }
}

/* Clases específicas de diseño adaptadas a móvil */
.hero-left {
  padding: 80px 60px 80px 80px;
  position: relative;
  z-index: 2;
}
.hero-right {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding: 80px 60px;
  position: relative;
  z-index: 2;
}
.bottle-badge-right {
  position: absolute;
  top: 10%;
  right: -80px;
  background: #F5A623;
  color: #14161A;
  padding: 8px 14px;
  font-family: 'Oswald';
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1px;
  white-space: nowrap;
}
.bottle-badge-left {
  position: absolute;
  bottom: 20%;
  left: -80px;
  background: #14161A;
  border: 1px solid rgba(255,255,255,0.15);
  color: #C9CED4;
  padding: 8px 14px;
  font-family: 'Space Mono';
  font-size: 12px;
  letter-spacing: 1px;
  white-space: nowrap;
}

@media (max-width: 1024px) {
  .hero-left {
    padding: 60px 40px;
  }
  .hero-right {
    padding: 60px 40px;
  }
}
@media (max-width: 768px) {
  .hero-left {
    padding: 40px 20px;
    text-align: center;
  }
  .hero-left h1 {
    text-align: center;
  }
  .hero-left div[style*="display:flex"] {
    justify-content: center;
  }
  .hero-right {
    padding: 20px 20px 60px;
  }
  .bottle-badge-right {
    right: -20px;
    font-size: 11px;
    padding: 6px 10px;
  }
  .bottle-badge-left {
    left: -20px;
    font-size: 11px;
    padding: 6px 10px;
  }
}

/* Celdas de estadísticas responsivas */
.stat-cell {
  padding: 50px 40px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  border-right: none;
}
@media (min-width: 768px) {
  .stat-cell {
    border-right: 1px solid rgba(255,255,255,0.1);
  }
  .stat-cell:nth-child(2n) {
    border-right: none;
  }
  .stat-cell:nth-child(1), .stat-cell:nth-child(2) {
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }
  .stat-cell:nth-child(3), .stat-cell:nth-child(4) {
    border-bottom: none;
  }
}
@media (min-width: 1024px) {
  .stat-cell {
    border-bottom: none;
    border-right: 1px solid rgba(255,255,255,0.1);
  }
  .stat-cell:last-child {
    border-right: none;
  }
}

/* Contenedor de botones CTA responsivo */
.cta-buttons {
  display: flex;
  flex-direction: column;
  gap: 14px;
  align-items: flex-start;
  width: auto;
}
@media (max-width: 768px) {
  .cta-buttons {
    width: 100%;
    align-items: stretch;
  }
}

/* Rejilla de distintivos en Hero de Mayoreo */
.mayoreo-hero-badges {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-end;
}
@media (max-width: 1024px) {
  .mayoreo-hero-badges {
    align-items: center;
    width: 100%;
  }
}

/* Celdas de proceso responsivas */
.proceso-card {
  padding: 44px 32px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  border-right: none;
}
@media (min-width: 768px) {
  .proceso-card {
    border-right: 1px solid rgba(255,255,255,0.1);
  }
  .proceso-card:nth-child(2n) {
    border-right: none;
  }
  .proceso-card:nth-child(1), .proceso-card:nth-child(2) {
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }
  .proceso-card:nth-child(3), .proceso-card:nth-child(4) {
    border-bottom: none;
  }
}
@media (min-width: 1024px) {
  .proceso-card {
    border-bottom: none;
    border-right: 1px solid rgba(255,255,255,0.1);
  }
  .proceso-card:last-child {
    border-right: none;
  }
}

/* Helpers de alineación responsivos */
.lg\:text-right {
  text-align: left;
}
@media (min-width: 1024px) {
  .lg\:text-right {
    text-align: right;
  }
}
@media (max-width: 768px) {
  .lg\:grid-cols-mayoreo-hero > div:first-child {
    text-align: center;
  }
  .lg\:grid-cols-mayoreo-hero div[style*="display:flex"] {
    justify-content: center;
  }
}
