:root{--paper:var(--pio-colors-paper);--ink:var(--pio-colors-ink);--muted:var(--pio-colors-muted);--green:var(--pio-colors-accent);--green-dark:var(--pio-colors-accent-dark);--sage:var(--pio-colors-sage);--line:var(--pio-colors-line);--heading:var(--pio-fonts-heading)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--pio-space-90)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--pio-fonts-body);font-size:var(--pio-text-16);line-height:var(--pio-leading-1-6)}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer}
img{display:block;width:100%;object-fit:cover}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible{outline:var(--pio-stroke-3) solid var(--pio-colors-accent);outline-offset:var(--pio-stroke-5)}
.header{height:108px;display:flex;align-items:center;justify-content:space-between;padding:0 6.5%;gap:var(--pio-space-28);background:var(--ink);color:var(--paper)}
.brand{display:flex;align-items:center;flex:none}
.brand-logo{width:82px;height:82px;object-fit:contain}
.header nav{display:flex;gap:var(--pio-space-26);font-size:var(--pio-text-16)}
.header nav a{padding:var(--pio-space-8) 0}
.header nav a:hover,.header nav .active{border-bottom:var(--pio-stroke-2) solid var(--green);color:var(--green)}
.button{display:inline-flex;align-items:center;justify-content:space-between;gap:var(--pio-space-30);background:var(--ink);border:0;color:var(--pio-colors-surface);padding:var(--pio-space-15) var(--pio-space-23);border-radius:var(--pio-radius-999);font-size:var(--pio-text-16);line-height:var(--pio-leading-1-25);min-height:50px;font-weight:var(--pio-weights-bold);transition:background .2s,transform .2s}
.button:hover{background:var(--pio-colors-tone-364238);transform:translateY(-2px)}
.button span{font-size:var(--pio-text-20)}
.accent{background:var(--green);color:var(--pio-colors-ink)}
.accent:hover{background:var(--pio-colors-tone-94e154)}
.header-cta{background:var(--green);color:var(--ink)}
.header-cta:hover{background:var(--pio-colors-tone-94e154)}
.menu{display:none}
.hero{min-height:650px;position:relative;color:var(--pio-colors-surface);background:linear-gradient(90deg,var(--pio-colors-variant-67),var(--pio-colors-variant-68) 55%,var(--pio-colors-variant-69)),var(--pio-hero-image,none) center 55%/cover}
.hero:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:24px;background:var(--paper);clip-path:polygon(0 55%,3% 70%,6% 44%,10% 62%,14% 33%,18% 60%,22% 45%,27% 70%,32% 48%,36% 62%,40% 28%,44% 55%,48% 42%,52% 60%,57% 36%,62% 59%,67% 40%,72% 66%,77% 44%,82% 62%,87% 35%,92% 60%,97% 42%,100% 55%,100% 100%,0 100%)}
.hero-content{max-width:1400px;margin:auto;padding:var(--pio-space-65) 6.5% var(--pio-space-35)}
.eyebrow{font-size:var(--pio-text-12);font-weight:var(--pio-weights-semibold);letter-spacing:2.4px;margin:0 0 var(--pio-space-22);color:var(--pio-colors-tone-52654b)}
.eyebrow.light{color:var(--pio-colors-sage)}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{font-family:var(--pio-fonts-heading);font-weight:var(--pio-weights-regular);line-height:var(--pio-leading-1-06);letter-spacing:-.5px}
h1{line-height:var(--pio-leading-1); font-size:clamp(var(--pio-text-48),5.4vw,var(--pio-text-78));margin-bottom:var(--pio-space-23);max-width:760px}
em{font-style:normal;font-weight:var(--pio-weights-regular);color:var(--green-dark)}
h1 em{color:var(--pio-colors-accent)}
.hero-copy{color:var(--pio-colors-tone-e4e8de);font-size:var(--pio-text-17);line-height:var(--pio-leading-1-55);margin-bottom:var(--pio-space-26)}
.hero-bottom{display:flex;align-items:center;gap:var(--pio-space-25);margin-top:var(--pio-space-32);font-size:var(--pio-text-12);letter-spacing:1.5px}
.hero-bottom a{display:grid;place-items:center;width:36px;height:36px;border:var(--pio-stroke-1) solid var(--pio-colors-tone-ffffff70);border-radius:50%;font-size:var(--pio-text-19)}
.ribbon{display:flex;align-items:center;justify-content:center;gap:var(--pio-space-45);padding:var(--pio-space-30) 6%;border-bottom:var(--pio-stroke-1) solid var(--line);font-size:var(--pio-text-14);color:var(--pio-colors-tone-52604d)}
.ribbon i{font-style:normal;font-size:var(--pio-text-20);color:var(--pio-colors-tone-487237)}
.section{padding:var(--pio-space-85) 6.5%;max-width:1600px;margin:auto}
h2{font-size:clamp(var(--pio-text-32),3.1vw,var(--pio-text-46));margin-bottom:var(--pio-space-25)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:var(--pio-space-40)}
.section-heading>p{font-size:var(--pio-text-16);color:var(--muted);margin-bottom:var(--pio-space-30)}
.filters{display:flex;gap:var(--pio-space-10);flex-wrap:wrap;margin:var(--pio-space-24) 0 var(--pio-space-32)}
.filters button{border:var(--pio-stroke-1) solid var(--pio-colors-tone-c7cfc0);background:transparent;padding:var(--pio-space-9) var(--pio-space-18);border-radius:var(--pio-radius-30);font-size:var(--pio-text-14)}
.filters button.selected{background:var(--ink);border-color:var(--ink);color:var(--pio-colors-surface)}
.filters span{margin-left:var(--pio-space-9);font-size:var(--pio-text-12);color:var(--pio-colors-sage)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--pio-space-26)}
.tour[hidden]{display:none}
.image-button{position:relative;display:block;padding:0;border:0;width:100%;background:var(--pio-colors-tone-dddddd);border-radius:var(--pio-radius-17);overflow:hidden;text-align:left}
.image-button img{height:250px;transition:transform .5s}
.image-button:hover img{transform:scale(1.045)}
.tour:nth-child(2) img{object-position:70% center}
.tour:nth-child(3) img{object-position:70% center}
.pill{position:absolute;top:16px;left:16px;background:var(--pio-colors-tone-f3f4eef2);border-radius:var(--pio-radius-20);padding:var(--pio-space-6) var(--pio-space-11);font-size:var(--pio-text-12);letter-spacing:1px}
.image-arrow{position:absolute;right:15px;bottom:15px;border:var(--pio-stroke-1) solid var(--pio-colors-tone-ffffff99);border-radius:50%;color:var(--pio-colors-surface);width:34px;height:34px;display:grid;place-items:center;font-size:var(--pio-text-20)}
.tour-meta{display:flex;justify-content:space-between;gap:var(--pio-space-10);margin:var(--pio-space-21) 0 var(--pio-space-10);font-size:var(--pio-text-12);letter-spacing:1px;color:var(--pio-colors-muted)}
.tour-meta span{letter-spacing:0}
.tour h3{font-size:var(--pio-text-25);margin-bottom:var(--pio-space-10)}
.tour p{color:var(--muted);font-size:var(--pio-text-16)}
.text-button{background:none;border:0;border-bottom:var(--pio-stroke-1) solid var(--pio-colors-tone-cdd5c6);padding:var(--pio-space-10) 0;display:flex;justify-content:space-between;align-items:center;gap:var(--pio-space-25);font-size:var(--pio-text-16);min-height:48px;width:100%;text-align:left}
.text-button span{font-size:var(--pio-text-20)}
.text-button:hover{color:var(--pio-colors-accent-dark)}
.essence{background:var(--pio-colors-tone-e4e9dc);max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:9%;padding-top:var(--pio-space-88);padding-bottom:var(--pio-space-90);position:relative}
.collage{position:relative;padding:var(--pio-space-20) 0 var(--pio-space-45) var(--pio-space-20);min-width:0}
.collage-main{height:330px;border:var(--pio-stroke-8) solid var(--pio-colors-paper);transform:rotate(-3deg);object-position:70% center;box-shadow:var(--pio-shadow-variant-8)}
.collage-small{position:absolute;bottom:5px;left:55%;width:47%;height:200px;border:var(--pio-stroke-8) solid var(--pio-colors-paper);transform:rotate(7deg);box-shadow:var(--pio-shadow-variant-9)}
.stamp{position:absolute;top:-14px;right:-25px;border:var(--pio-stroke-1) solid var(--pio-colors-tone-617056);border-radius:50%;width:124px;height:124px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:var(--pio-text-12);line-height:var(--pio-leading-1-2);letter-spacing:1px;transform:rotate(15deg);background:var(--pio-colors-tone-d3dcc8f0)}
.stamp b{font-size:var(--pio-text-24)}
.handwritten{position:absolute;bottom:0;left:5%;font:var(--pio-weights-regular) var(--pio-text-23) var(--heading);color:var(--pio-colors-accent-dark);transform:rotate(-5deg)}
.essence-copy{align-self:center;max-width:420px}
.essence-copy>p:not(.eyebrow){font-size:var(--pio-text-16);color:var(--pio-colors-muted)}
.essence-copy .text-button{max-width:340px;margin-top:var(--pio-space-20)}
.steps{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--pio-space-22);align-items:center}
.steps-intro h2{font-size:var(--pio-text-37);margin:0}
.steps-intro .eyebrow{font-size:var(--pio-text-12)}
.steps article{padding:var(--pio-space-26) var(--pio-space-22);background:var(--pio-colors-tone-e6ebdf);border-radius:var(--pio-radius-15);min-height:195px}
.step-number{font:var(--pio-text-25) var(--heading);display:flex;justify-content:space-between;margin-bottom:var(--pio-space-28)}
.step-number i{font-style:normal;color:var(--pio-colors-accent-dark)}
.steps h3{font-size:var(--pio-text-24);letter-spacing:-.4px;margin-bottom:var(--pio-space-10)}
.steps p{font-size:var(--pio-text-16);color:var(--muted);margin-bottom:0}
.contact{max-width:none;background:linear-gradient(90deg,var(--pio-colors-tone-222923f5),var(--pio-colors-tone-222923d9) 55%,var(--pio-colors-tone-22292355)),none center/cover;color:var(--pio-colors-surface);display:flex;align-items:center;justify-content:space-between;overflow:hidden}
.contact h2{font-size:clamp(var(--pio-text-36),3.7vw,var(--pio-text-54))}
.contact em{color:var(--pio-colors-accent)}
.contact p:not(.eyebrow){color:var(--pio-colors-tone-e4e8de);font-size:var(--pio-text-16)}
.contact .button{margin-top:var(--pio-space-15)}
.contact-mark{font-size:var(--pio-text-220);margin-right:9%;color:var(--pio-colors-tone-78d5338c);line-height:var(--pio-leading-1)}
.footer{background:var(--ink);color:var(--paper);padding:var(--pio-space-45) 6.5% var(--pio-space-25);display:flex;align-items:center;flex-wrap:wrap;gap:var(--pio-space-35)}
.footer .brand-logo{width:100px;height:100px}
.footer p{font-size:var(--pio-text-14);color:var(--sage);margin:0}
.footer>a:last-of-type{margin-left:auto;font-size:var(--pio-text-14)}
.footer small{width:100%;padding-top:var(--pio-space-22);border-top:var(--pio-stroke-1) solid var(--pio-colors-tone-55604f);font-size:var(--pio-text-14);color:var(--sage)}
dialog{border:0;border-radius:var(--pio-radius-18);background:var(--paper);color:var(--ink);padding:0;width:min(570px,90vw);max-height:90vh;overflow:auto}
dialog::backdrop{background:var(--pio-colors-tone-101a13ad);backdrop-filter:blur(4px)}
dialog>img{height:225px}
.dialog-body{padding:var(--pio-space-30)}
dialog h2{font-size:var(--pio-text-32)}
.close{position:absolute;right:15px;top:15px;border:0;border-radius:50%;width:35px;height:35px;background:var(--paper);font-size:var(--pio-text-25)}
.skip,.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.skip:focus{width:auto;height:auto;clip-path:none;top:10px;left:10px;z-index:10;background:var(--pio-colors-surface);padding:var(--pio-space-10)}

