/* Nikhil Mudgal Structural Engineering · site stylesheet · brand guidelines v1.0 */
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/AlegreyaSans-Regular.ttf) format("truetype")}
@font-face{font-family:"Alegreya Sans";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/AlegreyaSans-Italic.ttf) format("truetype")}
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/AlegreyaSans-Medium.ttf) format("truetype")}
@font-face{font-family:"Alegreya Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/AlegreyaSans-Bold.ttf) format("truetype")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/IBMPlexMono-Regular.ttf) format("truetype")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/IBMPlexMono-Medium.ttf) format("truetype")}

:root{--paper:#F4F1EB;--graphite:#2A2A28;--concrete:#DCD8D0;--cement:#9C978E;--ochre:#A65E2E;--line:#DCD8D0;--ink:#2A2A28;--mute:#6E6A63;--sans:"Alegreya Sans",Georgia,sans-serif;--mono:"IBM Plex Mono",Consolas,monospace}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.55 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0;line-height:1.1;text-wrap:balance;font-weight:700}
h1{font-size:clamp(34px,5.2vw,64px)}
h2{font-size:clamp(26px,3.4vw,40px)}
h3{font-size:22px}
h4{font-size:17px}
p{margin:0}
ul,ol{margin:0;padding-left:20px}
li{margin-bottom:5px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.lab{font:500 12px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ochre)}
.mono{font-family:var(--mono)}
.mute{color:var(--mute)}
.wrap{max-width:1200px;margin:0 auto;padding-inline:20px}
.btn{display:inline-block;background:var(--graphite);color:var(--paper);padding:12px 20px;text-decoration:none;font:500 17px var(--sans);border:1px solid var(--graphite);cursor:pointer}
.btn.ghost{background:transparent;color:var(--graphite)}
.btn.wa{background:var(--ochre);border-color:var(--ochre);color:#fff}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--ochre);outline-offset:2px}

.site-header{background:var(--paper);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-block:14px;flex-wrap:wrap}
.site-logo{width:min(300px,60vw);display:block}
.site-logo img{width:100%;height:auto}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 22px;font-size:16px;align-items:center}
.site-nav a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.site-nav a.on{border-bottom-color:var(--ochre)}
.site-nav a.cta{background:var(--graphite);color:var(--paper);padding:8px 14px;border:1px solid var(--graphite)}
.nav-toggle{display:none;background:none;border:1px solid var(--graphite);padding:8px 12px;font:500 15px var(--sans);cursor:pointer;color:var(--ink)}
@media (max-width:820px){.nav-toggle{display:inline-block}.site-nav{width:100%;display:none}.site-nav.open{display:block}.site-nav ul{flex-direction:column;align-items:flex-start;gap:8px;padding-block:8px}}

section,.section{padding-block:56px;border-bottom:1px solid var(--line)}
.section.tight{padding-block:36px}
.g{display:grid;gap:24px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.hero{padding-block:64px 56px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end}
@media (max-width:860px){.hero{grid-template-columns:1fr}}
.hero .lead{font-size:19px;max-width:56ch}
.media{background:var(--concrete);overflow:hidden;min-height:200px}
.media img{width:100%;height:100%;object-fit:cover}
.ph{background:var(--concrete);background-image:repeating-linear-gradient(45deg,rgba(42,42,40,.12) 0 1px,transparent 1px 9px);display:flex;align-items:flex-end;padding:14px;font:400 11px/1.4 var(--mono);color:#5B564E;letter-spacing:.06em;text-transform:uppercase;min-height:200px;height:100%}
.stat{border-top:1px solid var(--graphite);padding-top:12px}
.stat b{font:700 40px/1 var(--sans);display:block;color:var(--ochre)}
.stat span{font-size:14px}
.card{background:#fff;border:1px solid var(--line);padding:22px;display:grid;gap:10px;text-decoration:none;color:inherit;align-content:start}
.card .media{min-height:170px;aspect-ratio:3/2}
.card h4{font-size:19px}
.card .meta{font:400 12px/1.5 var(--mono);color:var(--mute)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-size:16px;margin:0}
.kv dt{font:400 11px/1.9 var(--mono);color:var(--mute);letter-spacing:.06em;text-transform:uppercase}
.kv dd{margin:0}
table{border-collapse:collapse;width:100%;font-size:15px;background:#fff}
th{font:500 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;text-align:left;color:var(--mute);padding:10px;border-bottom:1px solid var(--graphite)}
td{padding:10px;border-bottom:1px solid var(--line);vertical-align:top}
.tbl{overflow-x:auto}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.filters select{font:15px var(--sans);padding:8px 10px;border:1px solid var(--graphite);background:#fff;color:var(--ink)}
.filters label{font:400 11px/1 var(--mono);color:var(--mute);letter-spacing:.06em;text-transform:uppercase;margin-right:4px}
.tabs{display:flex;border-bottom:1px solid var(--graphite);flex-wrap:wrap}
.tabs button{font:500 15px var(--sans);background:none;border:0;border-bottom:3px solid transparent;padding:10px 16px;cursor:pointer;color:var(--ink)}
.tabs button.on{border-bottom-color:var(--ochre)}
.note{border-left:4px solid var(--ochre);padding-left:14px;font-size:15px;color:#4A4741;max-width:70ch}
.hatchband{background-image:repeating-linear-gradient(45deg,rgba(42,42,40,.14) 0 1px,transparent 1px 9px);height:14px}
.prose{max-width:66ch}
.prose p{margin-bottom:1em}
.prose h2,.prose h3{margin:1.4em 0 .5em}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.gallery figure{margin:0;background:var(--concrete)}
.gallery figcaption{font:400 12px/1.5 var(--mono);color:var(--mute);padding:6px 0}
.icon{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

form.lead{display:grid;gap:12px;background:#fff;border:1px solid var(--line);padding:24px}
form.lead label{display:grid;gap:4px;font-size:14px}
form.lead input,form.lead select,form.lead textarea{font:16px var(--sans);padding:10px;border:1px solid var(--cement);background:#fff;width:100%}
.hp{position:absolute;left:-9999px}

.site-footer{background:var(--graphite);color:var(--paper);padding-block:44px}
.site-footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px;font-size:15px}
.site-footer .logo{width:260px}
.site-footer a{color:inherit}
.site-footer .strip{grid-column:1/-1;border-top:1px solid #6E6A63;padding-top:12px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font:400 11px/1.5 var(--mono);color:#C9C2B6}

@media (max-width:720px){section,.section{padding-block:40px}}
@media print{.site-header,.site-footer,.filters,.btn{display:none}}