@font-face{font-family:Lato;font-style:italic;font-weight:300;font-display:swap;src:url(../fonts/lato-300-italic.woff2) format('woff2')}
@font-face{font-family:Lato;font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/lato-400-normal.woff2) format('woff2')}
@font-face{font-family:Lato;font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/lato-700-normal.woff2) format('woff2')}

:root{
  --ink:#1E1C1B;--text:#16181D;--paper:#F9F8F5;--stone:#7C7A77;--line:#E6E3DD;--btn:#000;--btn-text:#fff;
  --ph1:#E6E3DD;--ph2:#DEDAD3;--ph3:#D6D2CA;
  --dark-bg:#1E1C1B;--dark-text:#F9F8F5;--dark-sub:#C9C6C0;--dark-line:#3A3836;
  color-scheme:light;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --ink:#F9F8F5;--text:#E9E7E2;--paper:#141312;--stone:#9A9793;--line:#2A2826;--ph1:#2A2826;--ph2:#24221F;--ph3:#1F1D1B;
  --dark-bg:#000;--dark-sub:#B5B2AC;--dark-line:#2E2C2A;color-scheme:dark}}
:root[data-theme="dark"]{--ink:#F9F8F5;--text:#E9E7E2;--paper:#141312;--stone:#9A9793;--line:#2A2826;--ph1:#2A2826;--ph2:#24221F;--ph3:#1F1D1B;--dark-bg:#000;--dark-sub:#B5B2AC;--dark-line:#2E2C2A;color-scheme:dark}
*{box-sizing:border-box}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;background:var(--paper);color:var(--text);font:400 19px/1.7 Lato,'Segoe UI',system-ui,Arial,sans-serif}
h1,h2,h3{font-family:inherit;font-weight:700;line-height:1.15;letter-spacing:-.01em;color:var(--ink);margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
em{font-style:italic;font-weight:300;letter-spacing:0}
a{color:inherit}
.site-wrap{max-width:1240px;margin:0 auto;padding:0 48px}
.kicker{font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-bottom:20px;text-wrap:balance}
.site-button{display:inline-block;background:var(--btn);color:var(--btn-text);font:700 1rem/1 inherit;padding:18px 30px;border-radius:30px;text-decoration:none;border:2px solid var(--btn)}
.site-button:focus-visible,a:focus-visible{outline:3px solid var(--stone);outline-offset:3px}

.site-header .site-wrap{display:flex;justify-content:space-between;align-items:center;height:96px}
.logo{font-weight:700;letter-spacing:.18em;font-size:.85rem;color:var(--ink);text-decoration:none}
.site-nav{display:flex;gap:36px;font-size:.9rem}
.site-nav a{text-decoration:none}

.hero{padding:56px 0 0}
.hero-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.9fr);gap:96px;align-items:center}
.hero h1{font-size:3.8rem;margin-bottom:28px}
.hero .lead{font-size:1.15rem;max-width:38ch;margin-bottom:40px}
.photo{display:block;width:100%;height:auto;object-fit:cover}
.hero-img{aspect-ratio:4/5;border-radius:30px;object-position:50% 35%}
.services{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px;margin-top:96px;padding:48px 0 0;border-top:1px solid var(--line)}
.services>div{display:flex;flex-direction:column;align-items:flex-start}.services h3{font-size:1.5rem;margin-bottom:10px}.services a{margin-top:auto}
.services p{font-size:.95rem;margin-bottom:16px;max-width:26ch}
.services a{font-size:.9rem;font-weight:700;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}

.values{background:var(--dark-bg);color:var(--dark-text);padding:140px 0;margin-top:140px}
.values .site-wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:96px}
.values h2{color:var(--dark-text);font-size:3.4rem;margin-bottom:28px}
.values .intro{color:var(--dark-sub);max-width:34ch}
.values ul{list-style:none;margin:0;padding:0}
.values li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:32px;padding:36px 0;border-top:1px solid var(--dark-line)}
.values li:last-child{border-bottom:1px solid var(--dark-line)}
.values h3{color:var(--dark-text);font-size:1.5rem}
.values li p{color:var(--dark-sub)}

.about{padding:160px 0}
.about h2{font-size:3.4rem;margin-bottom:56px}
.about-img{aspect-ratio:16/9;border-radius:30px;margin-bottom:80px}
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 96px}
.about-grid p{margin-bottom:24px;max-width:34em}
.about .lead{font-size:1.25rem;font-weight:700;line-height:1.5;color:var(--ink);margin-bottom:28px}

.gallery{padding:0 0 200px}
.gallery .site-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:64px 48px}
.g2{grid-column:1/7;aspect-ratio:4/5}
.g3{grid-column:7/13;aspect-ratio:4/5;margin-top:160px}
.g4{grid-column:3/11;aspect-ratio:3/2}
.g2,.g4{background:var(--ph2)}.g3{background:var(--ph3)}

@media (max-width:900px){
  .site-wrap{padding:0 24px} .site-nav{display:none}
  .hero-top,.values .site-wrap,.about-grid{grid-template-columns:1fr;gap:48px}
  .services{grid-template-columns:1fr 1fr;gap:40px 24px}
  .hero h1{font-size:2.6rem}.values h2,.about h2{font-size:2.2rem}
  .values li{grid-template-columns:1fr;gap:6px}
  .gallery .site-wrap{gap:24px}.gallery .site-wrap>*{grid-column:1/13!important;margin-top:0!important}
}
.logo svg,.logo img{height:34px;width:auto;display:block}


.site-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:36px}
.site-nav li{margin:0}
.hero .lead,.about .lead{margin:0 0 40px}
.hero .lead p{margin:0}
.about .lead{margin-bottom:28px}
.about .lead p{margin:0}
.services .site-link{font-size:.9rem;font-weight:700;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;margin-top:auto}
.pencil-richtext>:last-child{margin-bottom:0}
@media (max-width:900px){.site-nav ul{display:none}}
.photo-frame{overflow:hidden}
.photo-frame img{display:block;width:100%;height:100%;object-fit:cover}
