/*
Theme Name: CRETA
Description: Portada editorial de CRETA con contenido editable y narrativa de scroll.
Version: 1.0.0
Text Domain: creta
*/

:root{--ink:#25251f;--paper:#f2efe7;--line:#d3cec2;--muted:#6d6b62;--olive:#616450}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}::selection{background:#b2a184;color:#1a1b16}.serif{font-family:Italiana,Georgia,serif;font-weight:400}header{position:absolute;z-index:20;top:0;left:0;right:0;height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 4.2vw;color:white;border-bottom:1px solid #ffffff50}.brand{font:2.2rem Italiana,Georgia,serif;letter-spacing:.17em}.nav{display:flex;gap:2.5rem;align-items:center}.nav a,.top-action{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}.nav a{transition:opacity .3s}.nav a:hover{opacity:.55}.top-action{border:1px solid #ffffffa0;padding:1rem 1.25rem}.menu-toggle{display:none;background:none;border:0;color:white;font-size:1.8rem}.hero{height:min(900px,100svh);min-height:650px;position:relative;overflow:hidden;background:#7b7569;color:white}.hero-image{position:absolute;inset:-6% -3%;background-image:linear-gradient(90deg,rgba(19,21,18,.44),transparent 73%),var(--creta-image-1,url('assets/concept-1.png'));background-position:center;background-size:cover;transform:scale(1.06);animation:heroEnter 2.7s cubic-bezier(.19,1,.22,1) both;will-change:transform}.hero:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(12,16,17,.35),transparent 32%)}.hero-content{z-index:2;position:absolute;top:50%;left:8.2vw;transform:translateY(-40%);max-width:750px}.eyebrow{font-size:.67rem;letter-spacing:.31em;text-transform:uppercase;font-weight:600}.hero .eyebrow{display:block;margin-bottom:1.7rem;animation:rise 1s .3s both}.hero h1{font:clamp(4.3rem,8.5vw,9.5rem)/.87 Italiana,Georgia,serif;letter-spacing:-.035em;margin:0;animation:rise 1.3s .48s both}.hero h1 span{display:block}.hero p{font-size:1rem;line-height:1.7;max-width:400px;margin:2rem 0 2.4rem;animation:rise 1s .8s both}.hero-links{display:flex;gap:1rem;align-items:center;animation:rise 1s 1s both}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:2.4rem;padding:1.13rem 1.4rem;border:1px solid currentColor;font-size:.69rem;letter-spacing:.13em;text-transform:uppercase;min-height:52px;transition:background .3s,color .3s,transform .3s}.button:hover{background:var(--ink);color:white;transform:translateY(-3px)}.hero .button:hover{background:white;color:var(--ink)}.button.solid{background:var(--ink);color:white;border-color:var(--ink)}.button.solid:hover{background:transparent;color:var(--ink)}.hero-bottom{position:absolute;z-index:3;bottom:38px;left:4.2vw;right:4.2vw;display:flex;justify-content:space-between;align-items:center;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase}.scroll-mark{display:flex;align-items:center;gap:1.2rem}.scroll-mark i{display:block;width:1px;height:42px;background:white;animation:linePulse 2s infinite}.section{padding:clamp(6rem,11vw,11rem) 8.2vw}.intro{display:grid;grid-template-columns:1fr 1.2fr;gap:10vw;min-height:600px;align-items:center}.intro-label{align-self:start;color:var(--olive)}.intro h2{font:clamp(3.5rem,6.6vw,7rem)/.99 Italiana,Georgia,serif;margin:0}.intro p{max-width:520px;line-height:1.85;color:#66675f;margin:2.3rem 0 0}.rule{height:1px;background:var(--line);margin-top:3rem}.image-break{height:65vh;min-height:420px;position:relative;overflow:hidden;background:#b8ae9e}.image-break .break-image{position:absolute;inset:-12% 0;background-image:linear-gradient(90deg,rgba(25,28,24,.22),transparent),var(--creta-image-1,url('assets/concept-1.png'));background-size:cover;background-position:center 61%;transform:scale(1.14);filter:saturate(.66)}.image-break p{position:absolute;bottom:6vw;left:8vw;margin:0;color:white;font:clamp(3rem,6vw,6rem)/1 Italiana,Georgia,serif}.collection-header{display:flex;justify-content:space-between;gap:3rem;align-items:end;margin-bottom:4rem}.collection-header h2,.roles h2{font:clamp(3.4rem,6vw,6rem)/1 Italiana,Georgia,serif;margin:1rem 0 0}.collection-header p{max-width:330px;line-height:1.7;color:var(--muted)}.products{display:grid;grid-template-columns:repeat(4,1fr);gap:1.3rem}.product{min-width:0}.swatch{height:clamp(270px,30vw,420px);position:relative;overflow:hidden;background:#d2c6b4;transition:filter .5s}.product:hover .swatch{filter:brightness(1.08)}.swatch:before{content:'';position:absolute;inset:0;transition:transform .8s cubic-bezier(.2,.7,.2,1);background:radial-gradient(ellipse at 25% 25%,#ffffff7a,transparent 45%),repeating-linear-gradient(123deg,#ffffff15 0px,#ffffff15 2px,#0000000a 3px,#00000000 7px),linear-gradient(140deg,#d8cbb8,#aaa08c)}.product:hover .swatch:before{transform:scale(1.1)}.product:nth-child(2) .swatch:before{background:radial-gradient(ellipse at 20% 20%,#ffffff66,transparent 50%),repeating-linear-gradient(104deg,#17161225 0px,#17161225 2px,transparent 4px,transparent 11px),linear-gradient(135deg,#a99a86,#6f675a)}.product:nth-child(3) .swatch:before{background:radial-gradient(ellipse at 30% 10%,#ffffffa0,transparent 48%),repeating-linear-gradient(157deg,#ffffff23 0px,#ffffff23 3px,#988e7e12 5px,transparent 12px),linear-gradient(140deg,#ded6c9,#b7ad9e)}.product:nth-child(4) .swatch:before{background:radial-gradient(ellipse at 25% 12%,#ffffff80,transparent 50%),linear-gradient(125deg,#ccc1af,#928778)}.swatch-number{position:absolute;top:20px;left:20px;color:#fff;font-size:.7rem}.product h3{font:2rem Italiana,Georgia,serif;margin:1.2rem 0 .35rem}.product p{font-size:.81rem;line-height:1.5;color:var(--muted);margin:0}.roles{background:#22251f;color:#f4f0e6}.roles-head{display:flex;justify-content:space-between;gap:2rem;align-items:end;margin-bottom:4rem}.roles-head p{max-width:380px;line-height:1.7;color:#c0c1b9}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff4b}.role{padding:2rem 2rem 2.8rem 0;min-height:330px;border-right:1px solid #ffffff30;display:flex;flex-direction:column;justify-content:space-between;transition:padding-left .35s,background .35s}.role+ .role{padding-left:2rem}.role:last-child{border:0}.role:hover{padding-left:2.5rem;background:#ffffff0b}.role .num{font-size:.7rem;letter-spacing:.2em;color:#b9b6a8}.role h3{font:clamp(2rem,3vw,3.3rem) Italiana,Georgia,serif;margin:0 0 1rem}.role p{max-width:240px;line-height:1.6;font-size:.86rem;color:#c2c3bb}.role .arrow{font-size:1.6rem}.closing{text-align:center;background:#dad1c1;padding:clamp(7rem,12vw,13rem) 1.2rem}.closing h2{font:clamp(3.8rem,8vw,8rem)/.98 Italiana,Georgia,serif;margin:1rem 0 2rem}.closing p{line-height:1.7;margin:0 auto 2.5rem;max-width:460px}footer{display:flex;justify-content:space-between;gap:2rem;padding:3rem 4.2vw;background:#f2efe7;font-size:.75rem;color:#64655d}footer .brand{color:var(--ink);font-size:1.6rem}.reveal{opacity:0;transform:translateY(58px);transition:opacity 1.2s cubic-bezier(.2,.7,.2,1),transform 1.2s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}@keyframes heroEnter{from{opacity:.2;transform:scale(1.22)}to{opacity:1;transform:scale(1.06)}}@keyframes rise{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}@keyframes linePulse{50%{opacity:.25;transform:translateY(8px)}}
@media(max-width:900px){header{padding:0 5vw}.nav{display:none;position:absolute;top:94px;left:0;right:0;padding:2rem 5vw;background:#292b25;flex-direction:column;align-items:start}.nav.open{display:flex}.menu-toggle{display:block}.top-action{display:none}.hero-content{left:7vw}.intro{grid-template-columns:1fr;gap:2rem;min-height:0}.intro-label{align-self:auto}.products{grid-template-columns:repeat(2,1fr)}.roles-head{display:block}.role-grid{grid-template-columns:1fr}.role,.role+.role{min-height:240px;padding:1.6rem 0;border-right:0;border-bottom:1px solid #ffffff30}.role:hover{padding-left:1rem}}@media(max-width:600px){header{height:76px}.nav{top:76px}.hero{min-height:660px;height:100svh}.hero-image{background-position:58% center;background-image:linear-gradient(90deg,#1a1b17a6,#1a1b1740),var(--creta-image-1,url('assets/concept-1.png'))}.hero-content{left:7vw;right:7vw;top:51%;transform:translateY(-38%)}.hero h1{font-size:clamp(4.3rem,16vw,7rem)}.hero p{font-size:.92rem}.hero-links{flex-wrap:wrap}.hero-bottom{left:7vw;right:7vw}.section{padding:6rem 7vw}.intro h2{font-size:3.7rem}.image-break{height:50vh}.image-break p{left:7vw}.collection-header{display:block;margin-bottom:2rem}.products{gap:1.5rem .9rem}.swatch{height:240px}.product h3{font-size:1.6rem}.roles h2{font-size:3.6rem}.closing h2{font-size:4.3rem}footer{display:block;padding:3rem 7vw}footer>*{display:block;margin-bottom:1.2rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}

/* Scroll-driven architectural reveal */
.story{height:360vh;position:relative;background:#181a17;color:#fff}
.story-stage{height:100svh;position:sticky;top:0;overflow:hidden;isolation:isolate}
.story-photo{position:absolute;inset:-6%;background-size:cover;background-position:center;will-change:transform,opacity;backface-visibility:hidden}
.story-space{background-image:linear-gradient(90deg,#11171445,transparent 70%),var(--creta-image-1,url('assets/concept-1.png'));transform:scale(1)}
.story-material{background-image:var(--creta-image-2,url('assets/concept-2.png'));opacity:0;transform:scale(1.22)}
.story-shade{position:absolute;inset:0;background:linear-gradient(0deg,#12141199,transparent 65%);pointer-events:none}
.story-text{position:absolute;z-index:2;left:8vw;bottom:11vh;max-width:750px;transform:translateY(30px);opacity:0;will-change:opacity,transform}
.story-text:first-of-type{opacity:1;transform:none}
.story-text h2{font:clamp(4rem,9vw,9rem)/.93 Italiana,Georgia,serif;margin:1rem 0}
.story-text p{max-width:440px;line-height:1.7;font-size:1.05rem}
.story-progress{position:absolute;z-index:3;right:4.2vw;top:50%;width:1px;height:28vh;background:#ffffff66;transform:translateY(-50%)}
.story-progress span{display:block;width:2px;height:0;background:white}
.story-step{position:absolute;z-index:3;right:3vw;bottom:6vh;font-size:.7rem;letter-spacing:.2em}
@media(max-width:600px){.story{height:300vh}.story-photo{background-position:57% center}.story-text{left:7vw;right:7vw;bottom:13vh}.story-text h2{font-size:clamp(3.7rem,14vw,6rem)}.story-text p{font-size:.9rem}.story-progress{right:5vw}}
@media(prefers-reduced-motion:reduce){.story{height:auto}.story-stage{position:relative;height:82svh;min-height:600px}.story-space{opacity:0!important}.story-material{opacity:1!important;transform:none!important}.story-text{display:none}.story-text.story-copy-final{display:block;opacity:1!important;transform:none!important}}

/* WordPress and editorial refinements */
.admin-bar header{top:32px}.skip-link{position:fixed;top:-100px;left:20px;z-index:10000;padding:14px 20px;background:#fff;color:#25251f}.skip-link:focus{top:40px}a:focus-visible,button:focus-visible{outline:2px solid #b59171;outline-offset:6px}.intro-brand{align-self:start}.creta-brand-image{display:block;width:100%;height:auto;margin-top:45px;mix-blend-mode:multiply}.complements{background:#e8e3d9}.complements-heading{display:flex;justify-content:space-between;gap:50px;align-items:end;margin:35px 0 65px}.complements-heading h2{font:clamp(3rem,5.5vw,6rem)/1 Italiana,Georgia,serif;margin:0}.complements-heading p{max-width:310px;font-size:16px;line-height:1.8;color:var(--muted)}.complements-list{display:grid;grid-template-columns:1fr 1fr;gap:0 60px}.complements-list>div{border-top:1px solid #bbb5a8;padding:20px 0;display:flex;align-items:center;gap:25px}.complements-list h3{font:26px Italiana,Georgia,serif;margin:0}.complement-index{font-size:11px;color:#777363}.reveal{opacity:1;transform:none}.motion-ready .reveal{opacity:0;transform:translateY(30px)}.motion-ready .reveal.visible{opacity:1;transform:none}.story-text:first-of-type{opacity:0}.story-copy-one{opacity:1;transform:none}.story-stage{isolation:isolate}.product p{font-size:15px}.eyebrow,.nav a,.top-action{font-size:12px}.nav a{letter-spacing:.12em}.story-text h2{font-size:clamp(3.8rem,8vw,8.5rem)}
@media(max-width:780px){.complements-heading{display:block}.complements-list{gap:0 25px}.complements-list h3{font-size:23px}.creta-brand-image{max-width:420px;margin:20px 0 0}.hero h1{font-size:clamp(3.8rem,12vw,6rem)}.hero-content{max-width:84vw}.admin-bar header{top:46px}.hero-links{flex-wrap:wrap}.hero .eyebrow{font-size:10px}.hero{min-height:760px}.story{height:300svh}.complements-heading p{margin-top:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-ready .reveal{opacity:1;transform:none}.hero-image,.break-image{transform:none!important}}
.product-link{display:block}.product-link .product-discover{display:block;font-size:12px;margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}

.footer-navigation{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;padding:65px 8.2vw;background:var(--paper);border-top:1px solid var(--line)}.footer-navigation .eyebrow{display:block;margin-bottom:24px;color:var(--muted)}.footer-navigation a{display:block;width:fit-content;font-size:15px;padding:10px 0;min-height:44px;text-underline-offset:5px}.footer-navigation a:hover{text-decoration:underline}.nav{gap:clamp(16px,2vw,32px)}@media(min-width:901px) and (max-width:1100px){.top-action{display:none}}@media(max-width:600px){.footer-navigation{grid-template-columns:1fr 1fr;gap:35px 20px;padding:45px 7vw}.footer-navigation>div:last-child{grid-column:1/-1}.footer-navigation .eyebrow{font-size:10px;letter-spacing:.16em;margin-bottom:12px}}

.footer-legal{grid-column:1/-1;display:flex;gap:25px;border-top:1px solid var(--line);padding-top:20px;flex-wrap:wrap}.footer-legal a{font-size:13px}.legal-header{position:relative;color:var(--ink);border-color:var(--line)}.legal-header>a:last-child{font-size:13px}.legal-content{max-width:960px;margin:auto;padding:75px 7vw 100px}.legal-content h1{font:clamp(42px,6vw,76px)/1.08 Italiana,Georgia,serif;margin:25px 0 40px}.legal-copy{font-size:16px;line-height:1.85}.legal-copy h2{font:32px/1.2 Italiana,Georgia,serif;margin:42px 0 18px}.legal-copy a{text-decoration:underline;overflow-wrap:anywhere}.legal-copy ul{padding-left:22px}.legal-draft{padding:22px;background:#e4dccb;border-left:3px solid #8a7252;font-size:14px}.legal-page .legal-header{gap:20px}

.complement-entry{border-top:1px solid #bbb5a8}.complement-entry summary{display:flex;align-items:center;gap:25px;padding:24px 0;cursor:pointer;list-style:none}.complement-entry summary::-webkit-details-marker{display:none}.complement-entry summary:focus-visible{outline:2px solid var(--olive);outline-offset:4px}.complement-entry h3{font:clamp(25px,3vw,36px) Italiana,Georgia,serif;margin:0;flex:1}.complement-plus{font-size:26px;font-weight:400;transition:transform .3s}.complement-entry[open] .complement-plus{transform:rotate(45deg)}.complement-description{max-width:780px;padding:0 0 26px 48px;line-height:1.8;color:var(--muted)}.complement-description .eyebrow{color:var(--ink);line-height:1.6}.complement-description p{margin:0 0 18px}@media(max-width:600px){.complement-description{padding-left:0}.complement-entry summary{gap:15px}}

.story-space{background-image:linear-gradient(90deg,#11171445,transparent 70%),var(--creta-image-3,var(--creta-image-1))}.image-break .break-image{background-image:linear-gradient(90deg,rgba(25,28,24,.3),transparent),var(--creta-image-4,var(--creta-image-1))}

/* Scroll performance: composite transforms, no animated layout or filters. */
.story-progress span{height:100%;transform:scaleY(0);transform-origin:top}.story-space{filter:none}.story-stage{contain:paint}.story-text{will-change:auto}.hero-image{animation-fill-mode:backwards}@media(max-width:600px){.story-photo{inset:-3%}}
