@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Jost:wght@300;400;500;600&display=swap');:root{--leather-darkest:#1b0f08;--leather-deep:#251509;--leather:#3a2414;--leather-cognac:#5b3a21;--gold:#c9a24b;--gold-light:#e6c684;--gold-deep:#a07e33;--cream:#efe6d4;--sand:#c2af90;--line:rgba(201,162,75,.26);--maxw:1100px;}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--leather-deep);color:var(--cream);font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:19px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}.eyebrow{font-family:'Jost',sans-serif;font-weight:400;font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);margin-bottom:1.6rem;display:inline-block;}h2{font-weight:300;font-size:clamp(2.2rem,5vw,3.6rem);line-height:1.05;letter-spacing:.02em;color:var(--cream);margin-bottom:1.8rem;}.lead{font-size:clamp(1.05rem,1.7vw,1.3rem);color:var(--sand);font-style:italic;font-weight:300}p{margin-bottom:1.25rem;color:#d8cbb3}.rule{width:54px;height:1px;background:var(--gold);opacity:.7;margin:2.2rem 0}.rule.center{margin-left:auto;margin-right:auto}.btn{font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.3em;text-transform:uppercase;color:var(--cream);border:1px solid var(--line);padding:1.05em 2.4em;display:inline-block;transition:all .5s cubic-bezier(.2,.7,.2,1);position:relative;background:transparent;cursor:pointer;}.btn:hover{border-color:var(--gold);color:var(--gold-light);letter-spacing:.36em}nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;padding:1.5rem clamp(1.4rem,4vw,3.2rem);transition:background .6s ease, padding .6s ease, border-color .6s ease;border-bottom:1px solid transparent;}nav.scrolled{background:rgba(27,15,8,.92);backdrop-filter:blur(10px);padding-top:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line);}.brand{display:flex;align-items:center;gap:.85rem}.brand .mark{width:34px;height:auto}.brand .word{font-family:'Jost',sans-serif;font-weight:300;font-size:1.05rem;letter-spacing:.46em;color:var(--cream);padding-left:.1em;}.navlinks{display:flex;gap:2.4rem}.navlinks a{font-family:'Jost',sans-serif;font-weight:300;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--cream);opacity:.82;transition:color .35s,opacity .35s;position:relative;padding-bottom:.3rem;}.navlinks a:hover{color:var(--gold-light);opacity:1}.navlinks a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--gold);transition:width .4s ease}.navlinks a:hover::after{width:100%}.menu-toggle{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px}.menu-toggle span{display:block;width:24px;height:1px;background:var(--cream);transition:.3s}.hero{position:relative;height:100svh;min-height:600px;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden;}.hero-bg{position:absolute;inset:0;z-index:0}.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%;filter:blur(4px) brightness(1.12) contrast(1.1) sepia(.45) saturate(1.2);transform:scale(1.06)}@keyframes slowzoom{from{transform:scale(1.02)}to{transform:scale(1.12)}}.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(34,20,10,.34) 0%,rgba(34,20,10,.04) 30%,rgba(34,20,10,.10) 60%,rgba(34,20,10,.6) 100%),radial-gradient(115% 78% at 50% 42%,transparent 46%,rgba(34,20,10,.26) 100%)}.hero-inner{position:relative;z-index:2;max-width:760px;width:100%;min-height:100svh;padding:clamp(5.5rem,13vh,8.5rem) 1.5rem clamp(3rem,8vh,5rem);display:flex;flex-direction:column;justify-content:center;align-items:center}.hero .mark{width:clamp(62px,8vw,92px);margin:0 auto 1.8rem;filter:drop-shadow(0 2px 10px rgba(0,0,0,.4))}.hero h1{font-family:'Jost',sans-serif;font-weight:300;font-size:clamp(2rem,6.6vw,3.1rem);letter-spacing:.32em;line-height:1;text-indent:.32em;color:#f6f3ed;filter:drop-shadow(0 2px 8px rgba(0,0,0,.55))}.hero .tagline{font-style:italic;font-weight:300;font-size:clamp(1.15rem,2.4vw,1.7rem);color:var(--gold-light);margin-top:1.3rem;letter-spacing:.02em;}.hero .sub{font-family:'Jost',sans-serif;font-weight:300;font-style:italic;font-size:clamp(.74rem,1.2vw,.9rem);line-height:1.75;letter-spacing:.09em;color:var(--cream);position:absolute;left:50%;bottom:clamp(2.5rem,7vh,4.5rem);transform:translateX(-50%);width:90%;max-width:42ch;margin:0}.scrollcue{position:absolute;bottom:2.2rem;left:50%;transform:translateX(-50%);z-index:3;font-family:'Jost',sans-serif;font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--sand);display:flex;flex-direction:column;align-items:center;gap:.8rem;}.scrollcue .line{width:1px;height:46px;background:linear-gradient(var(--gold),transparent);animation:cue 2.2s ease-in-out infinite}@keyframes cue{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}section{position:relative}.wrap{max-width:var(--maxw);margin:0 auto;padding:clamp(5rem,11vw,9rem) clamp(1.4rem,5vw,3.2rem)}.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}.split.reverse .media{order:2}.media{position:relative}.media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;filter:saturate(.95) contrast(1.02)}.media .frame{display:none}.media .story-video{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block;background:var(--leather-darkest);filter:saturate(.96) contrast(1.02);border:1px solid var(--line);box-shadow:0 26px 64px -30px rgba(0,0,0,.75),0 0 0 6px rgba(201,162,75,.05);}.media.video-media{position:relative}.media.video-media::after{content:"";position:absolute;inset:-10px;pointer-events:none;border:1px solid var(--line);opacity:.5;}#processo .processo-layout{display:grid;grid-template-columns:minmax(260px,280px) minmax(0,590px);gap:clamp(2.5rem,5vw,4.5rem);align-items:center;max-width:980px;justify-content:center;margin:0 auto;}#processo .processo-copy{max-width:590px}#processo .processo-copy .eyebrow{margin-bottom:clamp(1.6rem,2.6vw,2.2rem)}#processo .processo-text{max-width:590px}#processo .processo-text p:last-child{margin-bottom:0}#processo .processo-video{width:min(100%,280px);margin:0 auto;justify-self:center;}#processo .processo-video .story-video{aspect-ratio:9/16;object-fit:cover;filter:grayscale(1) contrast(1.08) brightness(1.02);border:none;box-shadow:none;}#processo .processo-video::after{display:none}.media .cap{position:absolute;left:0;bottom:-2.4rem;font-family:'Jost',sans-serif;font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--sand);}#historia{background:var(--paper)}#logotipo{background-color:var(--leather-darkest);background-size:cover;background-position:center;text-align:center;}#logotipo .wrap{max-width:900px;padding-top:clamp(2rem,3.5vw,3rem);padding-bottom:clamp(2rem,3.5vw,3rem)}.logo-stage{margin:1.5rem auto 3.5rem;width:clamp(230px,36vw,380px)}.logo-stage svg{width:100%;height:auto;overflow:visible}.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);}.logo-stage.in svg .draw{transition:stroke-dashoffset 1.6s cubic-bezier(.4,0,.2,1);transition-delay:var(--d,0s);stroke-dashoffset:0;}.meaning{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin:3rem 0 2.5rem;text-align:left}.meaning .item .k{font-family:'Jost',sans-serif;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:.9rem;display:block}.meaning .item p{font-size:1rem;line-height:1.6;margin:0}.closing{font-style:italic;font-family:'Jost',sans-serif;color:var(--gold-light);font-weight:300;font-size:clamp(.6rem,1vw,.7rem);letter-spacing:.09em;line-height:1.7;max-width:560px;margin:1.4rem auto 0}#processo{background:var(--paper)}.encomenda{font-family:'Jost',sans-serif;font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-top:2.2rem;padding-top:1.6rem;border-top:1px solid var(--line);display:inline-block;}#criacoes{background-color:var(--leather-darkest);background-size:cover;text-align:center;}.brooch{max-width:480px;margin:2.5rem auto 0;position:relative}.brooch img{position:relative;z-index:1;width:100%;filter:drop-shadow(0 26px 46px rgba(0,0,0,.55))}.brooch .cap{position:relative;z-index:1;font-family:'Jost',sans-serif;font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;color:var(--sand);margin-top:2rem}.cats{display:flex;flex-wrap:wrap;justify-content:center;gap:0;margin:3.5rem auto 0}.cats a{font-family:'Jost',sans-serif;font-weight:300;font-size:.78rem;letter-spacing:.26em;text-transform:uppercase;color:var(--cream);padding:.65rem 1.5rem;transition:color .4s,letter-spacing .4s;position:relative}.cats a:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:13px;background:var(--line)}.cats a:last-child{border-right:none}.cats a:hover{color:var(--gold-light);letter-spacing:.3em}footer{background:var(--leather-darkest);text-align:center;border-top:1px solid var(--line)}footer .wrap{padding-top:clamp(4rem,8vw,6rem);padding-bottom:3rem}footer .mark{width:60px;margin:0 auto 1.6rem}footer .word{font-family:'Jost',sans-serif;font-weight:300;font-size:1.4rem;letter-spacing:.5em;color:var(--cream);padding-left:.3em}footer .tag{font-family:'Jost',sans-serif;font-size:.52rem;letter-spacing:.26em;text-transform:uppercase;color:var(--sand);opacity:.7;margin-top:1rem}footer .invite{font-style:italic;color:var(--sand);margin:2.4rem auto 1.6rem;max-width:440px}footer .contact{font-family:'Jost',sans-serif;font-size:.74rem;letter-spacing:.18em;color:#d8cbb3;display:flex;gap:2rem;justify-content:center;flex-wrap:wrap}footer .contact a:hover{color:var(--gold-light)}footer .legal{font-family:'Jost',sans-serif;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(194,175,144,.5);margin-top:3rem}.reveal{opacity:0;transform:translateY(26px);transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}.reveal.show{opacity:1;transform:none}@media(max-width:860px){.navlinks{position:fixed;inset:0;background:rgba(27,15,8,.98);flex-direction:column;align-items:center;justify-content:center;gap:2.4rem;transform:translateX(100%);transition:transform .5s ease;}.navlinks.open{transform:none}.navlinks a{font-size:1rem;letter-spacing:.3em}.menu-toggle{display:flex;z-index:70}.menu-toggle.open span:nth-child(1){transform:translateY(6px) rotate(45deg)}.menu-toggle.open span:nth-child(2){opacity:0}.menu-toggle.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}.split{grid-template-columns:1fr;gap:3rem}.split.reverse .media{order:0}.media img{aspect-ratio:4/3}#processo .processo-layout{grid-template-columns:1fr;gap:clamp(1.75rem,4.5vw,2.5rem)}#processo .processo-copy{order:1;margin:0 auto}#processo .processo-video{order:2;width:min(82vw,260px)}.meaning{grid-template-columns:1fr;gap:2rem}.cats a{flex:1 1 100%;border-right:none;border-bottom:1px solid var(--line)}.cats a:last-child{border-bottom:none}}@media(prefers-reduced-motion:reduce){*{animation:none!important}html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.hero-bg img{animation:none}.logo-stage.in svg .draw{transition:none;stroke-dashoffset:0}}.jewel-img{background:url('/assets/simbolo-joia.png') center/contain no-repeat}.peca-card{background:rgba(255,255,255,.03);border:1px solid var(--line);padding:1.2rem;display:flex;flex-direction:column;gap:.55rem;align-items:center;text-align:center}.peca-foto{width:100%;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:rgba(201,162,75,.06)}.peca-foto img{max-width:78%;max-height:78%;object-fit:contain}.peca-nome{font-family:'Jost',sans-serif;font-size:.82rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-light)}.peca-preco{font-size:1rem;font-style:italic;color:var(--sand)}.btn-comprar{font-family:'Jost',sans-serif;font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold);padding:.75rem 1.4rem;transition:all .3s}.btn-comprar:hover{background:var(--gold);color:var(--leather-darkest)}:root{--paper:#f7f3ec;--paper-2:#efe9de;--ink:#2c2118;--ink-soft:#6a5d4e}body{background:var(--paper)}nav.scrolled{background:var(--leather-deep);backdrop-filter:none;border-bottom:1px solid rgba(0,0,0,.15)}h2{color:var(--ink)}p{color:var(--ink-soft)}em{color:var(--ink)}.eyebrow{color:var(--gold-deep)}.meaning .item .k{color:var(--gold-deep)}.closing{color:var(--gold-deep)}.rule{background:var(--gold-deep)}.cats a{color:var(--ink)}.cats a:not(:last-child)::after{background:rgba(44,33,24,.2)}.cats a:hover{color:var(--gold-deep)}footer .word{color:var(--gold-deep)}#catalogo[hidden],#personalizacao[hidden]{display:none!important}#catalogo,#personalizacao{position:fixed;inset:0;z-index:100;background:var(--paper);color:var(--ink);overflow-y:auto}.catalogo-topo{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:1rem clamp(1.3rem,4vw,3.2rem);background:var(--paper);border-bottom:1px solid rgba(44,33,24,.15)}.catalogo-marca{font-family:'Jost',sans-serif;font-weight:300;font-size:1.05rem;letter-spacing:.46em;padding-left:.46em;color:var(--gold-deep)}.catalogo-fechar{font-family:'Jost',sans-serif;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);transition:.3s;background:none;border:0;cursor:pointer}.catalogo-fechar:hover{color:var(--gold-deep)}.personalizacao-conteudo{min-height:calc(100svh - 70px);display:grid;place-items:center;padding:clamp(3rem,7vw,5rem) clamp(1.4rem,5vw,3rem);background:var(--paper);}.personalizacao-card{width:min(100%,720px);text-align:center}.personalizacao-card h2{font-weight:300;font-size:clamp(1.4rem,2.2vw,1.85rem);line-height:1.1;letter-spacing:.04em;margin-bottom:clamp(1.45rem,2.5vw,1.9rem);color:var(--gold-deep)}.personalizacao-card p{max-width:700px;margin:0 auto;font-size:clamp(.98rem,1.25vw,1.1rem);line-height:1.72;text-wrap:pretty;color:var(--ink-soft)}.personalizacao-card .nao-quebrar{white-space:nowrap}.personalizacao-card .personalizacao-fecho{max-width:580px;margin-top:clamp(1.5rem,3vw,2.2rem);font-style:italic;font-size:clamp(1.08rem,1.7vw,1.28rem);color:var(--gold-deep)}.personalizacao-card .personalizacao-assinatura{max-width:none;margin-top:clamp(.65rem,1.2vw,.95rem);font-family:'Jost',sans-serif;font-style:normal;font-weight:500;font-size:.6rem;line-height:1.4;letter-spacing:.32em;text-transform:uppercase;text-align:center;color:var(--gold-deep)}.catalogo-hero{text-align:center;padding:clamp(2.4rem,5vw,3.8rem) 1.4rem;background:#522f20;border-bottom:1px solid rgba(201,162,75,.22)}.catalogo-hero h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:clamp(1.8rem,3.5vw,2.7rem);line-height:1.05;letter-spacing:.03em;margin:0;color:var(--gold-light)}.catalogo-nav{display:flex;justify-content:center;flex-wrap:wrap;border-bottom:1px solid rgba(44,33,24,.15);background:var(--paper)}.catalogo-nav button{font-family:'Jost',sans-serif;font-weight:400;font-size:.64rem;letter-spacing:.23em;text-transform:uppercase;color:var(--gold-deep);padding:1.15rem clamp(1rem,3vw,2.2rem);transition:.3s;background:none;border:0;cursor:pointer}.catalogo-nav button:hover{color:#522f20;background:rgba(160,126,51,.08)}.catalogo-wrap{width:100%;margin:0;padding:0}.categoria{scroll-margin-top:6rem;text-align:center;margin-bottom:clamp(4rem,8vw,7rem)}.categoria:last-child{margin-bottom:1rem}.categoria-faixa{width:100%;background:#522f20;padding:clamp(1.8rem,4vw,2.8rem) 1.4rem;border-top:1px solid rgba(201,162,75,.22);border-bottom:1px solid rgba(201,162,75,.22)}.categoria h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:clamp(1.3rem,2.2vw,1.8rem);line-height:1.05;letter-spacing:.04em;color:var(--gold-light)}.categoria-frase{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:300;font-size:clamp(1.1rem,2vw,1.4rem);color:var(--sand);margin:.8rem auto 0}.galeria-criacoes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,2.4vw,2rem);max-width:1180px;margin:clamp(2.5rem,5vw,4rem) auto 0;padding:0 clamp(1.25rem,4vw,3rem)}.galeria-criacoes.galeria-duas{grid-template-columns:repeat(2,minmax(0,1fr));max-width:580px;margin-left:auto;margin-right:auto}.galeria-criacoes.galeria-seis{grid-template-columns:repeat(3,minmax(0,1fr));max-width:880px;margin-left:auto;margin-right:auto}.espaco-foto{aspect-ratio:4/5;border:1px solid rgba(160,126,51,.35);background:#fff;display:grid;place-items:center;position:relative;overflow:hidden}.espaco-foto::before,.espaco-foto::after{content:'';position:absolute;background:var(--line)}.espaco-foto::before{width:42px;height:1px}.espaco-foto::after{width:1px;height:42px}.espaco-foto span{position:absolute;bottom:1.35rem;font-family:'Jost',sans-serif;font-weight:300;font-size:.59rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold-deep);opacity:.72}@media(max-width:860px){.galeria-criacoes,.galeria-criacoes.galeria-seis{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:540px){.galeria-criacoes,.galeria-criacoes.galeria-duas,.galeria-criacoes.galeria-seis{grid-template-columns:1fr}.catalogo-nav button{flex:1 1 100%;text-align:center}}footer .invite{color:var(--ink-soft)}footer .contact a{color:var(--ink)}footer .contact a:hover{color:var(--gold-deep)}footer .legal{color:rgba(44,33,24,.45)}nav{background:#522f20;border-bottom:1px solid rgba(0,0,0,.18);padding-top:2.1rem;padding-bottom:2.1rem}nav.scrolled{background:#522f20;backdrop-filter:none;border-bottom:1px solid rgba(201,162,75,.22);padding-top:1.7rem;padding-bottom:1.7rem}#criacoes .brooch{position:relative}#criacoes .brooch::before{content:"";position:absolute;inset:-12% -6%;z-index:0;background:radial-gradient(ellipse at 50% 45%,rgba(82,47,32,.16),rgba(82,47,32,.04) 50%,transparent 72%);filter:blur(10px)}#criacoes .brooch img{position:relative;z-index:1}#historia{background:var(--paper)}#historia .eyebrow{color:var(--gold-deep);font-weight:600;font-size:.82rem;letter-spacing:.36em}#historia h2{color:var(--ink)}#historia p{color:var(--ink-soft)}#historia em{color:var(--ink)}#historia .split{grid-template-columns:1fr 1fr;gap:clamp(2.5rem,5vw,5rem);align-items:center}#historia .media{display:flex;align-items:center;justify-content:center;height:auto!important;overflow:visible!important}#historia .historia-copy{display:flex;flex-direction:column;justify-content:center;align-self:stretch;min-height:0}#historia .historia-copy p:last-child{margin-bottom:0}@media(max-width:860px){#historia .split{grid-template-columns:1fr;align-items:center}#historia .historia-copy{align-self:auto;min-height:0;justify-content:flex-start}}#historia .media img{display:block;width:auto!important;max-width:100%!important;height:auto!important;max-height:min(82svh,920px)!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;filter:brightness(1.28) saturate(.98) contrast(.99);}#processo{background:var(--paper)}#processo .eyebrow{color:var(--gold-deep);font-weight:600;font-size:.82rem;letter-spacing:.36em}#processo .processo-text p{color:var(--ink-soft)}#processo .processo-text em{color:var(--gold-deep)}#logotipo{background:#522f20}#logotipo .eyebrow{color:var(--gold-light);font-weight:600;font-size:.82rem;letter-spacing:.36em}#logotipo .meaning .item .k{color:var(--gold-light)}#logotipo .meaning .item p{color:var(--sand)}#logotipo .closing{color:var(--gold-light)}#logotipo .rule{background:var(--gold-light)}#criacoes{background:var(--paper)}#criacoes .eyebrow{color:var(--gold-deep)}#criacoes h2{color:var(--ink)}#criacoes .cats a{color:var(--ink)}#criacoes .cats a:not(:last-child)::after{background:rgba(44,33,24,.2)}#criacoes .cats a:hover{color:var(--gold-deep)}.band-divider{background:#522f20;height:clamp(64px,9vw,104px);width:100%;border-top:1px solid rgba(201,162,75,.22);border-bottom:1px solid rgba(201,162,75,.22);}#historia .wrap{padding-top:clamp(2rem,3.5vw,3rem);padding-bottom:clamp(2rem,3.5vw,3rem)}#processo .wrap{padding-top:clamp(2rem,3.5vw,3rem);padding-bottom:clamp(2rem,3.5vw,3rem)}#processo .processo-video{margin-top:0}#criacoes{padding-bottom:clamp(1.4rem,3.5vw,2.6rem)}footer{background:var(--paper);border-top:none;padding-top:clamp(1.4rem,3.5vw,2.6rem)}footer .word{color:var(--gold-deep)}footer .invite{color:var(--ink-soft)}footer .contact a{color:var(--ink);border-color:rgba(44,33,24,.28)}footer .contact a:hover{color:var(--gold-deep);border-color:var(--gold-deep)}footer .legal{color:rgba(44,33,24,.45)}#criacoes .wrap{max-width:760px}.cta-stack{display:flex;flex-direction:column;align-items:center;gap:.55rem}.cta-main{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;text-transform:uppercase;letter-spacing:.18em;font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.15;color:var(--gold-deep);border:0;padding:.2em .5em;transition:color .4s,letter-spacing .5s,opacity .4s}.cta-main:hover{color:#7f6027;letter-spacing:.22em;opacity:.88}.cta-sub{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:300;font-size:clamp(1rem,1.7vw,1.25rem);color:var(--ink-soft);border-bottom:none;padding:0;transition:color .4s}.cta-sub:hover{color:var(--gold-deep)}#criacoes{padding-bottom:0}#criacoes .wrap{padding-top:clamp(2.2rem,4.5vw,3.4rem);padding-bottom:clamp(.7rem,1.5vw,1rem)}footer{padding-top:0}footer .wrap{padding-top:clamp(.45rem,1vw,.7rem);padding-bottom:clamp(1.8rem,3.5vw,2.5rem)}footer .mark{width:68px;height:43px;margin:0 auto .12rem;line-height:0}footer .mark svg{display:block;width:100%;height:100%}footer .word{font-size:1.18rem;letter-spacing:.48em;padding-left:.48em;line-height:1.15}footer .contact{margin-top:.75rem}footer .legal{margin-top:1.8rem}.hero{background:var(--paper);height:auto;min-height:0;display:block}.hero-bg{background:var(--paper)}.hero-bg img{display:none}.hero-bg::after{display:none}.hero-inner{position:relative;z-index:2;max-width:none;width:100%;min-height:0;padding:0;display:block}.hero .hero-top{min-height:clamp(235px,31vh,320px);padding:clamp(6.8rem,11vh,8rem) 1.5rem clamp(.7rem,1.4vh,1rem);display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--paper);border-bottom:none}.hero .hero-top .jewel-img{width:clamp(62px,8vw,88px)!important;margin-bottom:.55rem!important}.hero .hero-top h1{color:var(--gold-deep);filter:none}.hero .hero-top h1{font-size:clamp(1.75rem,4.6vw,2.45rem)}.hero .hero-video{width:min(920px,94vw);margin:0 auto;padding:clamp(.3rem,.8vw,.7rem) 0 0}
/* 2) O video da entrada nunca entra escondido: o Safari (iPhone/iPad) so autoriza autoplay
      de video visivel, e o opacity:0 do reveal bloqueia a reproducao. De quebra, a entrada
      aparece na hora, sem depender do JavaScript. */
