@font-face{font-family:"DejaVu Sans";src:url("../images/small-triumph/DejaVuSans.ttf") format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:"DejaVu Sans";src:url("../images/small-triumph/DejaVuSans-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:"DejaVu Serif";src:url("../images/small-triumph/DejaVuSerif-Bold.ttf") format("truetype");font-weight:700;font-display:swap}
:root{--forest:#123f35;--orange:#ee551b;--ivory:#faf7ee;--ink:#172d27;--muted:#52635b}
*{box-sizing:border-box}
html{scroll-padding-top:2rem}
body{margin:0;background:var(--ivory);color:var(--ink);font:1.125rem/1.6 "DejaVu Sans",Arial,sans-serif}
a{color:var(--forest);text-underline-offset:.25em}
a:focus-visible{outline:3px solid var(--forest);outline-offset:6px}
.shell{width:min(1120px,calc(100% - 48px));margin-inline:auto}
.skip-link{position:absolute;left:24px;top:-100px;background:var(--forest);color:var(--ivory);padding:16px;z-index:2}
.skip-link:focus{top:8px}
.site-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-block:32px;border-bottom:1px solid #d7ddd5}
.brand{padding:24px;text-decoration:none}
.brand img{display:block;width:320px;max-width:100%;height:auto}
.site-header nav{display:flex;flex-wrap:wrap;gap:8px}
.site-header nav a{display:inline-block;padding:12px 8px;font-size:1rem}
.lang-menu{position:relative}
.lang-menu summary{cursor:pointer;list-style:none;padding:10px 12px;border:1px solid #d7ddd5;border-radius:999px;font-size:.875rem;font-weight:700}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary:focus-visible{outline:3px solid var(--forest);outline-offset:4px}
.lang-grid{position:absolute;right:0;top:calc(100% + 8px);z-index:3;min-width:192px;max-width:calc(100vw - 32px);display:grid;grid-template-columns:repeat(2,1fr);gap:4px;padding:8px;background:var(--ivory);border:1px solid #d7ddd5;border-radius:12px;box-shadow:0 8px 24px #172d271a}
.lang-grid a{padding:10px;text-align:center;border-radius:6px;text-decoration:none;font-size:.875rem;font-weight:700}
.lang-grid a:hover,.lang-grid a[aria-current]{background:#e9ede5;color:var(--forest)}
.hero{padding-block:96px 80px}
h1,h2,h3{font-family:"DejaVu Serif",Georgia,serif;font-weight:700;line-height:1.2;color:var(--forest);letter-spacing:-.025em}
h1{font-size:3rem;line-height:1.1;max-width:22ch;margin:0 0 32px}
h1:after{content:"";display:block;width:64px;height:6px;background:var(--orange);border-radius:8px;margin-top:32px}
.lead{max-width:66ch;margin:0 0 32px}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px}
.button{display:inline-flex;gap:16px;padding:16px 24px;border-radius:8px;background:var(--forest);color:var(--ivory);text-decoration:none;font-size:1rem;font-weight:700}
.contact-link{padding:12px 0;font-size:1rem;font-weight:700}
h2{font-size:1.75rem;margin:0 0 32px}
h3{font-size:1.5rem;margin:0 0 16px}
.expertise{padding-block:48px 80px}
.expertise-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.expertise-card{padding-block:32px;border-top:1px solid #c2cbc2}
p{max-width:66ch;margin:0 0 16px}
.studio-section{padding-block:48px 80px;border-top:1px solid #d7ddd5}
.contact-email{display:inline-block;padding-block:12px;font-weight:700;overflow-wrap:anywhere}
.studio-section p .contact-email{display:inline;padding-block:0}
.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;border-top:1px solid #d7ddd5;padding-block:32px;font-size:.875rem}
.site-footer a{padding-block:8px}
@media(max-width:860px){.expertise-grid{grid-template-columns:1fr;gap:0}}
@media(max-width:640px){
.shell{width:calc(100% - 32px)}
.site-header{padding-block:24px;gap:8px}
.lang-menu{margin-left:auto}
.site-header .site-nav{gap:4px}
.site-header .site-nav a{padding:12px 4px;font-size:.875rem}
.brand{padding:24px 16px}.brand img{width:280px;min-width:240px}
.hero{padding-block:56px 48px}
h1{font-size:2rem;line-height:1.15}
body{font-size:1rem}
.expertise,.studio-section{padding-block:32px 48px}
.expertise-card{padding-block:24px}
h2{font-size:1.5rem}
}

.studio-media img { max-width: 100%; height: auto; }
.studio-media figure { margin: 0 0 24px; }
.studio-media .gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 24px; }