@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@400;500;600&display=swap');
:root{--paper:#f8f7f3;--white:#fffefa;--ink:#252622;--body:#555750;--muted:#777970;--line:#deded5;--accent:#777b65;--soft:#eeeee7;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif;--max:1160px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.75}a{color:inherit;text-decoration:none}a:hover{color:var(--accent)}img{max-width:100%;display:block}.wrap{width:min(var(--max),calc(100% - 56px));margin:auto}.site-header{border-bottom:1px solid var(--line);background:rgba(248,247,243,.96)}.header-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{font:500 24px var(--serif);letter-spacing:-.04em;white-space:nowrap}.brand small{display:block;font:10px var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);line-height:1.3;margin-top:3px}.nav{display:flex;gap:28px;align-items:center;font-size:12px;letter-spacing:.04em}.nav a{padding:10px 0;border-bottom:1px solid transparent}.nav a[aria-current=page]{border-color:var(--ink)}.nav .nav-contact{border:1px solid var(--ink);padding:9px 14px}.menu-toggle{display:none;background:none;border:1px solid var(--line);padding:8px 10px;color:var(--ink)}main{min-height:60vh}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.17em;color:var(--accent);font-weight:700}.hero{padding:88px 0 84px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(270px,.7fr);gap:80px;align-items:center}.hero h1,.page-heading h1{font:400 clamp(42px,6vw,76px)/1.09 var(--serif);letter-spacing:-.045em;margin:20px 0 24px;max-width:760px}.hero .lead{font-size:17px;line-height:1.85;color:var(--body);max-width:660px}.hero-image{width:100%;max-width:350px;justify-self:end;border:1px solid var(--line);padding:10px;background:var(--white)}.hero-image img{width:100%;aspect-ratio:4/5;object-fit:cover}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 17px;border:1px solid var(--ink);font-size:12px;font-weight:600;letter-spacing:.025em}.button.primary{background:var(--ink);color:var(--white)}.button:hover{background:var(--accent);border-color:var(--accent);color:white}.section{padding:62px 0;border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:28px}.section h2,.content h2{font:400 clamp(28px,3vw,42px)/1.2 var(--serif);letter-spacing:-.03em;margin:8px 0 0}.section-head p{max-width:450px;color:var(--body);margin:0}.expertise-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line)}.expertise-item{padding:25px 24px 27px 0;border-bottom:1px solid var(--line)}.expertise-item:nth-child(odd){margin-right:30px}.expertise-item h3{font:400 22px var(--serif);margin:0 0 8px}.expertise-item p{margin:0;color:var(--body);font-size:14px}.text-link{font-size:12px;font-weight:700;letter-spacing:.03em;border-bottom:1px solid var(--accent);padding-bottom:4px}.project-list{border-top:1px solid var(--line)}.project-row{display:grid;grid-template-columns:74px minmax(0,1fr) 180px;gap:22px;padding:22px 0;border-bottom:1px solid var(--line);align-items:start}.project-number{font:18px var(--serif);color:var(--accent)}.project-row h3{font:400 22px/1.3 var(--serif);margin:0 0 6px}.project-row p{margin:0;color:var(--body);font-size:13px}.project-meta{font-size:11px;color:var(--muted);text-align:right;line-height:1.6}.page-heading{padding:76px 0 48px;max-width:850px}.page-heading h1{font-size:clamp(42px,5vw,66px);margin:14px 0 20px}.page-heading p{font-size:17px;color:var(--body);max-width:720px}.two-col{display:grid;grid-template-columns:220px minmax(0,1fr);gap:65px;padding:48px 0 72px;border-top:1px solid var(--line)}.side-label{font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-weight:700}.content{max-width:760px}.content p{color:var(--body);margin:0 0 18px}.content h2{margin:38px 0 16px}.content h2:first-child{margin-top:0}.content h3{font:400 23px var(--serif);margin:28px 0 8px}.plain-list{padding-left:18px;color:var(--body)}.plain-list li{margin:7px 0}.skill-list{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;border-top:1px solid var(--line)}.skill{padding:15px 0;border-bottom:1px solid var(--line)}.skill strong{display:block;font-size:13px;font-weight:600}.skill span{font-size:13px;color:var(--body)}.timeline{border-top:1px solid var(--line)}.timeline-item{display:grid;grid-template-columns:145px 1fr;gap:28px;padding:22px 0;border-bottom:1px solid var(--line)}.timeline-item time{font-size:11px;color:var(--muted);padding-top:4px}.timeline-item h3{font:400 21px var(--serif);margin:0 0 5px}.timeline-item p{margin:0;color:var(--body);font-size:13px}.contact-panel{background:var(--soft);padding:32px;margin:0 0 28px}.contact-panel h2{margin-top:0}.contact-lines{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:24px}.contact-lines small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.13em}.contact-lines a,.contact-lines span{font-size:14px;overflow-wrap:anywhere}.note{font-size:12px;color:var(--muted);border-left:2px solid var(--accent);padding-left:14px}.site-footer{border-top:1px solid var(--line);padding:26px 0 32px;font-size:11px;color:var(--muted)}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}.footer-links{display:flex;gap:20px}.inline-link{border-bottom:1px solid var(--line)}.tag{display:inline-block;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--accent);background:var(--soft);padding:4px 8px;margin:0 5px 7px 0}.callout{padding:26px 0;border-top:1px solid var(--line);margin-top:24px}.callout p{max-width:660px}
@media(max-width:800px){.wrap{width:min(var(--max),calc(100% - 36px))}.header-inner{min-height:74px}.menu-toggle{display:block}.nav{display:none;position:absolute;z-index:5;top:74px;left:0;right:0;padding:16px 22px 22px;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;gap:6px}.nav.open{display:flex}.nav a{padding:9px 0}.nav .nav-contact{padding:9px 12px}.hero{padding:54px 0 56px;grid-template-columns:1fr;gap:32px}.hero-image{justify-self:start;max-width:290px;grid-row:1}.hero h1{font-size:clamp(40px,12vw,60px)}.section{padding:42px 0}.section-head{display:block}.section-head p{margin-top:14px}.project-row{grid-template-columns:42px 1fr;gap:14px}.project-meta{grid-column:2;text-align:left}.two-col{grid-template-columns:1fr;gap:16px;padding:32px 0 52px}.skill-list{grid-template-columns:1fr}.timeline-item{grid-template-columns:1fr;gap:6px}.contact-lines{grid-template-columns:1fr}.footer-inner{align-items:flex-start;flex-direction:column}.page-heading{padding:54px 0 34px}}

/* Expertise landing page and detailed area pages */
.expertise-page-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:65px;padding:0 0 72px;border-top:1px solid var(--line)}.expertise-page-grid>.side-label{padding-top:30px}.expertise-page-grid .expertise-grid{grid-template-columns:1fr 1fr}.expertise-card{padding:28px 24px 30px 0}.expertise-card:nth-child(odd){margin-right:30px}.expertise-card .eyebrow{margin-bottom:10px}.intro-copy{font:400 21px/1.65 var(--serif);color:var(--ink)!important}.tool-links{display:flex;flex-wrap:wrap;gap:10px}.tool-links>a{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--white);padding:11px 14px;font-size:12px;letter-spacing:.02em}.tool-links>a:hover{border-color:var(--accent);color:var(--accent)}.tool-link{display:flex!important;flex-direction:column;align-items:flex-start!important;min-width:150px;gap:2px}.tool-wordmark{font:500 16px var(--serif);color:var(--ink)}.tool-caption{font-size:10px;color:var(--muted)}@media(max-width:800px){.expertise-page-grid{grid-template-columns:1fr;gap:14px;padding-bottom:52px}.expertise-page-grid>.side-label{padding-top:24px}.expertise-page-grid .expertise-grid{grid-template-columns:1fr}.expertise-card:nth-child(odd){margin-right:0}.tool-link{min-width:calc(50% - 10px)}}