.hero .hero-video.reveal{opacity:1;transform:none;transition:none}.hero .hero-video .story-video{width:100%;max-width:100%;max-height:none;margin-inline:auto;box-shadow:0 24px 56px -34px rgba(44,33,24,.55);}.hero .hero-video::after{display:none}.hero .sub{position:static;left:auto;bottom:auto;transform:none;color:var(--ink-soft);margin:clamp(1.4rem,2.5vw,2rem) auto 0;padding:0 1.5rem clamp(2.8rem,5vw,4rem)}.band-divider{display:block;background:#522f20;height:clamp(48px,6vw,72px);border-top:1px solid rgba(201,162,75,.22);border-bottom:1px solid rgba(201,162,75,.22)}.credito-agnus{margin-top:1.15rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.credito-agnus .mini-cordeiro{width:16px;height:16px}.credito-agnus span{font-family:'Jost',sans-serif;font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}a.selo{display:inline-flex;align-items:center;gap:.6667em;min-height:44px;font-size:12px;color:var(--ink-soft);text-decoration:none;transition:opacity .3s;opacity:1}a.selo:hover{opacity:.72}a.selo .selo-pre{font-weight:400;margin-right:-.3333em;font-size:inherit;color:inherit;letter-spacing:normal;font-family:inherit}a.selo b{font-weight:700;letter-spacing:.09em;color:var(--leather-cognac);font-size:inherit;font-family:inherit}a.selo .selo-em{display:inline-block;width:1.4167em;height:1.4167em;vertical-align:-.26522em;margin-left:.6667em;letter-spacing:0;color:var(--leather-cognac);font-size:inherit;font-family:inherit}a.selo .selo-em svg{width:100%;height:100%;display:block;overflow:visible}.peca-foto{border:0;padding:0;background:rgba(201,162,75,.06);cursor:zoom-in}#visor{position:fixed;inset:0;z-index:200;background:rgba(20,10,4,.95);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;padding:2.2rem 1rem}#visor[hidden]{display:none}#visor img{max-width:92vw;max-height:66vh;object-fit:contain;box-shadow:0 30px 80px -30px rgba(0,0,0,.8)}#visor .v-nome{font-family:'Jost',sans-serif;font-size:.8rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-light)}#visor .v-cont{font-family:'Jost',sans-serif;font-size:.62rem;letter-spacing:.2em;color:var(--sand)}#visor .v-seta{position:absolute;top:50%;transform:translateY(-50%);background:none;border:1px solid rgba(201,162,75,.45);color:var(--gold-light);font-size:1.3rem;line-height:1;padding:.55rem .8rem;cursor:pointer;border-radius:999px}#visor .v-ant{left:14px}#visor .v-prox{right:14px}#visor .v-fechar{position:absolute;top:14px;right:16px;background:none;border:0;color:var(--cream);font-family:'Jost',sans-serif;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;cursor:pointer}#visor .btn-comprar{margin-top:.2rem}@media(max-width:640px){#visor .v-seta{padding:.4rem .6rem}}

/* ---- Entrada no computador (a partir de 900px de largura) --------------------
   A entrada inteira (topo, video e frase) tem de caber na tela, e dentro disso o
   video deve ficar o maior possivel. O topo reservava 252px para 94px de conteudo
   e a frase tinha 64px de respiro embaixo: esse espaco vira video. O video mantem
   16:9, sem recorte, e nunca passa de 920px. Celular e tablet em pe intocados.
   Medido em 08/09/2026: MacBook 13" 832px, MacBook Air 13" e monitor 920px. */
@media(min-width:900px){
  .hero .hero-top{min-height:0;padding-top:clamp(6.8rem,10.5vh,7.6rem);padding-bottom:clamp(.6rem,1.2vh,1rem)}
  .hero .sub{padding-bottom:clamp(1.5rem,3vh,2.2rem)}
  .hero .hero-video{width:min(920px,94vw,calc((100svh - 345px) * 16 / 9))}
  /* a foto de Historia e Inspiracao era mais alta que o video da entrada e roubava
     o protagonismo dele; limite baixado de 82svh para 72svh (pedido dela, 08/09) */
  #historia .media img{max-height:min(72svh,820px)!important}
}

/* ---- Catalogo: deixar claro que a foto abre e tem mais fotos dentro ---- */
.catalogo-dica{font-family:'Jost',sans-serif;font-size:clamp(.63rem,1.1vw,.72rem);letter-spacing:.2em;
  text-transform:uppercase;color:var(--ink-soft);text-align:center;
  padding:clamp(1.1rem,2.6vw,1.7rem) 1.2rem clamp(.2rem,1vw,.5rem);margin:0}
.dica-clique{display:none}
@media(hover:hover) and (pointer:fine){.dica-toque{display:none}.dica-clique{display:inline}}
.peca-conta{display:inline-flex;align-items:center;gap:.45em;margin-top:.5rem;padding:0 0 .25em;
  background:none;border:0;border-bottom:1px solid rgba(106,93,78,.32);cursor:pointer;
  font-family:'Jost',sans-serif;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-soft);transition:color .3s,border-color .3s}