@media(min-width:1600px){.hero-content{padding-left:0;padding-right:0}}
@media(max-width:1050px){.header{padding:0 5%;gap:var(--pio-space-15)}
.header nav{gap:var(--pio-space-20)}
.header-cta{padding:var(--pio-space-13) var(--pio-space-18);font-size:var(--pio-text-15)}
.section{padding:var(--pio-space-65) 5%}
.image-button img{height:210px}
.tour h3{font-size:var(--pio-text-25)}
.tour-meta{display:block}
.tour-meta span{display:block;margin-top:var(--pio-space-4)}
.steps{grid-template-columns:repeat(3,1fr)}
.steps-intro{grid-column:1/-1}
.steps-intro h2 br{display:none}
.collage-small{left:45%;width:60%}
.ribbon{gap:var(--pio-space-25);font-size:var(--pio-text-12)}
.contact-mark{margin-right:0}}

@media(max-width:700px){html{scroll-padding-top:var(--pio-space-20)}
.header{height:88px;position:relative}
.brand-logo{width:72px;height:72px}
.header-cta{margin-left:auto;padding:var(--pio-space-12) var(--pio-space-16);font-size:var(--pio-text-14);gap:var(--pio-space-12)}
.menu{display:block;background:none;border:var(--pio-stroke-1) solid var(--line);border-radius:var(--pio-radius-5);font-size:var(--pio-text-20);line-height:var(--pio-leading-1);padding:var(--pio-space-10)}
.header nav{display:none;position:absolute;top:88px;left:0;right:0;z-index:5;background:var(--ink);padding:var(--pio-space-20) 6%;box-shadow:var(--pio-shadow-variant-10)}
.header nav.open{display:flex;flex-direction:column;gap:var(--pio-space-8)}
.header nav a{width:fit-content}
.hero{min-height:650px;background-position:65% center}
.hero-content{padding:var(--pio-space-55) 6% var(--pio-space-50);background:linear-gradient(90deg,var(--pio-colors-tone-17201980),transparent)}
h1{font-size:clamp(var(--pio-text-38),9.3vw,var(--pio-text-58))}
.hero-copy{font-size:var(--pio-text-16)}
.hero-bottom{margin-top:var(--pio-space-32);font-size:var(--pio-text-12);letter-spacing:1px}
.eyebrow{font-size:var(--pio-text-12);letter-spacing:1.8px}
.ribbon{display:grid;grid-template-columns:1fr 1fr;text-align:center;gap:var(--pio-space-8);padding:var(--pio-space-24) 5%}
.ribbon i{display:none}
.section{padding:var(--pio-space-55) 6%}
.section-heading{display:block}
.section-heading>p{margin-bottom:var(--pio-space-15)}
h2{font-size:clamp(var(--pio-text-29),7.8vw,var(--pio-text-38))}
.filters{gap:var(--pio-space-8);margin-top:var(--pio-space-20)}
.filters button{font-size:var(--pio-text-12);padding:var(--pio-space-8) var(--pio-space-12)}
.cards{grid-template-columns:1fr;gap:var(--pio-space-35)}
.image-button img{height:265px}
.tour-meta{display:flex;font-size:var(--pio-text-12)}
.tour-meta span{margin:0}
.tour h3{font-size:var(--pio-text-28)}
.tour p{font-size:var(--pio-text-16)}
.essence{grid-template-columns:1fr;gap:var(--pio-space-50)}
.collage{padding-left:0;padding-right:var(--pio-space-25)}
.collage-main{height:290px}
.collage-small{left:48%;width:50%;height:170px}
.stamp{right:0}
.handwritten{font-size:var(--pio-text-20)}
.essence-copy{max-width:none}
.steps{grid-template-columns:1fr;gap:var(--pio-space-15)}
.steps-intro{margin-bottom:var(--pio-space-15)}
.steps-intro h2{font-size:var(--pio-text-32)}
.steps article{min-height:0;padding:var(--pio-space-22)}
.step-number{margin-bottom:var(--pio-space-12)}
.steps p{font-size:var(--pio-text-16)}
.contact{position:relative}
.contact h2{font-size:clamp(var(--pio-text-30),8vw,var(--pio-text-40))}
.contact-mark{position:absolute;right:-35px;bottom:-50px;font-size:var(--pio-text-160);opacity:.25;pointer-events:none}
.contact>div{position:relative;z-index:1}
.footer{gap:var(--pio-space-24);padding:var(--pio-space-35) 6% var(--pio-space-20)}
.footer p{font-size:var(--pio-text-12)}
.footer>a:last-of-type{margin:0}
.dialog-body{padding:var(--pio-space-25)}
dialog h2{font-size:var(--pio-text-29)}}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{transition:none!important}}