/* ===================================================
   TOOLS / TECH STACK SECTION (ISOLATED)
   =================================================== */

#tech-tools-section {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 1.5rem;
  align-items: center;
}

#tech-tools-section .tool-card a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: inherit;
  padding: 1rem;
  border-radius: 8px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

#tech-tools-section .tool-card a:hover {
  transform: translateY(-4px);
}

#tech-tools-section .tool-card img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  margin-bottom: 0.5rem;
}

#tech-tools-section .tool-name {
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
}


/* MOBILE REFINEMENT — preserve the desktop visual identity */
@media (max-width: 800px) {
  .wrap { width: min(var(--max), calc(100% - 40px)); }
  .site-header { position: relative; z-index: 20; }
  .header-inner { min-height: 72px; gap: 14px; }
  .brand { font-size: 21px; }
  .menu-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 42px; padding: 8px 13px;
    font: 600 12px var(--sans); cursor: pointer;
  }
  .nav {
    top: 72px; padding: 14px 20px 20px;
    box-shadow: 0 12px 22px rgba(37,38,34,.06);
  }
  .nav a { min-height: 40px; display: flex; align-items: center; }
  .nav .nav-contact { justify-content: center; margin-top: 5px; }

  /* Keep the introduction before the portrait on phones. */
  .hero {
    padding: 52px 0 48px;
    grid-template-columns: minmax(0,1fr);
    gap: 24px; align-items: start;
  }
  .hero h1 {
    max-width: 680px; font-size: clamp(39px,8.5vw,58px);
    line-height: 1.08; margin: 15px 0 18px;
  }
  .hero .lead { max-width: 680px; font-size: 15px; line-height: 1.8; }
  .hero-image {
    grid-row: auto; justify-self: end; width: min(42%,190px);
    max-width: 190px; padding: 7px; margin-top: 2px;
  }
  .hero-image img { aspect-ratio: 4 / 5; }
  .actions { gap: 10px; margin-top: 23px; }
  .button { min-height: 44px; padding: 10px 13px; font-size: 11px; }
  .note { font-size: 11px; }

  .section { padding: 44px 0; }
  .section-head {
    display: grid; grid-template-columns: 1fr; gap: 14px;
    align-items: start; margin-bottom: 23px;
  }
  .section h2, .content h2 {
    font-size: clamp(29px,6.5vw,39px); line-height: 1.17;
  }
  .section-head p { max-width: 620px; margin-top: 0; font-size: 14px; }
  .section h2 br { display: none; }

  .expertise-grid {
    grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 22px;
  }
  .expertise-item { padding: 21px 0 23px; }
  .expertise-item:nth-child(odd) { margin-right: 0; }
  .expertise-item h3 { font-size: 20px; line-height: 1.25; }
  .expertise-item p { font-size: 13px; line-height: 1.7; }

  .project-row {
    grid-template-columns: 34px minmax(0,1fr);
    gap: 10px 13px; padding: 20px 0;
  }
  .project-row h3 { font-size: 20px; line-height: 1.28; }
  .project-row p { font-size: 12px; line-height: 1.65; }
  .project-meta { grid-column: 2; text-align: left; font-size: 10px; }

  .two-col { grid-template-columns: 1fr; gap: 15px; padding: 34px 0 50px; }
  .timeline-item { grid-template-columns: 1fr; gap: 5px; }
  .contact-lines { grid-template-columns: 1fr; }
  .footer-inner { align-items: flex-start; flex-direction: column; gap: 13px; }
  .footer-links { flex-wrap: wrap; gap: 10px 18px; }
}