.peca-conta svg{flex:none;opacity:.7}
@media(hover:hover){.peca-card:hover .peca-conta,.peca-conta:hover{color:var(--gold-deep);border-color:var(--gold-deep)}}
.peca-nome{margin-top:.5rem}

/* ---- Nossas Pecas: faixa de foto + fiozinho que avisa que abre (pedido dela, audio 09/09) ---- */
.criacoes-foto{display:block;width:100%;aspect-ratio:7/3;overflow:hidden;background:#160c05}
.criacoes-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block;
  transition:transform 1.1s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){.criacoes-foto:hover img{transform:scale(1.03)}}
#criacoes .wrap{padding-top:clamp(2rem,4.2vw,3rem);padding-bottom:clamp(1.8rem,3.6vw,2.8rem)}
.cta-stack{gap:.45rem}
.cta-dica{display:inline-block;margin-top:clamp(1rem,2.2vw,1.5rem);font-family:'Jost',sans-serif;
  font-size:clamp(.62rem,1.1vw,.7rem);letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold-deep);border-bottom:1px solid var(--gold-deep);padding-bottom:.55em;
  transition:color .3s,border-color .3s}
.cta-dica:hover{color:var(--ink);border-color:var(--ink)}

/* ---- Tira de pecas na entrada do catalogo ---- */
/* tira: as 5 SEMPRE juntas, em qualquer largura, e menores */
.tira-pecas{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(.3rem,1vw,.7rem);
  width:100%;max-width:640px;box-sizing:border-box;padding:0 1rem;
  margin:clamp(1rem,2.2vw,1.5rem) auto 0}