/* Logo blanco sobre carbón y verde con contraste en las acciones. */
.header .menu{color:var(--paper);border-color:var(--pio-colors-tone-66715f)}
.button:focus-visible,.header a:focus-visible,.footer a:focus-visible{outline-color:var(--green)}
.steps-intro,.essence-copy,.contact>div{min-width:0}
.brand-logo{object-position:center}
.footer>a:last-of-type:hover{color:var(--green)}

@media(max-width:380px){.header-cta{gap:var(--pio-space-8);font-size:var(--pio-text-14);padding:var(--pio-space-10) var(--pio-space-12)}
.header{gap:var(--pio-space-10)}
.hero .button{gap:var(--pio-space-14);padding:var(--pio-space-14) var(--pio-space-18)}
.section-heading h2 br{display:none}
.tour-meta{flex-wrap:wrap}
.steps-intro h2{font-size:var(--pio-text-29)}}


/* Tipografía legible en controles y pantallas pequeñas. */
.filters button{font-size:var(--pio-text-14);min-height:44px;line-height:var(--pio-leading-1-3)}
.filters span{color:inherit}
.footer p,.footer>a:last-of-type{font-size:var(--pio-text-14)}
.hero .button{max-width:100%;text-align:left}
.button span{flex-shrink:0}
.eyebrow{line-height:var(--pio-leading-1-4)}
.stamp{letter-spacing:.6px}
.hero-content{padding-bottom:var(--pio-space-45)}

