/*
Theme Name: Negrinho do Pastoreio
Description: Tema institucional do Instituto Piquete Negrinho do Pastoreio.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: negrinho-pastoreio
*/
:root{--green:#1c352a;--cream:#f7f2e8;--gold:#eac481;--ink:#252a22;--red:#8d362c}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font:17px/1.65 system-ui,sans-serif}
a{color:inherit;text-underline-offset:.22em}
a:focus-visible{outline:3px solid #b76535;outline-offset:5px}
img{max-width:100%;height:auto;display:block}
figure{margin:0}
.wrap{width:min(1160px,calc(100% - 64px));margin-inline:auto}
.skip{position:absolute;left:12px;top:-100px;background:white;padding:8px;z-index:10}
.skip:focus{top:12px}
.top{background:var(--green);color:var(--cream);border-top:4px solid var(--gold)}
.top-inner,.footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:24px}
.top-inner{min-height:88px;padding:14px 0}
.brand{display:flex;align-items:center;gap:13px;font:bold 21px Georgia,serif;text-decoration:none}
.brand img{border-radius:50%;width:48px;height:48px;object-fit:contain;background:white}
.brand small{display:block;font:600 11px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.16em;color:var(--gold);margin-top:3px}
nav{display:flex;flex-wrap:wrap;gap:22px;font-size:14px}
nav a{text-decoration:none}
nav a:hover{text-decoration:underline}
.hero{position:relative;isolation:isolate;min-height:610px;display:grid;align-items:center;background:#302419;color:white}
.hero-photo,.hero::after{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero-photo{object-fit:cover;object-position:center 46%}
.hero::after{content:"";background:linear-gradient(90deg,rgba(20,22,14,.95),rgba(20,22,14,.77) 40%,rgba(20,22,14,.08))}
.hero-copy{padding-block:80px}
.eyebrow{color:var(--red);font-weight:750;font-size:12px;text-transform:uppercase;letter-spacing:.17em}
.hero .eyebrow,.contact .eyebrow{color:var(--gold)}
h1,h2,h3{font-family:Georgia,serif;line-height:1.05;margin:0 0 .45em}
h1{font-size:clamp(46px,8vw,100px);letter-spacing:-.055em}
.hero h1{max-width:690px;text-wrap:balance}
.hero-copy>p:not(.eyebrow){max-width:470px;font-size:19px}
.button{display:inline-flex;align-items:center;gap:16px;background:var(--gold);color:#231e15;padding:13px 19px;text-decoration:none;font-weight:700;margin-top:10px}
.button:hover{background:#f4d7a4}
h2{font-size:clamp(38px,5vw,66px);letter-spacing:-.045em}
.section{padding-block:clamp(54px,8vw,112px)}
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(25px,8vw,105px);align-items:start}
.portrait{justify-self:center;width:min(100%,320px);border:1px solid #dacbb5;background:#fffaf0}
.portrait img{width:100%;aspect-ratio:1/1;object-fit:cover;object-position:top}
figcaption{padding:12px 16px}
.history{background:#ebe1cf}
.flag{margin-top:28px;aspect-ratio:1.55;object-fit:cover}
.story p:first-child{margin-top:0}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.gallery figure,.card{display:block;background:#eee4d3;text-decoration:none}
.gallery img{width:100%;aspect-ratio:1.55;object-fit:cover}
.gallery h3{padding:16px;margin:0}
.contact{background:var(--green);color:var(--cream)}
address{font-style:normal}
.footer{background:#14251e;color:var(--cream);padding-block:24px;font-size:14px}
.entry{max-width:900px;margin-bottom:44px}
@media(max-width:700px){.wrap{width:calc(100% - 36px)}.top-inner,.footer .wrap{align-items:flex-start;flex-direction:column;gap:12px}.hero{min-height:480px}.hero::after{background:rgba(20,22,14,.7)}.split,.gallery{grid-template-columns:1fr}.portrait{justify-self:start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}