.tira-peca{display:block;aspect-ratio:3/5;overflow:hidden;background:#241309;
  border:1px solid rgba(201,162,75,.35)}
.tira-dica{text-align:center;padding:0 1.2rem clamp(1.3rem,2.6vw,2rem)}
/* faixa da cavaleira mais contida */
@media(min-width:820px){.criacoes-foto{max-width:760px;margin:0 auto}}
.tira-peca img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .9s cubic-bezier(.2,.7,.2,1)}
@media(hover:hover){.tira-peca:hover img{transform:scale(1.05)}}
#criacoes .wrap{padding-bottom:0}
.cta-dica{margin-top:0}


/* ---- Equilibrio que ela aprovou no print de 11/09: 3 fotos quadradas menores + botao com verbo ---- */
.tira-pecas{grid-template-columns:repeat(3,1fr);max-width:345px}
.tira-peca{aspect-ratio:1/1}
.btn-descubra{display:inline-block;font-family:'Jost',sans-serif;
  font-size:clamp(.68rem,1.2vw,.78rem);letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold-deep);border:1px solid var(--gold-deep);
  padding:.85rem 1.9rem;margin-top:clamp(1.1rem,2.4vw,1.6rem);
  transition:background .3s,color .3s,border-color .3s}
@media(hover:hover){.btn-descubra:hover{background:var(--gold-deep);color:#fff;border-color:var(--gold-deep)}}

/* ---- Retorno dela 14/09: fotos menores SO no celular, legenda "Ver mais fotos" ---- */
.tira-peca{aspect-ratio:auto;border:0;background:none;text-align:center}
.tira-moldura{display:block;aspect-ratio:1/1;overflow:hidden;background:#241309;
  border:1px solid rgba(201,162,75,.35)}
.tira-legenda{display:block;margin-top:.5rem;font-family:'Jost',sans-serif;
  font-size:clamp(.5rem,1.5vw,.58rem);letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);transition:color .3s}
@media(hover:hover){.tira-peca:hover .tira-legenda{color:var(--gold-deep)}}
@media(max-width:600px){.tira-pecas{max-width:252px}}

/* ---- Visor: as demais fotos precisam ser alcancaveis no celular ---- */
#visor .v-seta{min-width:44px;min-height:44px;display:inline-flex;align-items:center;
  justify-content:center;padding:0;font-size:1.5rem;border-color:rgba(201,162,75,.75)}