@media(min-width:701px) and (max-width:960px){.header{height:96px;position:relative;gap:var(--pio-space-20)}
.header .brand-logo{width:76px;height:76px}
.header-cta{margin-left:auto;font-size:var(--pio-text-15)}
.header .menu{display:block;background:none;border:var(--pio-stroke-1) solid var(--pio-colors-tone-66715f);border-radius:var(--pio-radius-5);font-size:var(--pio-text-22);line-height:var(--pio-leading-1);padding:var(--pio-space-10)}
.header nav{display:none;position:absolute;top:96px;left:0;right:0;z-index:5;background:var(--ink);padding:var(--pio-space-20) 6%}
.header nav.open{display:flex;flex-direction:column;gap:var(--pio-space-8)}
.header nav a{width:fit-content;font-size:var(--pio-text-16)}}

@media(max-width:700px){.header nav a{font-size:var(--pio-text-16)}
.hero h1{line-height:var(--pio-leading-1-02)}
.hero-copy{line-height:var(--pio-leading-1-55)}
.hero-bottom{letter-spacing:.8px}
.ribbon{font-size:var(--pio-text-14);gap:var(--pio-space-12)}
.tour-meta{gap:var(--pio-space-4) var(--pio-space-12);flex-wrap:wrap}
.footer p{font-size:var(--pio-text-14)}
.hero-content{padding-top:var(--pio-space-42)}}