@media (max-width: 520px) {
  .wrap { width: calc(100% - 36px); }
  .brand { font-size: 19px; }
  .brand small { font-size: 9px; letter-spacing: .13em; }
  .hero { padding: 42px 0 40px; gap: 20px; }
  .hero h1 { font-size: clamp(36px,10vw,46px); letter-spacing: -.04em; }
  .hero .lead { font-size: 14px; line-height: 1.75; }
  .hero-image { width: 145px; max-width: 145px; }
  .actions {
    display: grid; grid-template-columns: 1fr;
    align-items: stretch; max-width: 320px;
  }
  .button { width: 100%; min-height: 46px; font-size: 11px; }
  .section { padding: 38px 0; }
  .section h2, .content h2 { font-size: 30px; }
  .expertise-grid { grid-template-columns: 1fr; column-gap: 0; }
  .expertise-item { padding: 20px 0 22px; }
  .expertise-item h3 { font-size: 21px; }
  .project-row { grid-template-columns: 28px minmax(0,1fr); gap: 9px 11px; }
  .project-number { font-size: 16px; }
  .project-row h3 { font-size: 19px; }
  .page-heading { padding: 43px 0 30px; }
  .page-heading h1 { font-size: clamp(37px,10vw,48px); }
  .footer-links { gap: 10px 15px; }
}

/* Prevent horizontal scrolling on narrow screens. */
html, body { max-width: 100%; overflow-x: hidden; }
img { height: auto; }