#visor .v-cont{font-size:.7rem;color:var(--gold-light)}

@media(max-width:600px){.tira-pecas{max-width:276px}.tira-legenda{font-size:.5rem;letter-spacing:.04em}}

/* a legenda ocupou 24px; devolvo o respiro pra seguir cabendo numa tela do notebook dela */
.tira-pecas{margin-top:clamp(.8rem,1.6vw,1rem)}
.btn-descubra{margin-top:clamp(.7rem,1.4vw,.9rem)}

/* as 3 celulas dao larguras fracionadas (78,13px) e o arredondamento desalinhava as legendas em 2px */
.tira-pecas{align-items:end}
.tira-peca{display:flex;flex-direction:column;justify-content:flex-end}

/* ================= Retorno dela de 15/09/2026 ================= */
/* 1) 08:50 "Tem dois helenes... Vamos tirar o dourado encima do video"
   O H1 sai da tela mas FICA no HTML (unico h1 da pagina: SEO e leitor de tela). */
.hero .hero-top h1{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* 2) 08:51 "deixar o video proporcional entre o espaco de cima e o espaco de baixo"
   Medido: 1px de diferenca no notebook dela; 10px no pior caso (iPhone). */
.hero .hero-top{min-height:0;padding-top:clamp(8.2rem,12vh,9rem);padding-bottom:clamp(1.4rem,2.6vh,2rem)}
@media(min-width:900px){.hero .sub{padding-bottom:clamp(2.3rem,3vh,2.6rem)}}

