:root { --ink:#18352d; --muted:#68736d; --paper:#f7f4ed; --sand:#c9ad7e; --line:rgba(24,53,45,.15); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; }
main { overflow:hidden; }
.nav { max-width:1240px; margin:auto; padding:28px 42px; display:flex; align-items:center; }
.brand img { display:block; width:114px; height:92px; object-fit:contain; object-position:left center; }
.discover-link { color:var(--ink); font-size:13px; font-weight:600; letter-spacing:.03em; text-decoration:none; border-bottom:1px solid var(--sand); padding-bottom:4px; }
.hero { min-height:530px; max-width:1240px; margin:auto; padding:82px 42px 100px; position:relative; }
.hero::after { content:""; width:520px; height:520px; position:absolute; z-index:-1; border:1px solid rgba(201,173,126,.42); border-radius:50%; right:-170px; top:5px; box-shadow:0 0 0 55px rgba(201,173,126,.05),0 0 0 110px rgba(201,173,126,.04); }
.hero-mark { position:absolute; z-index:-1; width:358px; height:358px; border-radius:50%; right:-89px; top:86px; display:grid; place-items:center; padding:62px 37px; }
.hero-mark img { width:100%; max-height:100%; object-fit:contain; }
.eyebrow { color:#9a7a47; text-transform:uppercase; letter-spacing:.18em; font-size:11px; font-weight:700; margin:0 0 19px; }
h1,h2 { font-family:"Playfair Display",Georgia,serif; letter-spacing:-.045em; font-weight:600; margin:0; line-height:1.05; }
h1 { font-size:clamp(48px,6vw,82px); max-width:760px; }
h1 em,h2 em { color:#9a7a47; font-weight:600; }
.intro { max-width:470px; margin:29px 0 33px; color:var(--muted); font-size:17px; line-height:1.65; }
.actions { display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.channel-button { display:inline-flex; gap:9px; align-items:center; background:var(--ink); color:#fff; padding:14px 19px; font-size:14px; font-weight:600; text-decoration:none; border-radius:2px; transition:transform .2s,background .2s; }
.channel-button:hover { background:#275f4d; transform:translateY(-2px); }
.channel-icon { color:#d8bb86; font-size:19px; }
.outlets { background:#fff; padding:95px 42px 105px; }
.section-heading { max-width:1156px; margin:0 auto 48px; }
h2 { font-size:clamp(36px,4vw,57px); }
.logo-grid { max-width:1156px; margin:auto; display:grid; grid-template-columns:repeat(5,1fr); border-left:1px solid var(--line); border-top:1px solid var(--line); }
.logo-card { aspect-ratio:1.26; padding:18px; display:flex; align-items:center; justify-content:center; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }
.logo-card img { max-width:100%; max-height:88px; object-fit:contain; mix-blend-mode:multiply; transition:transform .25s; }
.logo-card:hover img { transform:scale(1.06); }
footer { max-width:1240px; margin:auto; padding:34px 42px 88px; display:grid; grid-template-columns:1fr auto; gap:22px; color:var(--muted); font-size:12px; }
.footer-contact { display:flex; flex-direction:column; gap:6px; }.footer-contact a { color:var(--ink); text-decoration:none; font-weight:600; }.socials { display:flex; gap:9px; }.socials a { height:31px; width:31px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--ink); text-transform:uppercase; text-decoration:none; font-size:10px; font-weight:700; }.socials a:hover { background:var(--ink); color:white; } footer p { grid-column:1/-1; margin:0; padding-top:11px; border-top:1px solid var(--line); }
.whatsapp { position:fixed; right:23px; bottom:23px; display:flex; align-items:center; gap:10px; background:#25d366; color:#073b22; padding:12px 17px 12px 12px; border-radius:999px; box-shadow:0 12px 28px rgba(0,0,0,.2); text-decoration:none; font-size:13px; font-weight:700; z-index:2; transition:transform .2s; }.whatsapp:hover { transform:translateY(-3px); }.whatsapp svg { width:28px; height:28px; color:white; }
@media (max-width:720px) { .nav { padding:20px 21px; }.brand img { width:96px; height:72px; }.hero { min-height:505px; padding:66px 21px 80px; }.hero::after { width:320px; height:320px; right:-175px; top:40px; }.hero-mark { width:225px; height:225px; right:-125px; top:87px; padding:38px 22px; }.intro { font-size:15px; }.outlets { padding:67px 21px; }.logo-grid { grid-template-columns:repeat(2,1fr); }.logo-card { padding:16px; }.logo-card img { max-height:75px; } footer { padding:27px 21px 84px; grid-template-columns:1fr; }.socials { grid-row:1; }.whatsapp span { display:none; }.whatsapp { padding:12px; right:17px; bottom:17px; } }