
:root{
 --ink:#062f3d; --teal:#006d82; --teal2:#00a6ae; --paper:#f7f8f5;
 --line:#d8e0de; --serif:Georgia,'Times New Roman',serif; --sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:var(--sans)}
a{color:inherit;text-decoration:none} .wrap{width:min(1180px,92vw);margin:auto}
header{height:88px;background:rgba(255,255,255,.96);display:flex;align-items:center;position:sticky;top:0;z-index:50;border-bottom:1px solid #edf0ef}
.nav{display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.05em}
.brand-mark{width:58px;height:58px;position:relative}.brand-mark:before,.brand-mark:after{content:"";position:absolute;inset:8px 22px;border:2px solid var(--teal);border-radius:90% 10% 90% 10%;transform:rotate(45deg)}
.brand-mark:after{transform:rotate(135deg)}.brand b{display:block;font-size:20px;line-height:.95}.brand small{display:block;font-size:9px;letter-spacing:.22em;margin-top:7px}
nav{display:flex;gap:23px;font-size:13px}nav a{padding:10px 0;border-bottom:2px solid transparent}nav a:hover,nav a.active{border-color:var(--teal)}
.search{font-size:22px}
.hero{min-height:510px;position:relative;overflow:hidden;background:
linear-gradient(90deg,rgba(248,248,243,.98) 0%,rgba(248,248,243,.91) 34%,rgba(248,248,243,.40) 53%,rgba(0,0,0,.05) 100%),
url('https://upload.wikimedia.org/wikipedia/commons/e/ec/Flickr_-_Jo%C3%A3o_de_Deus_Medeiros_-_Qualea_grandiflora.jpg') center 44%/cover no-repeat}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 72%,rgba(0,30,38,.10));pointer-events:none}
.hero-grid{min-height:510px;display:grid;grid-template-columns:47% 53%;position:relative;z-index:2;align-items:center}
.hero-copy{padding:42px 0}.hero h1{font-family:var(--serif);font-size:76px;line-height:.82;margin:0 0 18px;letter-spacing:-.045em}.hero h1 em{font-style:normal;color:var(--teal)}
.kicker{letter-spacing:.38em;text-transform:uppercase;font-size:15px;margin:0 0 22px}.hero p{font-family:var(--serif);font-size:20px;line-height:1.35;max-width:500px}
.actions{display:flex;gap:14px;margin-top:25px}.btn{display:inline-flex;align-items:center;gap:12px;padding:15px 24px;border-radius:28px;border:1px solid var(--ink);font-weight:700}.btn.primary{background:var(--teal);color:#fff;border-color:var(--teal)}
.hero-note{align-self:start;justify-self:end;margin-top:70px;width:185px;color:#fff;text-transform:uppercase;letter-spacing:.14em;line-height:1.45;font-size:12px;text-shadow:0 1px 4px #000}
.hero-id{position:absolute;right:5%;bottom:26px;color:#fff;font-family:var(--serif);font-size:13px;text-align:right;z-index:3}
.explore{padding:55px 0 20px;background:linear-gradient(#fff,#fbfcfb)}.explore-grid{display:grid;grid-template-columns:35% 65%;align-items:center;gap:25px}
.eyebrow{color:var(--teal);font-weight:800;letter-spacing:.26em;text-transform:uppercase;font-size:13px}.section-title{font:700 44px/1 var(--serif);margin:18px 0}.lead{font:18px/1.45 var(--serif);max-width:430px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}.stat b{font-size:24px}.stat span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;margin-top:5px}
.wheel-wrap{min-height:650px;display:grid;place-items:center}.wheel{width:600px;height:600px;border-radius:50%;position:relative;background:conic-gradient(#f4f5f2 0 30deg,#dceac8 30deg 60deg,#ffe3a0 60deg 90deg,#f79c4c 90deg 120deg,#f6a3ae 120deg 150deg,#e99bc6 150deg 180deg,#b7a0db 180deg 210deg,#9a9bd9 210deg 240deg,#75b9e8 240deg 270deg,#65c5e8 270deg 300deg,#82d6e4 300deg 330deg,#68c7c4 330deg 360deg);box-shadow:0 22px 45px #7893a34d;border:1px solid #d5dddb}
.wheel:before{content:"";position:absolute;inset:22%;border-radius:50%;background:#eef1ef;border:18px solid #dfe5e4;box-shadow:inset 0 0 0 1px #bcc9c8,0 5px 18px #506d7a33;z-index:2}
.wheel-center{position:absolute;inset:31%;border-radius:50%;background:white;display:grid;place-items:center;text-align:center;z-index:3;box-shadow:0 5px 20px #38596822}.wheel-center strong{font-size:22px}.wheel-center small{display:block;letter-spacing:.3em;font-size:9px;margin-top:12px}
.wedge{position:absolute;left:50%;top:50%;width:112px;text-align:center;z-index:4;transform:translate(-50%,-50%) rotate(var(--a)) translateY(-235px) rotate(calc(-1 * var(--a)));font-size:11px;font-weight:800;text-transform:uppercase}.wedge i{display:block;font:normal 24px var(--serif);color:var(--teal);margin-bottom:6px}.wedge span{display:block;font-size:8px;font-weight:400;text-transform:none;margin-top:4px}
.editorial{padding:18px 0 45px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{border:1px solid #e2e6e4;border-radius:10px;overflow:hidden;background:#fff;box-shadow:0 8px 20px #4a667010}.thumb{height:145px;background:linear-gradient(145deg,#f4d24c,#758a43)}.card:nth-child(2) .thumb{background:linear-gradient(145deg,#b4589e,#e7a8c7)}.card:nth-child(3) .thumb{background:linear-gradient(145deg,#f2f0e0,#8fa34f)}.card:nth-child(4) .thumb{background:linear-gradient(145deg,#9e7958,#4d6c58)}
.card-body{padding:18px}.card small{color:var(--teal);font-weight:800;text-transform:uppercase;letter-spacing:.1em}.card h3{font:700 20px/1.05 var(--serif);margin:8px 0}.card p{font-size:12px;line-height:1.45}
.landscape{min-height:300px;display:grid;place-items:center;text-align:center;
background:linear-gradient(rgba(255,235,205,.30),rgba(4,44,54,.22)),
url('https://upload.wikimedia.org/wikipedia/commons/2/22/Cerrado_landscape.jpg') center 58%/cover no-repeat;
font-family:var(--serif);color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.65)}.landscape blockquote{font-size:27px;font-style:italic;max-width:650px;margin:auto}.landscape small{letter-spacing:.25em;text-transform:uppercase}
footer{background:#003e50;color:#fff;padding:42px 0 24px}.footer-grid{display:grid;grid-template-columns:1.2fr 1.7fr .8fr;gap:40px;align-items:center}.newsletter input{width:75%;padding:13px;border-radius:22px 0 0 22px;border:0}.newsletter button{padding:13px 18px;border:0;border-radius:0 22px 22px 0;background:#0a7f99;color:#fff}.footer-bottom{border-top:1px solid #ffffff33;margin-top:30px;padding-top:18px;display:flex;justify-content:space-between;font-size:11px}
.species-page{padding:70px 0}.species-page h1{font:700 60px/1 var(--serif);margin:12px 0}.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:35px 0}.fact{padding:22px;border:1px solid var(--line);border-radius:10px}.fact small{display:block;color:var(--teal);text-transform:uppercase;font-weight:800;margin-bottom:8px}
@media(max-width:900px){nav{display:none}.hero-grid,.explore-grid{grid-template-columns:1fr}.hero{background:linear-gradient(180deg,#f8f8f3 0 64%,#879587 100%)}.hero-grid{min-height:620px}.hero h1{font-size:58px}.hero-note,.hero-id{display:none}.wheel-wrap{min-height:530px}.wheel{width:480px;height:480px}.wedge{transform:translate(-50%,-50%) rotate(var(--a)) translateY(-188px) rotate(calc(-1 * var(--a)))}.cards{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr}.facts{grid-template-columns:1fr 1fr}}
@media(max-width:560px){header{height:74px}.brand-mark{width:44px;height:44px}.hero h1{font-size:48px}.hero p{font-size:17px}.actions{flex-direction:column;align-items:flex-start}.wheel-wrap{min-height:auto}.wheel{width:92vw;height:92vw}.wedge{display:none}.wheel:after{content:"No celular, as 12 categorias são apresentadas abaixo.";position:absolute;inset:40% 10%;z-index:5;text-align:center;font-size:12px}.stats,.cards,.facts{grid-template-columns:1fr}.section-title{font-size:38px}.footer-bottom{flex-direction:column;gap:10px}}

.card .thumb{background-size:cover;background-position:center}
.card:nth-child(1) .thumb{background-image:url('https://upload.wikimedia.org/wikipedia/commons/e/ec/Flickr_-_Jo%C3%A3o_de_Deus_Medeiros_-_Qualea_grandiflora.jpg')}
.card:nth-child(2) .thumb{background-image:url('https://upload.wikimedia.org/wikipedia/commons/2/27/Flores_do_cerrado.jpg')}
.card:nth-child(3) .thumb{background-image:url('https://upload.wikimedia.org/wikipedia/commons/2/27/Flores_do_cerrado.jpg');background-position:center 35%}
.card:nth-child(4) .thumb{background-image:url('https://upload.wikimedia.org/wikipedia/commons/2/22/Cerrado_landscape.jpg')}
.photo-credit{font-size:10px;line-height:1.4;opacity:.85}
.credits{background:#f4f7f6;padding:18px 0;color:#34535c;font-size:10px}
.credits a{text-decoration:underline}