/* 3) 09:10 "Talvez nossas pecas sutilmente maior" */
.cta-main{font-size:clamp(1.4rem,2.5vw,1.8rem)}

/* 4) 07:52 "gostaria de diminuir mais essas 3 imagens na pagina inicial?" -> "Sim"
   So no computador: 07:46 "Continua assim no celular". */
@media(min-width:601px){.tira-pecas{max-width:300px}}
/* a legenda tem que caber em UMA linha, como ela aprovou em 14/09 */
@media(min-width:601px){.tira-legenda{font-size:.52rem;letter-spacing:.04em}}
/* 6) Audio dela de 08:12 e 08:28: tom unico SO na primeira pagina.
   "na hora que entrar nas fotos, ai se tornam as reais" -> catalogo e visor INTOCADOS. */
.criacoes-foto img,.tira-moldura img{filter:sepia(0.95) hue-rotate(5deg) contrast(1.06)}
.criacoes-foto img[src$="foto-cavaleira.jpg"]{filter:sepia(0.95) hue-rotate(5deg) saturate(1.18) brightness(1.214) contrast(1.06)}
.tira-moldura img[src$="brinco-ferradura-mini-capa.jpg"]{filter:sepia(0.95) hue-rotate(5deg) saturate(1.08) brightness(1.589) contrast(1.06)}
.tira-moldura img[src$="colar-ferradura-g-capa.jpg"]{filter:sepia(0.95) hue-rotate(5deg) saturate(0.94) brightness(0.894) contrast(1.06)}
.tira-moldura img[src$="colar-logo-capa.jpg"]{filter:sepia(0.95) hue-rotate(5deg) saturate(0.96) brightness(0.934) contrast(1.06)}

/* o bloco Nossas Pecas tem que caber numa tela do notebook dela (650px).
   Com o titulo maior, ficou 666; cortei margem, nao a faixa nem o titulo. Medido: 619px. */
.tira-pecas{margin-top:clamp(.25rem,.6vw,.4rem)}
.btn-descubra{margin-top:clamp(.2rem,.5vw,.35rem)}
.tira-dica{padding-bottom:0}

/* ================= Retorno dela de 16/09/2026 ================= */
/* "retirar o logo": o simbolo dourado entre o menu e o video (ela circulou de vermelho).
   Sai SO o do hero. O de #logotipo fica: e o assunto da secao "O significado de um simbolo". */
.hero .hero-top .jewel-img{display:none!important}
/* Refazendo o equilibrio cima/baixo que ela pediu em 15/09 08:51, agora sem a joia.
   Sem ela o espaco de cima virou vazio puro (110px) contra 37px depois da frase: 3x.
   Igualei os dois vazios em 76px, com a frase no meio. O video sobe 34px e NAO muda
   de tamanho (a largura dele so depende da altura da tela: min(920px,94vw,(100svh-345px)*16/9)).
   97px = altura do menu fixo, que cobre o topo da capa. */
.hero .hero-top{padding-top:173px;padding-bottom:0}
.hero .sub{padding-bottom:76px}
/* "retirar a faixa marrom entre a frase do logotipo e a foto".
   Sao 3 faixas iguais na pagina; sai SO a que fica depois de #logotipo.
   As outras duas (depois da capa e entre Historia e Processo) ficam. */
#logotipo + .band-divider{display:none}
/* O respiro creme entre o marrom e a midia tem que ser o mesmo em toda foto e video:
   39px na foto da amazona, 38px no video vertical e 0px na foto da cavaleira (o marrom
   encostava nela). Mesma formula das outras duas secoes. */
#criacoes{padding-top:clamp(2rem,3.5vw,3rem)}

/* 16/09 - ritmo da pagina inicial aplicado a capa (escolha do JV: "B").
   O mesmo clamp(2rem,3.5vw,3rem) das outras secoes: 32px no celular, 38 no
   notebook dela, 48 no monitor. Assim menu->video, video->frase e frase->barra
   ficam todos no mesmo respiro, e o video mantem o mesmo espaco em cima e
   embaixo, que e o que ela pediu em 15/09 08:51. */
.hero .hero-top{padding-top:calc(97px + clamp(2rem,3.5vw,3rem))}
.hero .sub{margin-top:clamp(2rem,3.5vw,3rem);padding-bottom:clamp(2rem,3.5vw,3rem)}

/* ================= 16/09: bloco Nossas Pecas mais respiravel ================= */
/* Ela: "esta tudo muito apertadinho, precisa ser mais respiravel, mais pra baixo,
   dando espacos adequados e diminuindo as fotos ainda mais".
   Os vaos estavam em 6, 8, 6, 11 e 2px porque em 15/09 eu espremi o bloco pra ele
   caber numa tela do notebook dela. Desfaco o aperto e uso uma escala tirada do
   mesmo respiro do resto da pagina: 32px no celular, 38 na tela dela, 48 no monitor. */
