:root {
  --ink:#21342a; --forest:#173328; --deep:#11271e; --paper:#faf8f2;
  --warm:#f1eee6; --mist:#e9ebe6; --line:#cbd1c8; --muted:#63736a;
  --copper:#9e754e; --serif:'Prata',Georgia,serif; --sans:'Manrope',Arial,sans-serif;
}
* { box-sizing:border-box; }
html { scroll-padding-top:88px; }
body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.65 var(--sans); }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { display:block; max-width:100%; }
figure { margin:0; }
.container { width:min(calc(100% - 64px),1300px); margin-inline:auto; }
.skip-link { position:absolute; top:-80px; left:15px; z-index:100; background:white; padding:12px 18px; }
.skip-link:focus { top:15px; }
:focus-visible { outline:2px solid var(--copper); outline-offset:4px; }

.site-header { height:78px; background:rgba(250,248,242,.96); border-bottom:1px solid #d9ddd4; position:sticky; top:0; z-index:20; backdrop-filter:blur(14px); }
.header-inner { height:100%; display:flex; align-items:center; gap:36px; }
.brand { display:inline-flex; align-items:center; gap:11px; white-space:nowrap; font-size:14px; font-weight:700; letter-spacing:.14em; line-height:1; }
.brand em { font-style:normal; font-weight:400; }
.brand-mark { width:31px; display:grid; gap:4px; }
.brand-mark i { height:7px; border:1.5px solid currentColor; display:block; }
.brand-mark i:last-child { height:12px; position:relative; }
.brand-mark i:last-child:before { content:""; position:absolute; inset:0 auto 0 50%; border-left:1px solid currentColor; }
.nav { margin-left:auto; display:flex; align-items:center; gap:25px; }
.nav a,.header-phone { font-size:11px; font-weight:700; letter-spacing:.02em; }
.nav a:hover,.header-phone:hover,.text-link:hover { color:var(--copper); }
.header-phone { padding-left:24px; border-left:1px solid var(--line); white-space:nowrap; }
.header-phone span { padding-left:5px; }
.menu-toggle { display:none; }

.hero { background:var(--warm); padding-top:80px; }
.hero-copy { padding-bottom:55px; }
.eyebrow,.section-kicker { display:flex; align-items:center; gap:13px; margin:0 0 30px; color:#697a6c; font-size:10px; font-weight:700; line-height:1.45; letter-spacing:.17em; text-transform:uppercase; }
.eyebrow-line { width:35px; height:1px; background:currentColor; }
h1,h2 { font-family:var(--serif); font-weight:400; letter-spacing:-.045em; }
.hero h1 { max-width:1100px; margin:0; font-size:clamp(49px,5.6vw,82px); line-height:1.17; }
.hero h1 span { color:#718879; }
.hero-lead { max-width:730px; margin:31px 0 34px; font-size:19px; line-height:1.7; }
.hero-actions { display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:28px; min-height:56px; padding:0 26px; font-size:12px; font-weight:700; transition:background .2s,transform .2s; }
.button:hover { transform:translateY(-2px); }
.button span { font-size:21px; font-weight:400; }
.button-dark { background:var(--forest); color:#fff; }
.button-dark:hover { background:#30503b; }
.text-link { display:inline-flex; gap:20px; border-bottom:1px solid currentColor; padding-bottom:4px; font-size:12px; font-weight:700; }
.hero-location { margin:45px 0 0; color:#7d887e; font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.hero-location span { padding-inline:9px; }
.hero-figure { width:min(calc(100% - 64px),1380px); margin-inline:auto; border:1px solid #c8d1c5; border-bottom:0; }
.hero-photo { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.drawing-viewport { overflow:hidden; background:#e9ebe6; }
.hero-figure img { width:100%; height:auto; }
.figure-caption { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:17px 24px; border-top:1px solid #cad2c8; color:#697b6e; background:#eef0e9; font-size:10px; line-height:1.5; }
.figure-caption span:first-child { font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--ink); white-space:nowrap; }
.concept-figure { margin-top:55px; border:1px solid #c8d1c5; }
.concept-figure img { width:100%; height:auto; }

.section-pad { padding:118px 0; }
h2 { font-size:clamp(38px,4vw,59px); line-height:1.22; margin:0; }
h2 em { color:#839786; font-style:normal; }
.concept-grid { display:grid; grid-template-columns:43% 1fr; gap:8%; }
.prose-large { padding-top:52px; }
.prose-large p { margin:0 0 24px; font-size:21px; line-height:1.58; }
.prose-large .small-copy { font-size:14px; line-height:1.75; color:var(--muted); }
.prose-large a,.spec-note a { text-decoration:underline; text-underline-offset:3px; }
.use-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:63px; }
.use-grid div { padding:30px 28px 28px 0; }
.use-grid div+div { border-left:1px solid var(--line); padding-left:28px; }
.use-grid span { display:block; margin-bottom:34px; color:#859383; font-size:10px; font-weight:700; letter-spacing:.14em; }
.use-grid strong { display:block; margin-bottom:8px; font:400 26px/1.25 var(--serif); }
.use-grid p { max-width:285px; margin:0; color:var(--muted); font-size:13px; }

.plan-section { background:#eff1eb; }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:60px; }
.section-heading>p { max-width:430px; margin:0 0 6px; color:var(--muted); font-size:15px; line-height:1.8; }
.plan-layout { display:grid; grid-template-columns:minmax(0,3.2fr) minmax(230px,1fr); gap:50px; align-items:start; margin-top:56px; }
.plan-figure { border:1px solid #c8d1c5; }
.plan-figure img { width:100%; height:auto; }
.plan-notes { border-top:1px solid #b9c6b9; }
.plan-notes>div { display:grid; grid-template-columns:34px 1fr; gap:14px; padding:23px 0; border-bottom:1px solid #cbd4c9; }
.plan-notes b { color:var(--copper); font-size:11px; }
.plan-notes p { margin:0; color:#53675b; font-size:13px; line-height:1.72; }
.plan-notes>a { display:block; margin-top:26px; font-size:11px; font-weight:700; text-decoration:underline; text-underline-offset:4px; }

.engineering { color:#f5f4eb; background:var(--deep); }
.engineering-grid { display:grid; grid-template-columns:39% 1fr; gap:10%; }
.engineering .section-kicker { color:#a7bbaa; }
.engineering-heading { position:sticky; top:116px; align-self:start; }
.engineering-heading>p:not(.section-kicker) { max-width:430px; margin:28px 0 0; color:#afc0b2; font-size:15px; line-height:1.75; }
.spec-list { border-top:1px solid #4e6555; }
.spec-item { display:grid; grid-template-columns:48px 1fr; gap:15px; border-bottom:1px solid #4e6555; padding:25px 0 27px; }
.spec-item>span { color:#b39a73; font-size:11px; font-weight:700; padding-top:4px; }
.spec-item h3 { margin:0 0 7px; font-size:16px; font-weight:700; line-height:1.4; }
.spec-item p { max-width:600px; margin:0; color:#b7c7b9; font-size:13px; line-height:1.78; }
.spec-note { margin:26px 0 0; color:#aab9ab; font-size:11px; line-height:1.8; }

.process { background:var(--paper); }
.process-grid { display:grid; grid-template-columns:1fr 1fr; gap:11%; }
.process-grid>div>p:not(.section-kicker) { max-width:480px; margin:29px 0 0; color:var(--muted); font-size:15px; line-height:1.78; }
.process-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.process-list li { display:grid; grid-template-columns:50px 1fr; gap:14px; padding:26px 0; border-bottom:1px solid var(--line); }
.process-list li>span { color:var(--copper); font-size:11px; font-weight:700; }
.process-list h3 { margin:0 0 7px; font:400 20px/1.35 var(--serif); }
.process-list p { margin:0; color:var(--muted); font-size:13px; }

.journal { background:#e9ede7; }
.journal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid #c7d0c5; background:#c7d0c5; margin-top:57px; }
.journal-grid a { min-height:245px; display:flex; flex-direction:column; padding:27px 29px; background:#eff2eb; transition:background .2s; }
.journal-grid a:hover { background:#f7f8f2; }
.journal-grid a>span { color:#6d8472; font-size:10px; font-weight:700; letter-spacing:.15em; }
.journal-grid h3 { max-width:360px; margin:37px 0 auto; font:400 21px/1.38 var(--serif); letter-spacing:-.02em; }
.journal-grid strong { margin-top:26px; font-size:11px; }

.faq { background:var(--paper); }
.faq-grid { display:grid; grid-template-columns:36% 1fr; gap:10%; }
.faq-list { border-top:1px solid var(--line); }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { position:relative; padding:23px 39px 23px 0; font-size:16px; font-weight:700; line-height:1.5; cursor:pointer; list-style:none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary:after { content:'+'; position:absolute; right:4px; top:19px; color:#849887; font-size:24px; font-weight:400; }
.faq details[open] summary:after { content:'−'; }
.faq details p { max-width:620px; margin:0 0 24px; color:var(--muted); font-size:13px; line-height:1.78; }

.contact { padding:105px 0; color:white; background:var(--forest); }
.contact-grid { display:grid; grid-template-columns:1fr 380px; gap:9%; }
.contact .section-kicker { color:#b6c5b4; }
.contact h2 { max-width:650px; }
.contact p:not(.section-kicker) { max-width:550px; margin:27px 0 0; color:#c0d0c1; font-size:15px; }
.contact-action { display:flex; flex-direction:column; align-items:start; justify-content:center; border-left:1px solid #496b55; padding-left:45px; }
.contact-action>span { color:#aabcab; font-size:10px; font-weight:700; letter-spacing:.15em; }
.contact-number { margin:16px 0 22px; font:400 33px/1.3 var(--serif); white-space:nowrap; }
.contact-number:hover { color:#dce9d7; }
.button-light { min-width:210px; background:#e8eee4; color:var(--forest); }
.button-light:hover { background:white; }
.footer { color:#d5e0d5; background:#10251b; }
.footer-main { display:grid; grid-template-columns:1fr 1fr 1fr; gap:30px; align-items:start; padding:59px 0; }
.footer-main p { margin:0; color:#a4b5a5; font-size:13px; }
.footer-main>a:last-child { text-align:right; font-size:13px; font-weight:700; }
.footer-bottom { display:flex; align-items:center; gap:20px; border-top:1px solid #385444; padding:23px 0; color:#879d8a; font-size:10px; }
.footer-bottom span:nth-child(2) { margin:auto; }
.footer-bottom a { white-space:nowrap; }

/* Article pages share the same header, type and footer. */
.article-shell { width:min(calc(100% - 40px),810px); margin-inline:auto; }
.article-hero { padding:70px 0 76px; background:#e9ede7; }
.article-back { display:inline-block; margin-bottom:46px; font-size:12px; font-weight:700; }
.article-back:hover { color:var(--copper); }
.article-hero .section-kicker { margin-bottom:21px; }
.article-hero h1 { margin:0; font-size:clamp(40px,4.9vw,65px); line-height:1.23; }
.article-lead { max-width:760px; margin:28px 0 0; color:#596c5e; font-size:18px; line-height:1.7; }
.article-body { padding-top:65px; padding-bottom:105px; color:#4f6155; font-size:16px; line-height:1.85; }
.article-body h2 { margin:44px 0 17px; color:var(--ink); font-size:31px; line-height:1.35; }
.article-body h2:first-child { margin-top:0; }
.article-body p { margin:0 0 18px; }
.article-body a:not(.button) { color:#2b5338; text-decoration:underline; text-underline-offset:4px; }
.article-body ul { margin:17px 0 26px; padding-left:22px; }
.article-body li { margin:8px 0; padding-left:6px; }
.article-callout { margin:37px 0; border-left:3px solid #839d84; padding:23px 27px; background:#eef2eb; }
.article-callout strong { color:var(--ink); }
.article-callout p { margin:8px 0 0; }
.article-next { display:flex; justify-content:space-between; align-items:center; gap:22px; border-top:1px solid var(--line); margin-top:49px; padding-top:31px; }
.article-next p { margin:0; color:var(--ink); font-weight:700; }
.article-next .button { white-space:nowrap; }
.article-nav { margin-left:auto; }

@media (max-width:1100px) {
  .container { width:min(calc(100% - 48px),1300px); }
  .nav { gap:16px; }
  .header-inner { gap:19px; }
  .plan-layout { grid-template-columns:minmax(0,2.4fr) minmax(210px,1fr); gap:25px; }
  .contact-grid { grid-template-columns:1fr 330px; gap:4%; }
  .contact-action { padding-left:28px; }
  .contact-number { font-size:28px; }
}
@media (max-width:760px) {
  html { scroll-padding-top:70px; }
  .container { width:min(calc(100% - 36px),1300px); }
  .site-header { height:68px; }
  .brand { font-size:12px; }
  .brand-mark { width:26px; }
  .menu-toggle { display:flex; align-items:center; gap:8px; border:0; background:transparent; margin-left:auto; color:var(--ink); font-size:12px; font-weight:700; cursor:pointer; }
  .menu-toggle span { font-size:20px; }
  .nav { display:none; position:absolute; left:0; right:0; top:68px; flex-direction:column; align-items:stretch; gap:0; margin:0; padding:12px 19px 20px; border-bottom:1px solid var(--line); background:var(--paper); box-shadow:0 12px 24px #10251b15; }
  .nav.is-open { display:flex; }
  .nav a { padding:12px 0; font-size:14px; }
  .header-phone,.article-nav { display:none; }
  .hero { padding-top:62px; }
  .hero-copy { padding-bottom:49px; }
  .eyebrow,.section-kicker { margin-bottom:24px; font-size:9px; }
  .hero h1 { font-size:clamp(40px,8.4vw,60px); }
  .hero-lead { margin:26px 0; font-size:16px; }
  .hero-location { margin-top:42px; font-size:9px; }
  .hero-figure { width:100%; border-left:0; border-right:0; }
  .hero-photo { width:100%; }
  .concept-figure { margin-top:35px; }
  .concept-figure .drawing-viewport { overflow-x:auto; }
  .concept-figure img { min-width:740px; max-width:none; }
  .figure-caption { display:block; padding:13px 18px; font-size:9px; }
  .figure-caption span { display:block; }
  .figure-caption span+span { margin-top:4px; }
  .section-pad { padding:78px 0; }
  h2 { font-size:clamp(37px,7vw,51px); }
  .concept-grid,.engineering-grid,.process-grid,.faq-grid,.contact-grid { grid-template-columns:1fr; gap:35px; }
  .prose-large { padding:0; }
  .prose-large p { font-size:18px; }
  .use-grid { grid-template-columns:1fr; margin-top:38px; }
  .use-grid div,.use-grid div+div { padding:21px 0 23px; border-left:0; }
  .use-grid div+div { border-top:1px solid var(--line); }
  .use-grid span { margin-bottom:15px; }
  .use-grid strong { font-size:23px; }
  .section-heading { display:block; }
  .section-heading>p { max-width:600px; margin:22px 0 0; font-size:14px; }
  .plan-layout { display:block; margin-top:39px; }
  .plan-figure .drawing-viewport { overflow-x:auto; }
  .plan-figure img { min-width:760px; max-width:none; }
  .plan-notes { margin-top:39px; }
  .engineering-heading { position:static; }
  .process-list li { grid-template-columns:44px 1fr; }
  .journal-grid { grid-template-columns:1fr; margin-top:37px; }
  .journal-grid a { min-height:200px; }
  .journal-grid h3 { margin-top:25px; }
  .contact { padding:75px 0; }
  .contact-action { border-left:0; border-top:1px solid #496b55; padding:27px 0 0; }
  .footer-main { grid-template-columns:1fr 1fr; padding:42px 0; }
  .footer-main p { grid-row:2; }
  .footer-main>a:last-child { text-align:right; }
  .footer-bottom { display:block; }
  .footer-bottom span,.footer-bottom a { display:block; margin-bottom:10px; }
  .article-hero { padding:48px 0 55px; }
  .article-back { margin-bottom:31px; }
  .article-hero h1 { font-size:40px; }
  .article-lead { font-size:16px; }
  .article-body { padding-top:44px; padding-bottom:72px; font-size:15px; }
  .article-body h2 { font-size:26px; }
  .article-next { display:block; }
  .article-next .button { margin-top:20px; }
}
@media (max-width:480px) {
  .hero h1 { font-size:39px; }
  .hero-actions { align-items:stretch; gap:21px; }
  .hero-actions .button { width:100%; }
  .contact-number { font-size:27px; }
  .footer-main { display:block; }
  .footer-main p,.footer-main>a:last-child { display:block; text-align:left; margin-top:23px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .button { transition:none; } }
