.concept-site .demo-brand{letter-spacing:-.05em}.concept-site h1,.concept-site h2{font-weight:400}.concept-site .eyebrow{font-size:11px;letter-spacing:3px}.concept-site img{object-fit:cover}.concept-site header{position:relative;z-index:2}.concept-site .demo-contact{padding:90px 7%}.concept-site .demo-button{transition:transform .3s;transform-origin:center}.concept-site .demo-button:hover{transform:scale(1.025)}
/* Origem: centered typographic poster, landscape image and a three-step ritual. */
.origem-site{background:#efe7cb;color:#293b2d}.origem-site .demo-brand{font-style:italic;font-weight:bold}.coffee-hero{text-align:center;padding:20px 7% 0}.coffee-hero h1{font:600 clamp(76px,12vw,180px)/.9 'DM Sans',sans-serif;letter-spacing:-.07em;margin:32px 0}.coffee-hero h1 em{font:italic 400 1em/.95 Georgia,serif}.coffee-landscape{position:relative;margin:45px auto 0;max-width:1200px}.coffee-landscape img{width:100%;height:320px;border-radius:180px 180px 0 0;display:block}.coffee-badge{position:absolute;right:9%;top:60px;display:grid;place-content:center;background:#e0f078;border-radius:50%;height:130px;width:130px;font:italic 29px/1 Georgia,serif;transform:rotate(12deg)}.coffee-story{display:grid;grid-template-columns:1.3fr 1fr;gap:15%;padding:110px 9%}.coffee-story h2{font:52px/1.12 Georgia,serif}.coffee-story>div>span{font-size:10px;letter-spacing:2px}.coffee-ritual{background:#293b2d;color:#efe7cb;padding:90px 7%}.coffee-ritual>div{display:grid;grid-template-columns:repeat(3,1fr);gap:7%;margin-top:60px}.coffee-ritual article>span{font:italic 36px Georgia,serif;color:#e0f078}.coffee-ritual h3{font-size:22px;font-weight:500}.coffee-ritual p{font-size:14px;max-width:270px}.origem-site .demo-contact{background:#e0f078;color:#293b2d}
/* Vela: overlapping typography, arched photography and a skincare manifesto. */
.vela-site{background:#f1dfda;color:#6b303c}.vela-site .demo-brand{font-style:italic}.skin-hero{height:740px;position:relative;margin:20px 7% 0}.skin-hero>img{position:absolute;left:8%;top:0;width:49%;height:660px;border-radius:260px 260px 0 0}.skin-hero>div{position:absolute;left:51%;top:95px;z-index:1}.skin-hero h1{font:clamp(80px,10.5vw,155px)/.95 Georgia,serif;letter-spacing:-.06em;margin:30px 0}.skin-vertical{position:absolute;left:0;top:150px;writing-mode:vertical-rl;letter-spacing:4px;font-size:10px}.skin-edition{position:absolute;bottom:25px;left:8%;font-size:12px}.skin-manifesto{text-align:center;padding:100px 10%;background:#faefea}.skin-manifesto>p:first-child{font-size:10px;letter-spacing:2px}.skin-manifesto h2{font-size:clamp(65px,7vw,105px);line-height:1.05;margin:35px 0}.skin-manifesto>p:last-child{max-width:420px;margin:40px auto}.skin-ritual{display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:100px 9%;gap:13%}.skin-ritual img{width:100%;height:540px;object-position:30% center}.skin-ritual>div>span{font-size:10px;letter-spacing:2px}.skin-ritual h2{font-size:70px;margin-top:35px}.skin-ritual p{max-width:320px}.vela-site .demo-contact{background:#6b303c;color:#faefea}
/* Mova: athletic poster, cutout image and a full-width numbered training list. */
.mova-site{background:#212925;color:#f2f3e5}.mova-site .demo-brand{font:bold 42px 'DM Sans',sans-serif}.mova-hero{position:relative;margin:30px 7% 0;min-height:680px}.mova-hero>img{position:absolute;right:0;width:65%;height:620px;clip-path:polygon(20% 0,100% 0,80% 100%,0 100%);object-position:50% 35%}.mova-hero h1{position:relative;font:600 clamp(95px,13vw,195px)/.86 'DM Sans',sans-serif;letter-spacing:-.07em;margin:0}.mova-hero h1 em{font-style:normal;color:#ddf97b}.mova-hero>div{position:absolute;right:2%;bottom:0;background:#212925;padding:15px 25px}.mova-hero p{font-size:14px}.mova-banner{padding:24px 7%;background:#ddf97b;color:#212925;font-size:clamp(15px,2.4vw,34px);font-weight:600;letter-spacing:1px;margin-top:50px}.mova-studio{padding:110px 7%;display:grid;grid-template-columns:.4fr 1fr .8fr;gap:50px;align-items:start}.mova-studio>span{font-size:11px;letter-spacing:2px}.mova-site h2{font-family:'DM Sans',sans-serif;font-weight:600;letter-spacing:-.05em}.mova-studio h2{font-size:64px;line-height:1}.mova-classes{padding:0 7% 100px}.mova-classes>h2{max-width:650px;margin-bottom:65px}.mova-classes article{display:grid;grid-template-columns:.25fr 1fr 1fr auto;border-top:1px solid #687266;align-items:center;gap:20px;padding:27px 0}.mova-classes h3{font-size:42px;margin:0;letter-spacing:-2px}.mova-classes article>span,.mova-classes b{color:#ddf97b}.mova-classes p{font-size:13px}.mova-site .demo-contact{background:#ddf97b;color:#212925}
/* Mesa: immersive photograph and a quiet restaurant-style menu. */
.mesa-site{background:#f2eadc;color:#493728}.mesa-site header{position:absolute;top:46px;left:0;width:100%;color:#fff2de}.mesa-hero{position:relative;height:850px;display:grid;place-items:center;background:#30231d;color:#fff2de;overflow:hidden}.mesa-hero>img{position:absolute;inset:0;height:100%;width:100%}.mesa-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(#1c181980,#21150e70)}.mesa-hero>div{position:relative;z-index:1;text-align:center;padding:30px 5%}.mesa-hero h1{font:clamp(65px,8.2vw,125px)/1.07 Georgia,serif;letter-spacing:-.05em}.mesa-hero>span{position:absolute;bottom:40px;z-index:1;font-size:10px;letter-spacing:3px}.mesa-story{padding:110px 7%;display:grid;grid-template-columns:.3fr 1fr .4fr;gap:60px}.mesa-story>span{font-size:11px;letter-spacing:2px}.mesa-story h2{font-size:58px}.mesa-story p{max-width:540px}.mesa-note{font:italic 22px/1.4 Georgia,serif;border-left:1px solid #b4a58c;padding-left:30px}.mesa-menu{padding:90px 10%;display:grid;grid-template-columns:1fr 1fr;gap:15%;background:#e5dbc9}.mesa-menu>div>p{font-size:12px}.mesa-menu h2{font-size:76px;margin-top:40px}.mesa-menu article{padding:20px 0;border-bottom:1px solid #bead91}.mesa-menu h3{font:30px Georgia,serif}.mesa-menu article p{font-size:14px}.mesa-site .demo-contact{background:#493728;color:#fff2de}
@media(max-width:700px){
 .concept-site nav a:nth-child(2){display:inline}.concept-site nav{gap:12px;font-size:10px}.concept-site .demo-brand{font-size:28px}.concept-site header{padding:22px 6%}.concept-site .demo-notice{font-size:9px}.concept-site .demo-contact{padding:65px 7%}
 .coffee-hero h1{font-size:19vw}.coffee-hero>p{font-size:12px}.coffee-landscape img{height:220px;border-radius:90px 90px 0 0}.coffee-badge{width:85px;height:85px;font-size:20px}.coffee-story{grid-template-columns:1fr;padding:65px 7%;gap:25px}.coffee-story h2{font-size:39px}.coffee-ritual{padding:65px 7%}.coffee-ritual>div{grid-template-columns:1fr;gap:20px;margin-top:35px}.coffee-ritual article{border-top:1px solid #62715b;padding-top:20px}.coffee-ritual h3{margin:15px 0}
 .skin-hero{height:580px;margin:10px 5% 0}.skin-hero>img{left:6%;width:66%;height:450px}.skin-hero>div{left:37%;top:110px}.skin-hero h1{font-size:18vw}.skin-hero .eyebrow{font-size:7px;letter-spacing:1px}.skin-hero>div>p:not(.eyebrow){font-size:12px}.skin-vertical{font-size:7px;letter-spacing:2px;top:80px}.skin-edition{bottom:25px;font-size:10px}.skin-manifesto{padding:65px 7%}.skin-manifesto h2{font-size:17vw}.skin-ritual{grid-template-columns:1fr;padding:65px 7%;gap:35px}.skin-ritual h2{font-size:55px}.skin-ritual img{height:380px}
 .mova-hero{min-height:570px;margin:20px 6% 0}.mova-hero>img{height:360px;width:80%;top:55px}.mova-hero h1{font-size:25vw}.mova-hero>div{bottom:0;right:0;padding:15px}.mova-banner{margin-top:25px;padding:20px 6%;font-size:13px}.mova-studio{grid-template-columns:1fr;padding:65px 7%;gap:25px}.mova-studio h2{font-size:52px;margin:0}.mova-classes{padding-bottom:65px}.mova-classes>h2{font-size:40px;margin-bottom:35px}.mova-classes article{grid-template-columns:25px 1fr auto;gap:10px}.mova-classes h3{font-size:28px;letter-spacing:-1px}.mova-classes p{grid-column:2;grid-row:2;margin:0}.mova-classes b{grid-column:3;grid-row:1}
 .mesa-site header{top:42px}.mesa-hero{height:720px}.mesa-hero h1{font-size:14vw}.mesa-hero .eyebrow{font-size:8px;letter-spacing:2px}.mesa-hero>span{font-size:7px;letter-spacing:2px}.mesa-story{grid-template-columns:1fr;gap:25px;padding:65px 7%}.mesa-story h2{font-size:40px}.mesa-note{font-size:20px}.mesa-menu{grid-template-columns:1fr;gap:20px;padding:65px 7%}.mesa-menu h2{font-size:60px;margin-top:25px}
}
@media(max-width:700px){.skin-hero>div{left:30%;max-width:70%}.skin-hero h1{font-size:13vw}}