:root{--respiro:clamp(2rem,3.5vw,3rem)}

/* foto da cavaleira -> NOSSAS PECAS */
#criacoes .wrap{padding-top:calc(var(--respiro) * 1.5)}
/* NOSSAS PECAS -> Sua joia. Sua medida. */
.cta-stack{gap:calc(var(--respiro) * .5)}
/* Sua joia -> as 3 fotos */
.tira-pecas{margin-top:var(--respiro)}
/* fotos menores: 80% da celula. A celula continua com a largura de antes, entao a
   legenda "Ver mais fotos" segue numa linha so, como ela aprovou em 14/09. */
.tira-moldura{width:80%;margin-left:auto;margin-right:auto}
/* foto -> VER MAIS FOTOS */
.tira-legenda{margin-top:calc(var(--respiro) * .35)}
/* VER MAIS FOTOS -> DESCUBRA AS PECAS */
.btn-descubra{margin-top:var(--respiro)}
/* DESCUBRA AS PECAS -> rodape */
footer .wrap{padding-top:calc(var(--respiro) * 1.5)}
/* simbolo do rodape -> HELENE */
footer .mark{margin-bottom:calc(var(--respiro) * .35)}
/* HELENE -> contatos */
footer .contact{margin-top:calc(var(--respiro) * .5)}
/* contatos -> copyright */
footer .legal{margin-top:var(--respiro)}
/* a legenda sobrava 4,6px de cada lado da foto (texto 75,2px sob foto de 66px).
   Ajusto a legenda a largura da foto sem mexer na foto nem no botao. */
.tira-legenda{font-size:.47rem;letter-spacing:.02em}
@media(min-width:601px){.tira-legenda{font-size:.47rem;letter-spacing:.02em}}
/* Ela: "prefiro sem o retangulo. Faz uma linha simples embaixo apenas de Descubra".
   Sem recheio lateral, entao a linha fica na largura exata do texto, sem sobrar dos lados.
   O recheio vertical e assimetrico (mais em cima) pra a linha ficar perto do texto como
   sublinhado, mantendo a area clicavel acima dos 44px. As margens descontam o recheio
   pra o vao entre os TEXTOS continuar no ritmo da pagina. */
.btn-descubra{border:0;border-bottom:1px solid var(--gold-deep);padding:1.1rem 0 .5rem;
  margin-top:calc(var(--respiro) - 1.1rem)}
.btn-descubra:hover{background:none;color:#7f6027;border-bottom-color:#7f6027;letter-spacing:.3em}
/* Ela: a frase "Sua joia. Sua medida." passa a ficar ABAIXO das 3 fotos.
   Saiu de dentro do cta-stack (que agora so tem o titulo) e virou um bloco proprio
   entre a tira e o botao, no mesmo ritmo do resto. */
.cta-abaixo{text-align:center;margin-top:var(--respiro)}
.cta-abaixo .cta-sub{display:inline-block}
/* o titulo agora encosta direto nas fotos: mesmo respiro */
.tira-pecas{margin-top:var(--respiro)}
/* Correcao 16/09: a legenda foi reduzida demais. A medicao que embasou o .47rem foi
   feita com as fontes bloqueadas, e a fonte de fallback e ~10% mais larga que a Jost.
   Com a Jost real: .52rem da 68,2px sob foto de 66px (1,1px de cada lado) e .47rem da
   59,6px (3,2px de folga de cada lado, letra pequena demais).
   .50rem com o espacamento original bate a largura da foto e devolve tamanho a letra. */
.tira-legenda{font-size:.5rem;letter-spacing:.04em}
@media(min-width:601px){.tira-legenda{font-size:.5rem;letter-spacing:.04em}}

/* O selo da Agnus tem que ser o mesmo em todo site da Agnus. Aqui ele estava errado:
   1) o "por" vinha em MAIUSCULA, por causa de .credito-agnus span{text-transform:uppercase},
      regra que sobrou de uma versao anterior da assinatura e ainda pegava o .selo-pre;
   2) a fonte era a serifada do corpo, porque .selo nao define font-family e o .selo-pre e o
      .selo b dizem font-family:inherit. Nos outros sites da Agnus o selo herda a sans-serif.
   O proprio rodape da HELENE ja e todo Jost (HELENE, contatos, copyright), entao a serifada
   destoava tambem dentro da propria pagina. */
.selo{font-family:'Jost',sans-serif}
.selo .selo-pre{text-transform:none}

/* Linha final do rodape no padrao dos outros sites da Agnus: divisoria, copyright a
   esquerda e o selo a direita. Centralizado, o selo do estudio ganhava mais peso que
   merece e competia com o nome da marca; no canto ele volta a ser assinatura.
   No celular empilha centrado, porque nao cabe lado a lado. */
.rodape-fim{margin-top:var(--respiro);padding-top:var(--respiro);
  border-top:1px solid rgba(160,126,51,.22);
  display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.rodape-fim .legal{margin-top:0}
.rodape-fim .credito-agnus{margin-top:0}
@media(max-width:600px){.rodape-fim{flex-direction:column;gap:1rem}}

/* Botao flutuante de WhatsApp, versao discreta: fundo creme da propria pagina, fio
   dourado no mesmo peso dos outros fios do site (35%), icone dourado. So no hover ele
   se enche de marrom. */
.wa-flutuante{position:fixed;right:clamp(1rem,2.5vw,1.6rem);bottom:clamp(1rem,2.5vw,1.6rem);z-index:55;
  width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--paper);border:1px solid rgba(160,126,51,.35);color:var(--gold-deep);
  box-shadow:0 6px 18px -10px rgba(27,15,8,.35);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),background .35s,color .35s,border-color .35s}
