oliver/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

old

Browse Source
This commit is contained in:
oliver
2026-07-01 13:04:42 -03:00
commit babd7e1c0f
34 changed files with 6872 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+387
View File
@@ -0,0 +1,387 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>FI-NE &amp; LACUEOR — B2B Partner Portal</title>
<link rel="icon" href="asset/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!-- ============================================================
TOP BAR
============================================================ -->
<header class="topbar" role="banner">
<div class="topbar-logo">
<img
src="asset/Bildschirmfoto_2025-12-05_um_17.28.39-removebg-preview.png"
alt="[fi-ne] &amp; LACUEOR"
/>
<span class="topbar-label">B2B<br />Partner Portal</span>
</div>
<nav class="topbar-nav" aria-label="Primary">
<a href="#brands" class="nav-hide">Our Brands</a>
<a href="#b2b" class="nav-hide">Partner Benefits</a>
<a href="mailto:b2b@finor.de" class="nav-hide">Contact</a>
<a href="mailto:b2b@finor.de" class="btn-topbar"
>Get In Touch</a
>
</nav>
</header>
<!-- ============================================================
HERO
============================================================ -->
<main>
<section class="hero" aria-labelledby="hero-heading">
<div class="hero-inner">
<p class="hero-eyebrow">Exclusive B2B Partner Portal</p>
<h1 id="hero-heading">
<span class="hero-title"><em>[fi-ne]</em></span>
<span class="hero-ampersand">&amp;</span>
<span class="hero-title">LACUEOR</span>
</h1>
<p class="hero-subtitle">
Two distinct expressions of uncompromising luxury. One
portal for the partners who share our vision.
</p>
<div class="hero-rule" aria-hidden="true">
<span></span>
<span class="hero-rule-diamond"></span>
<span></span>
</div>
</div>
<div class="scroll-cue" aria-hidden="true">
<span>Discover</span>
<div class="scroll-cue-line"></div>
</div>
</section>
<!-- ============================================================
BRAND CARDS — B2C BANNER
============================================================ -->
<section
class="section brands-section"
id="brands"
aria-labelledby="brands-heading"
>
<p class="section-label">Our Brand Universe</p>
<h2 class="section-title" id="brands-heading">
Consumer &amp; Retail Destinations
</h2>
<p class="section-body">
Direct your clients and consumers to our flagship brand
destinations — each crafted to deliver the full luxury
experience.
</p>
<div class="brands-grid" role="list">
<!-- FI-NE -->
<a
class="brand-card brand-card--fine"
href="https://finecosmetic.de"
target="_blank"
rel="noopener noreferrer"
role="listitem"
aria-label="Visit [fi-ne] consumer website — finecosmetic.de"
>
<div
class="brand-card-top-accent"
aria-hidden="true"
></div>
<img
class="brand-card-image"
src="asset/Fine.webp"
alt="[fi-ne] Deodorant Cream Vetiver Geranium product"
/>
<div
class="brand-card-overlay"
aria-hidden="true"
></div>
<div class="brand-card-content">
<span class="brand-card-eyebrow"
>Premium Natural Cosmetics</span
>
<img
class="brand-card-logo"
src="asset/Fine.svg"
alt="[fi-ne] brand logo"
/>
<span class="brand-card-tagline">
Clean. Unisex. Uncompromisingly effective.<br />
Made in Germany.
</span>
<span class="brand-card-cta">
finecosmetic.de
<span
class="brand-card-cta-arrow"
aria-hidden="true"
>&#8594;</span
>
</span>
</div>
</a>
<!-- LACUEOR -->
<a
class="brand-card brand-card--lacueor"
href="https://lacueor.com"
target="_blank"
rel="noopener noreferrer"
role="listitem"
aria-label="Visit LACUEOR consumer website — lacueor.com"
>
<div
class="brand-card-top-accent"
aria-hidden="true"
></div>
<img
class="brand-card-image"
src="asset/Lacuoer.jpg"
alt="LACUEOR Staub luxury skincare product on crystal"
/>
<div
class="brand-card-overlay"
aria-hidden="true"
></div>
<div class="brand-card-content">
<span class="brand-card-eyebrow"
>Premium Organic Skin Care</span
>
<img
class="brand-card-logo"
src="asset/Lacueor.svg"
alt="LACUEOR brand logo"
/>
<span class="brand-card-tagline">
From the quantum realm to your skin.<br />
Made in Berlin &amp; Brandenburg with love.
</span>
<span class="brand-card-cta">
lacueor.com
<span
class="brand-card-cta-arrow"
aria-hidden="true"
>&#8594;</span
>
</span>
</div>
</a>
</div>
<p class="brands-notice">
Looking for consumer
products?&nbsp;&nbsp;&#8212;&nbsp;&nbsp; Visit&nbsp;<a
href="https://finecosmetic.de"
target="_blank"
rel="noopener"
>finecosmetic.de</a
>
&nbsp;or&nbsp;
<a href="https://lacueor.com" target="_blank" rel="noopener"
>lacueor.com</a
>
&nbsp;directly.
</p>
</section>
<!-- ============================================================
B2B BENEFITS SECTION
============================================================ -->
<section
class="section b2b-section"
id="b2b"
aria-labelledby="b2b-heading"
>
<p class="section-label">Exclusive Partnership</p>
<h2 class="section-title" id="b2b-heading">
Apply for B2B Access
</h2>
<p class="section-body">
Join our Business Partner Programme and unlock wholesale
pricing, exclusive promotions, and dedicated account support
— crafted for retailers, distributors, and professional
buyers.
</p>
<div class="b2b-benefits" role="list">
<!-- Bulk Pricing -->
<div class="b2b-benefit" role="listitem">
<div class="b2b-benefit-icon-wrap" aria-hidden="true">
<svg
width="28"
height="28"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.25"
stroke-linecap="round"
stroke-linejoin="round"
>
<path
d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"
/>
<polyline
points="3.27 6.96 12 12.01 20.73 6.96"
/>
<line x1="12" y1="22.08" x2="12" y2="12" />
</svg>
</div>
<span class="b2b-benefit-title">Bulk Pricing</span>
<div class="b2b-benefit-rule" aria-hidden="true"></div>
<span class="b2b-benefit-text">
Tiered wholesale rates on every SKU across our
entire brand portfolio — the more you order, the
more you save.
</span>
</div>
<!-- Exclusive Promotions -->
<div class="b2b-benefit" role="listitem">
<div class="b2b-benefit-icon-wrap" aria-hidden="true">
<svg
width="28"
height="28"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.25"
stroke-linecap="round"
stroke-linejoin="round"
>
<circle cx="12" cy="8" r="6" />
<path
d="M15.477 12.89 17 22l-5-3-5 3 1.523-9.11"
/>
</svg>
</div>
<span class="b2b-benefit-title"
>Exclusive Promotions</span
>
<div class="b2b-benefit-rule" aria-hidden="true"></div>
<span class="b2b-benefit-text">
Partner-only seasonal campaigns, early-access
product launches, and co-marketing opportunities
reserved for B2B members.
</span>
</div>
<!-- Dedicated Support -->
<div class="b2b-benefit" role="listitem">
<div class="b2b-benefit-icon-wrap" aria-hidden="true">
<svg
width="28"
height="28"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.25"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M3 18v-6a9 9 0 0 1 18 0v6" />
<path
d="M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3z"
/>
<path
d="M3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z"
/>
</svg>
</div>
<span class="b2b-benefit-title">Dedicated Support</span>
<div class="b2b-benefit-rule" aria-hidden="true"></div>
<span class="b2b-benefit-text">
A personal account manager and priority fulfilment
to keep your business moving without friction.
</span>
</div>
</div>
<div class="b2b-divider" aria-hidden="true"></div>
<p class="b2b-notice">
Already a partner?&#160;&#160;—&#160;&#160;
<a href="#portal">Sign in to your B2B account</a>
</p>
</section>
<!-- ============================================================
VALUES / BRAND PILLARS STRIP
============================================================ -->
<div class="values-strip" aria-label="Our partner promise">
<div class="values-grid" role="list">
<div class="value-item" role="listitem">
<p class="value-number">01</p>
<p class="value-title">Curated</p>
<p class="value-desc">Selectively distributed</p>
</div>
<div class="value-item" role="listitem">
<p class="value-number">02</p>
<p class="value-title">Certified</p>
<p class="value-desc">Vegan &amp; natural formulas</p>
</div>
<div class="value-item" role="listitem">
<p class="value-number">03</p>
<p class="value-title">Crafted</p>
<p class="value-desc">Handmade in Germany</p>
</div>
<div class="value-item" role="listitem">
<p class="value-number">04</p>
<p class="value-title">Committed</p>
<p class="value-desc">White-glove B2B support</p>
</div>
</div>
</div>
</main>
<!-- ============================================================
FOOTER
============================================================ -->
<footer role="contentinfo">
<div class="footer-inner">
<div class="footer-top">
<div class="footer-brands">
<a
class="footer-brand-link"
href="https://finecosmetic.de"
target="_blank"
rel="noopener"
>[fi-ne]</a
>
<span class="footer-brand-sep">&bull;</span>
<a
class="footer-brand-link"
href="https://lacueor.com"
target="_blank"
rel="noopener"
>LACUEOR</a
>
</div>
<div class="footer-logo-wrap">
<img
src="asset/Bildschirmfoto_2025-12-05_um_17.28.39-removebg-preview.png"
alt="[fi-ne] &amp; LACUEOR"
/>
</div>
<div class="footer-contact">
<a href="mailto:b2b@finor.de">b2b@finor.de</a>
<a href="mailto:info@lacueor.com">info@lacueor.com</a>
</div>
</div>
<div class="footer-bottom">
<p class="footer-legal">
&copy; 2025 FINOR GmbH. All rights reserved.
<a href="#">Legal Notice</a>
<a href="#">Privacy Policy</a>
</p>
<p class="footer-tagline">Made in Berlin, with love.</p>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>