@media(max-width:380px){.brand-logo{width:64px;height:64px}
.header{padding-left:5%;padding-right:5%;gap:var(--pio-space-8)}
.menu{padding:var(--pio-space-10)}
.hero .button{font-size:var(--pio-text-15);gap:var(--pio-space-10)}
.eyebrow{letter-spacing:1.2px}
.hero-bottom{font-size:var(--pio-text-12);gap:var(--pio-space-12)}}

/* Integración nativa WordPress y WooCommerce. */
.brand .custom-logo{width:82px;height:82px;object-fit:contain}.brand .custom-logo-link{display:block}.footer .brand .custom-logo{width:100px;height:100px}
.header nav>.pio-nav-list{display:flex;gap:var(--pio-space-26);list-style:none;padding:0;margin:0}.pio-nav-list>li{position:relative}.pio-nav-list .sub-menu{display:none;position:absolute;z-index:8;min-width:220px;list-style:none;padding:var(--pio-space-16);background:var(--ink);margin:0}.pio-nav-list li:hover>.sub-menu,.pio-nav-list li:focus-within>.sub-menu{display:block}.pio-nav-list .sub-menu a{display:block}.pio-nav-list .current-menu-item>a{color:var(--green)}.pio-product-price{font-size:var(--pio-text-18);font-weight:var(--pio-weights-bold)}.pio-product-price del{font-size:var(--pio-text-15);color:var(--muted)}.pio-commerce{max-width:1400px}.pio-content{min-height:50vh}.pio-content article+article{margin-top:var(--pio-space-40)}.pio-content h1{font-size:clamp(var(--pio-text-36),4vw,var(--pio-text-62))}.pio-content img{height:auto}.pio-commerce ul.products li.product a img{height:auto}
@media(max-width:960px){.header nav>.pio-nav-list{flex-direction:column;gap:var(--pio-space-12)}.pio-nav-list .sub-menu{display:block;position:static;padding:var(--pio-space-8) var(--pio-space-16)}.brand .custom-logo{width:72px;height:72px}}