.wa-flutuante svg{width:22px;height:22px;fill:currentColor;display:block;flex:none}
.wa-flutuante:hover{background:#522f20;color:var(--gold-light);border-color:rgba(201,162,75,.45);transform:translateY(-2px)}
/* Entre 601 e 1200px de largura a borda do rodape encosta na borda da tela, e o botao
   flutuante cairia em cima do selo (medido: 22px de sobreposicao na tela dela, 28px no
   tablet). Nessa faixa o canto fica reservado pro botao e o selo recua. Abaixo de 600
   o rodape empilha centrado e nao ha conflito; acima de 1200 a coluna ja tem folga. */
@media(min-width:601px) and (max-width:1200px){.rodape-fim{padding-right:62px}}

/* ================= Video dela de 16/09 11:34 ================= */
/* 1) "essa mesma distancia de um dedo que voce deixou da faixa, tem que ficar aqui
      embaixo, igual, pra comecar Nossas Pecas" -> o vao foto->titulo passa a ser o
      mesmo respiro da pagina. Desconto a entrelinha do titulo pra a distancia VISIVEL
      bater, nao a caixa. */
#criacoes .wrap{padding-top:calc(var(--respiro) - 6px)}
/* 2) "essas tres tambem podem subir um pouquinho, ficar mais proximas a Nossas Pecas" */
.tira-pecas{margin-top:calc(var(--respiro) - 10px)}
/* 3) "esses espacinhos ficaram esquisitos, parecem tres dentes. Ou junta mais, ou
      aumenta um pouquinho as tres pra preencher esse vazio. Tem que ficar um filetinho,
      nao esse espacao no meio." -> as duas coisas: a foto ocupa a celula inteira e a
      tira encolhe, entao a foto vai de 66 para 70px e o vao entre elas de 28 para 11. */
.tira-moldura{width:100%}
.tira-pecas{max-width:264px;gap:11px}
/* 4) "junta um pouquinho as duas, e ficar uma em cima da outra" */
.btn-descubra{margin-top:calc(var(--respiro) * .5 - .85rem)}

/* Compensacao de entrelinha. O CSS posiciona a CAIXA do texto, mas o olho ve a LETRA,
   e entre as duas existe a entrelinha da fonte. Era por isso que o vao embaixo da foto
   media 44px contra 38 acima dela, mesmo com o CSS dizendo 38. Cada compensacao esta
   em em do proprio texto, entao acompanha o tamanho da fonte em qualquer tela.
   Alvos medidos por PIXEL, da ultima letra de um ate a primeira do proximo:
   foto->titulo = respiro ; titulo->fotinhas = 0,75 ; legenda->frase = respiro ;
   frase->botao = 0,5. */
#criacoes .wrap{padding-top:var(--respiro)}
.cta-main{margin-top:-.47em;margin-bottom:-.21em}
.tira-pecas{margin-top:calc(var(--respiro) * .75)}
.tira-legenda{margin-bottom:-.35em}
.cta-abaixo{margin-top:calc(var(--respiro) - 11px)}
.cta-sub{margin-top:-.42em;margin-bottom:-.28em}
.btn-descubra{margin-top:calc(var(--respiro) * .5 - .85rem - .2em - 9px)}

/* ================= Padronizacao por pixel da pagina inteira ================= */
/* Uma escala so: 1x = respiro (32 celular / 38 tela dela / 48 monitor).
   1,5x separa secao de rodape ; 0,75x liga titulo ao conteudo ; 0,5x liga par
   (olho e seu texto, simbolo e nome). Todo desconto abaixo tira a entrelinha do
   texto vizinho, e cada um veio de medicao por pixel, nao de conta. */

/* capa: video -> frase */
.hero .sub{margin-top:calc(var(--respiro) - 4px)}

/* Historia e Inspiracao */
#historia .wrap{padding-top:var(--respiro)}
#historia .eyebrow{margin-bottom:calc(var(--respiro) * .5 - 12px)}
@media(max-width:860px){#historia .split{gap:calc(var(--respiro) - 5px)}}

/* Do Esporte a Joia */
#processo .wrap{padding-top:var(--respiro)}
#processo .processo-copy .eyebrow{margin-bottom:calc(var(--respiro) * .5 - 12px)}
@media(max-width:860px){#processo .processo-layout{gap:calc(var(--respiro) - 6px)}}

/* O Logotipo: era 62 / 50 / 44 / 39 onde devia ser o respiro */
#logotipo .eyebrow{margin-bottom:0}
#logotipo #logostage{margin-top:calc(var(--respiro) - 12px)!important;margin-bottom:calc(var(--respiro) - 2px)!important}
#logotipo .meaning{margin-top:0;margin-bottom:calc(var(--respiro) - 4px)}
#logotipo .rule.center{margin-top:0;margin-bottom:calc(var(--respiro) - 4px)}
#logotipo .closing{margin-top:0}

/* rodape */
footer .wrap{padding-top:calc(var(--respiro) * 1.5 - 8px)}
footer .mark{margin-bottom:calc(var(--respiro) * .35 - 9px)}
footer .contact{margin-top:calc(var(--respiro) * .5 - 10px)}
.rodape-fim{margin-top:calc(var(--respiro) - 4px)}
/* No computador Historia e Do Esporte a Joia ficam em duas colunas e o primeiro
   elemento e a midia, que nao tem entrelinha. O desconto da entrelinha do olho vale
   so no celular, onde a secao empilha e o olho vem primeiro. */
@media(max-width:860px){
  #historia .wrap{padding-top:calc(var(--respiro) - 3px)}
  #processo .wrap{padding-top:calc(var(--respiro) - 10px)}
}

/* Ela, 16/09: "so precisa diminuir no celular as 3 fotos".
   No celular 70px era 18% da largura da tela, contra 6% no computador.
   Vao para 58px (-17%). A legenda encolhe junto, senao ela sobra dos lados da foto
   ou quebra em duas linhas: 65,7px de texto nao cabem embaixo de uma foto de 58.
   O vao entre as fotos continua em 11px, o filetinho que ela pediu. */
@media(max-width:600px){
  .tira-pecas{max-width:228px}
  .tira-legenda{font-size:.43rem;letter-spacing:.04em}
}

/* ===== catalogo: mesmo respiro em cima e embaixo das fotos (audio dela 16/09 14:43) ===== */
/* em cima = margin-top da galeria: clamp(2.5rem,5vw,4rem). embaixo = este margin + o padding de 1.1rem do card. */
.categoria,.categoria:last-child{margin-bottom:calc(clamp(2.5rem,5vw,4rem) - 1.1rem)}

/* ===== 16/09: cor original de volta na foto da cavaleira e nas 3 fotinhas (pedido dela). So o filtro; tamanho e layout intocados ===== */
.criacoes-foto img,.criacoes-foto img[src$="foto-cavaleira.jpg"],.tira-moldura img,.tira-moldura img[src$="brinco-ferradura-mini-capa.jpg"],.tira-moldura img[src$="colar-ferradura-g-capa.jpg"],.tira-moldura img[src$="colar-logo-capa.jpg"]{filter:none}

/* ===== 18/09: foto nova da amazona (abraco no cavalo), recortada nas tarjas vermelhas dela. A faixa assume a proporcao exata do recorte ===== */
.criacoes-foto{aspect-ratio:1094/360}