@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root { --ink:#090c0e; --paper:#f2f4f2; --white:#fff; --mint:#bcefe5; --lime:#d6f66a; --line:#d9dfdc; --muted:#687270; --serif:Georgia,'Times New Roman',serif; --sans:'Manrope','DM Sans',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:15px; line-height:1.55; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.site-header { align-items:center; background:rgba(9,12,14,.94); color:var(--white); display:flex; height:76px; justify-content:space-between; padding:0 clamp(20px,5vw,72px); position:absolute; top:0; width:100%; z-index:5; }
.brand { align-items:center; display:flex; }
.brand img { aspect-ratio:1; background:var(--white); border-radius:50%; height:56px; object-fit:contain; padding:5px; width:56px; }
.main-nav { align-items:center; display:flex; gap:clamp(18px,3vw,42px); font-size:12px; font-weight:600; }
.main-nav a { opacity:.8; transition:opacity .2s; }
.main-nav a:hover,.main-nav a:focus-visible { opacity:1; }
.main-nav .nav-cta { border:1px solid rgba(255,255,255,.35); border-radius:100px; opacity:1; padding:10px 16px; }
.nav-cta span,.button span { font-size:18px; margin-left:8px; }
.menu-toggle { background:none; border:0; display:none; }
.hero { background:var(--ink); color:var(--white); display:grid; grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr); min-height:730px; padding:150px clamp(24px,7vw,112px) 72px; position:relative; }
.hero-content { align-self:center; max-width:600px; padding-bottom:30px; position:relative; z-index:1; }
.eyebrow { align-items:center; color:var(--muted); display:flex; font-size:10px; font-weight:800; gap:10px; letter-spacing:.16em; margin:0 0 22px; text-transform:uppercase; }
.hero .eyebrow,.contact-section .eyebrow { color:var(--mint); }
.eyebrow span { background:currentColor; display:block; height:5px; width:5px; }
.hero h1,.catalog-hero h1 { font-size:clamp(48px,6.5vw,91px); font-weight:500; letter-spacing:-.06em; line-height:.98; margin:0 0 26px; max-width:700px; }
.hero h1 em,.catalog-hero h1 em,h2 em { font-family:var(--serif); font-weight:400; letter-spacing:-.07em; }
.hero-copy { color:#aeb8b5; font-size:17px; max-width:430px; }
.hero-actions { align-items:center; display:flex; gap:28px; margin:36px 0 58px; }
.button { align-items:center; border:0; cursor:pointer; display:inline-flex; font-family:inherit; font-size:12px; font-weight:800; justify-content:center; padding:15px 19px; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--lime); color:var(--ink); }
.button-primary:hover { background:#e1ff90; }
.text-link { border-bottom:1px solid currentColor; font-size:12px; font-weight:700; padding-bottom:4px; }
.text-link span { font-size:18px; margin-left:8px; }
.hero-meta { border-top:1px solid #283034; display:flex; gap:60px; padding-top:21px; }
.hero-meta div { display:flex; flex-direction:column; }
.hero-meta strong { font-size:11px; }
.hero-meta span { color:#8d9996; font-size:11px; margin-top:4px; }
.hero-visual { align-self:center; justify-self:end; max-width:600px; position:relative; width:100%; z-index:1; }
.hero-image-wrap { height:520px; overflow:hidden; position:relative; }
.hero-image-wrap:after { background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.62)); content:''; inset:0; pointer-events:none; position:absolute; z-index:1; }
.hero-slides,.hero-slide { height:100%; inset:0; position:absolute; width:100%; }
.hero-slide { margin:0; opacity:0; transition:opacity .6s ease; }
.hero-slide.active { opacity:1; }
.hero-slide img { height:100%; object-fit:cover; width:100%; }
.image-note,.hero-slide figcaption { align-items:center; bottom:27px; color:#fff; display:flex; font-size:11px; gap:9px; left:26px; position:absolute; z-index:2; }
.pulse-dot { background:var(--lime); border-radius:50%; height:7px; width:7px; }
.carousel-control { background:rgba(9,12,14,.55); border:1px solid rgba(255,255,255,.5); border-radius:50%; color:#fff; cursor:pointer; height:38px; position:absolute; top:50%; transform:translateY(-50%); width:38px; z-index:3; }
.carousel-control:hover,.carousel-control:focus-visible { background:var(--lime); color:var(--ink); outline:none; }
.carousel-prev { left:16px; }
.carousel-next { right:16px; }
.hero-index { align-items:center; bottom:-26px; display:flex; font-size:10px; gap:10px; position:absolute; right:0; }
.hero-index i { background:var(--mint); display:block; height:1px; width:38px; }
.carousel-dots { display:flex; gap:6px; margin-left:10px; }
.carousel-dots button { background:#61706d; border:0; border-radius:50%; cursor:pointer; height:5px; padding:0; width:5px; }
.carousel-dots button.active { background:var(--lime); }
.marquee { background:var(--mint); overflow:hidden; padding:21px 0; }
.marquee-track { display:flex; gap:clamp(40px,9vw,140px); justify-content:center; min-width:max-content; }
.marquee span { font-size:12px; font-weight:800; letter-spacing:.15em; }
.section { padding:clamp(80px,10vw,145px) clamp(24px,8vw,128px); }
.solutions { background:var(--paper); }
.section-heading { display:grid; grid-template-columns:1fr 1.3fr .8fr; margin:0 auto 60px; max-width:1280px; }
.section-heading .eyebrow { grid-column:1/-1; }
.section-heading h2,.about h2,.contact-section h2,.catalog-content h2 { font-size:clamp(37px,4.2vw,62px); font-weight:500; letter-spacing:-.07em; line-height:1.02; margin:0; }
.section-heading>p:last-child { align-self:end; color:var(--muted); font-size:14px; margin:0; max-width:270px; }
.solution-grid { display:grid; gap:12px; grid-template-columns:repeat(3,1fr); margin:auto; max-width:1280px; }
.solution-card { min-height:295px; padding:27px; position:relative; transition:transform .3s; }
.solution-card:hover { transform:translateY(-5px); }
.card-dark { background:var(--ink); color:var(--white); }
.card-light { background:#fff; }
.card-accent { background:var(--lime); }
.card-number { font-size:11px; font-weight:700; opacity:.55; }
.card-icon { font-size:46px; font-weight:300; line-height:1; margin-top:50px; }
.solution-card h3 { font-size:21px; line-height:1.15; margin:19px 0 0; }
.card-arrow { bottom:26px; font-size:22px; position:absolute; right:27px; }
.about { align-items:center; background:#e5e9e6; display:grid; gap:clamp(45px,8vw,120px); grid-template-columns:minmax(250px,1fr) minmax(320px,1fr); }
.about-image { max-width:530px; position:relative; }
.about-image img { height:510px; object-fit:cover; width:100%; }
.vertical-label { background:var(--lime); bottom:26px; font-size:9px; font-weight:800; letter-spacing:.14em; padding:9px 13px; position:absolute; right:-35px; transform:rotate(-90deg); transform-origin:right bottom; }
.about-content { max-width:540px; }
.about-content h2 { margin-bottom:28px; }
.about-content p:not(.eyebrow) { color:var(--muted); font-size:14px; margin:0 0 16px; }
.about-content .text-link { display:inline-block; margin-top:18px; }
.contact-section { background:var(--ink); color:var(--white); padding:clamp(75px,10vw,135px) clamp(24px,8vw,128px); }
.contact-inner { display:grid; gap:80px; grid-template-columns:1fr 1fr; margin:auto; max-width:1280px; }
.contact-copy h2 { margin-bottom:25px; }
.contact-copy>p:not(.eyebrow) { color:#aeb8b5; font-size:14px; max-width:400px; }
.contact-details { border-top:1px solid #30383b; margin-top:45px; padding-top:25px; }
.contact-details a { align-items:flex-start; display:flex; font-size:12px; gap:15px; margin:0 0 20px; }
.contact-details small { color:#85908d; }
.detail-icon { color:var(--mint); font-size:22px; line-height:1; }
.contact-form { align-self:end; background:#fff; color:var(--ink); padding:clamp(25px,4vw,45px); }
.contact-form label { display:block; font-size:11px; font-weight:800; margin:0 0 8px; }
.contact-form input,.contact-form textarea { background:#f1f4f1; border:0; border-bottom:1px solid #cad3d0; font:inherit; margin:0 0 25px; padding:14px; width:100%; }
.contact-form input:focus,.contact-form textarea:focus { border-bottom-color:var(--ink); outline:0; }
.contact-form .button { width:100%; }
.form-note { color:var(--muted); font-size:10px; margin:14px 0 0; text-align:center; }
.site-footer { align-items:center; background:var(--ink); border-top:1px solid #283034; color:#aeb8b5; display:flex; flex-wrap:wrap; gap:22px; justify-content:space-between; padding:32px clamp(24px,8vw,128px); }
.site-footer .brand img { height:48px; width:48px; }
.site-footer p,.site-footer small { font-size:11px; }
.footer-links { display:flex; gap:20px; font-size:11px; font-weight:700; }
.footer-links a:hover { color:var(--mint); }
.site-credit a { color:var(--mint); font-weight:700; }
.site-credit a:hover { color:var(--lime); }
.catalog-page { background:var(--paper); }
.catalog-hero { background:var(--ink); color:var(--white); display:flex; justify-content:space-between; min-height:450px; padding:155px clamp(24px,8vw,128px) 70px; }
.catalog-hero h1 { font-size:clamp(46px,6vw,80px); max-width:700px; }
.catalog-hero>div:first-child>p:last-child { color:#aeb8b5; max-width:420px; }
.catalog-stamp { align-self:end; border:1px solid #4c5757; color:var(--mint); font-size:10px; letter-spacing:.15em; padding:17px; text-align:center; }
.catalog-stamp strong { color:var(--lime); font:54px var(--serif); letter-spacing:-.05em; }
.catalog-stamp span { color:#8d9996; font-size:8px; }
.catalog-content { margin:auto; max-width:1400px; padding:80px clamp(24px,8vw,128px); }
.catalog-toolbar { align-items:end; display:flex; justify-content:space-between; margin-bottom:42px; }
.catalog-toolbar h2 { font-size:34px; }
.filters { display:flex; gap:18px; }
.filter { background:transparent; border:0; border-bottom:1px solid transparent; color:var(--muted); cursor:pointer; font:700 11px var(--sans); padding:8px 0; }
.filter.active,.filter:hover { border-color:var(--ink); color:var(--ink); }
.product-grid { display:grid; gap:25px; grid-template-columns:repeat(4,1fr); }
.product-card { background:#fff; position:relative; }
.product-image { cursor:pointer; height:310px; overflow:hidden; position:relative; }
.product-image img { height:100%; object-fit:contain; transition:transform .5s; width:100%; }
.product-card:hover .product-image img { transform:scale(1.04); }
.product-image button { background:var(--white); border:0; border-radius:50%; bottom:15px; cursor:pointer; font-size:18px; height:40px; position:absolute; right:15px; width:40px; }
.product-info { padding:19px; }
.product-info small { color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.product-info h3 { font-size:16px; margin:6px 0 14px; }
.product-select { align-items:center; border-top:1px solid var(--line); display:flex; font-size:11px; gap:8px; padding-top:12px; }
.product-select input { accent-color:var(--ink); height:16px; width:16px; }
.catalog-bottom { align-items:center; border-top:1px solid var(--line); display:flex; justify-content:space-between; margin-top:65px; padding-top:22px; }
.catalog-bottom p { color:var(--muted); font-size:12px; margin:0; }
.catalog-bottom strong { color:var(--ink); font-size:18px; }
.whatsapp-selection:disabled { cursor:not-allowed; opacity:.45; }
.product-modal { align-items:center; display:flex; inset:0; justify-content:center; opacity:0; pointer-events:none; position:fixed; transition:opacity .25s; z-index:20; }
.product-modal.open { opacity:1; pointer-events:auto; }
.modal-backdrop { background:rgba(0,0,0,.75); inset:0; position:absolute; }
.modal-content { background:var(--paper); display:grid; grid-template-columns:1fr 1fr; max-width:800px; position:relative; width:calc(100% - 36px); z-index:1; }
.modal-content>img { height:420px; object-fit:contain; width:100%; }
.modal-content>div { align-self:center; padding:35px; }
.modal-content h2 { font-size:32px; line-height:1.05; margin:0 0 15px; }
.modal-content p:not(.eyebrow) { color:var(--muted); font-size:13px; }
.modal-close { background:var(--white); border:0; cursor:pointer; font-size:28px; height:38px; line-height:1; position:absolute; right:12px; top:12px; width:38px; z-index:2; }
.reveal { opacity:0; transform:translateY(18px); transition:opacity .7s ease,transform .7s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-delay { transition-delay:.18s; }
@media (max-width:800px) { .site-header { height:68px; padding:0 22px; } .menu-toggle { display:block; height:40px; padding:8px; width:42px; } .menu-toggle span { background:#fff; display:block; height:1px; margin:6px 0; } .main-nav { background:var(--ink); display:flex; flex-direction:column; gap:0; left:0; padding:12px 22px 24px; position:absolute; top:68px; transform:translateY(-150%); transition:transform .3s; width:100%; z-index:-1; } .main-nav.open { transform:translateY(0); } .main-nav a { border-bottom:1px solid #283034; padding:15px 0; width:100%; } .main-nav .nav-cta { border:0; border-bottom:1px solid #283034; border-radius:0; padding:15px 0; } .hero { display:block; min-height:auto; padding:130px 22px 90px; } .hero h1 { font-size:clamp(48px,14vw,70px); } .hero-actions { align-items:flex-start; flex-direction:column; gap:23px; margin:32px 0 45px; } .hero-meta { gap:22px; justify-content:space-between; } .hero-meta span { font-size:10px; } .hero-visual { margin:45px 0 20px; } .hero-image-wrap { height:390px; } .section { padding:78px 22px; } .section-heading { display:block; margin-bottom:38px; } .section-heading h2 { margin-bottom:25px; } .solution-grid { grid-template-columns:1fr; } .solution-card { min-height:230px; } .card-icon { margin-top:25px; } .about { display:block; padding:78px 22px; } .about-image { margin:0 22px 60px 0; } .about-image img { height:390px; } .vertical-label { right:-22px; } .contact-inner { display:block; } .contact-form { margin-top:55px; } .site-footer { align-items:flex-start; flex-direction:column; } .catalog-hero { display:block; min-height:0; padding:130px 22px 60px; } .catalog-stamp { display:inline-block; margin-top:40px; } .catalog-content { padding:65px 22px; } .catalog-toolbar { align-items:flex-start; display:block; } .catalog-toolbar h2 { font-size:31px; } .filters { flex-wrap:wrap; gap:12px 18px; margin-top:25px; } .product-grid { grid-template-columns:repeat(2,1fr); gap:12px; } .product-image { height:210px; } .product-info { padding:14px; } .product-info h3 { font-size:14px; } .catalog-bottom { align-items:stretch; flex-direction:column; gap:18px; } .whatsapp-selection { width:100%; } .modal-content { display:block; } .modal-content>img { height:280px; } .modal-content>div { padding:25px; } .modal-content h2 { font-size:27px; } }
@media (max-width:430px) { .hero-meta { display:block; } .hero-meta div+div { margin-top:13px; } .product-image { height:175px; } .product-info h3 { font-size:12px; } .product-select { font-size:10px; } }

/* Preserve the full product photo and keep the expanded catalog usable. */
.catalog-toolbar { flex-wrap:wrap; gap:24px; }
.filters { flex-wrap:wrap; }
.filter { font-size:14px; min-height:44px; }
.product-image { background:#e8e6e2; }
.modal-content { max-height:90vh; overflow:auto; }
.modal-gallery { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.modal-gallery[hidden] { display:none; }
.modal-gallery button { border:1px solid currentColor; padding:10px 14px; cursor:pointer; background:transparent; font:inherit; }
.modal-gallery button[aria-pressed="true"] { background:var(--ink); color:var(--paper); }