/* Macdonald Automation Partners — shared site styles */

:root{
  --paper:#F9F7F2;
  --paper-raised:#FFFFFF;
  --ink:#1B2130;
  --ink-soft:#525A6B;
  --slate:#868C99;
  --line:#E2DFD6;
  --accent:#83622C;
  --accent-strong:#6C5024;
  --on-accent:#FFFFFF;
  --focus:#2C4A6E;
  --good:#3E6B4F;
  --shadow: 0 1px 2px rgba(27,33,48,0.04), 0 10px 28px -16px rgba(27,33,48,0.22);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#15181F;
    --paper-raised:#1C202A;
    --ink:#EBE8E0;
    --ink-soft:#B3AEA2;
    --slate:#83807A;
    --line:#2C303B;
    --accent:#C7A567;
    --accent-strong:#D8B87C;
    --on-accent:#1B1608;
    --focus:#7FA8D9;
    --good:#7FBD95;
    --shadow: 0 1px 2px rgba(0,0,0,0.35), 0 14px 32px -16px rgba(0,0,0,0.6);
  }
}
:root[data-theme="dark"]{
  --paper:#15181F;
  --paper-raised:#1C202A;
  --ink:#EBE8E0;
  --ink-soft:#B3AEA2;
  --slate:#83807A;
  --line:#2C303B;
  --accent:#C7A567;
  --accent-strong:#D8B87C;
  --on-accent:#1B1608;
  --focus:#7FA8D9;
  --good:#7FBD95;
  --shadow: 0 1px 2px rgba(0,0,0,0.35), 0 14px 32px -16px rgba(0,0,0,0.6);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}
img{max-width:100%;}
a{color:inherit;}
h1,h2,h3{
  font-family:'Fraunces', Georgia, serif;
  font-weight:600;
  text-wrap:balance;
  margin:0;
  color:var(--ink);
}
.eyebrow{
  font-size:0.76rem;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink-soft);
  font-weight:600;
  display:flex;
  align-items:center;
  gap:0.65rem;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--accent);
  flex:none;
}
.wrap{
  max-width:1120px;
  margin:0 auto;
  padding:0 clamp(1.25rem, 4vw, 2.5rem);
}
.wrap-narrow{
  max-width:760px;
  margin:0 auto;
  padding:0 clamp(1.25rem, 4vw, 2.5rem);
}

a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:3px;
  border-radius:2px;
}

/* NAV */
header.site{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--paper) 90%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:1.15rem clamp(1.25rem, 4vw, 2.5rem);
  max-width:1120px; margin:0 auto; gap:1.5rem; flex-wrap:nowrap;
}
.brand{
  display:flex; flex-direction:column; line-height:1.15;
  text-decoration:none; flex:none; white-space:nowrap;
}
.brand .name{
  font-family:'Fraunces', serif; font-weight:600; font-size:1.05rem; letter-spacing:-0.01em;
}
.brand .loc{
  font-size:0.68rem; letter-spacing:0.08em;
  color:var(--slate); text-transform:uppercase; margin-top:2px; font-weight:600;
}
.nav-links{
  display:flex; align-items:center; gap:1.6rem;
  list-style:none; margin:0; padding:0; white-space:nowrap;
}
.nav-links a{
  text-decoration:none; font-size:0.89rem; color:var(--ink-soft); font-weight:500;
  transition:color 0.15s ease;
}
.nav-links a:hover{ color:var(--ink); }
.nav-cta{ display:flex; align-items:center; gap:0.9rem; flex:none; }
.theme-toggle{
  background:none; border:1px solid var(--line); border-radius:8px;
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--ink-soft); flex:none;
}
.theme-toggle svg{ width:16px; height:16px; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:0.5rem;
  font-family:'Inter',sans-serif; font-weight:600; font-size:0.88rem;
  padding:0.7rem 1.2rem; border-radius:6px; border:1px solid transparent;
  text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:background 0.15s ease, border-color .15s ease, box-shadow .15s ease;
}
.btn-primary{ background:var(--accent); color:var(--on-accent); }
.btn-primary:hover{ background:var(--accent-strong); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn-ghost:hover{ border-color:var(--ink-soft); }
.btn-sm{ padding:0.55rem 0.95rem; font-size:0.82rem; }

/* HERO */
.hero{ padding:clamp(3.25rem,7vw,5.5rem) 0 clamp(2.75rem,6vw,4.25rem); }
.hero-grid{
  display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2.75rem,5vw,4.5rem);
  align-items:center;
}
.hero h1{
  font-size:clamp(2.15rem, 4.1vw, 3.15rem);
  letter-spacing:-0.015em;
  line-height:1.1;
  margin-top:1.1rem;
}
.hero p.lede{
  margin-top:1.15rem; font-size:1.08rem; color:var(--ink-soft);
  max-width:46ch;
}
.hero-actions{ display:flex; gap:0.9rem; margin-top:2rem; flex-wrap:wrap; }
.hero-note{
  margin-top:1.25rem; font-size:0.85rem; color:var(--slate);
}

/* TRANSFORM PANEL */
.demo{
  border:1px solid var(--line); border-radius:8px; overflow:hidden;
  background:var(--paper-raised); box-shadow:var(--shadow);
}
.demo-cols{ display:grid; grid-template-columns:1fr 1fr; }
.demo-col{ padding:1.4rem 1.3rem; }
.demo-col + .demo-col{ border-left:1px solid var(--line); }
.demo-col .label{
  font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:600;
  color:var(--slate); margin-bottom:0.9rem; display:block;
}
.demo-col.raw p{
  font-size:0.85rem; color:var(--ink-soft); margin:0 0 0.7rem; line-height:1.6;
}
.demo-col.raw p b{ color:var(--ink); font-weight:600; }
.demo-col.raw p:last-child{ margin-bottom:0; }
.note-field{ display:grid; grid-template-columns:76px 1fr; gap:0.6rem; font-size:0.85rem; margin-bottom:0.65rem; }
.note-field:last-child{ margin-bottom:0; }
.note-field .k{ font-size:0.68rem; color:var(--slate); text-transform:uppercase; letter-spacing:0.05em; padding-top:2px; font-weight:600; }
.note-field .v{ color:var(--ink); line-height:1.45; }
.note-field .v.tag{ color:var(--accent-strong); font-weight:600; }
.demo-foot{
  border-top:1px solid var(--line); padding:0.85rem 1.3rem; font-size:0.78rem; color:var(--slate);
  background:color-mix(in srgb, var(--paper) 55%, var(--paper-raised));
}

section{ padding:clamp(3.25rem,6vw,4.75rem) 0; border-top:1px solid var(--line); }
.section-head{ max-width:58ch; margin-bottom:clamp(2.25rem,4vw,3rem); }
.section-head h2{ font-size:clamp(1.55rem,2.8vw,2.1rem); margin-top:0.75rem; letter-spacing:-0.01em; }
.section-head p{ color:var(--ink-soft); margin-top:0.85rem; font-size:1.02rem; max-width:56ch; }
.section-foot{ margin-top:clamp(2rem,4vw,2.75rem); }

/* GAP / PROBLEM LIST */
.gap-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0.9rem 2.5rem; }
.gap-item{
  display:flex; align-items:flex-start; gap:0.85rem;
  padding:1rem 0; border-top:1px solid var(--line);
  font-size:1rem; color:var(--ink);
}
.gap-item .n{
  font-family:'Fraunces',serif; font-size:0.85rem; color:var(--accent); font-weight:600;
  padding-top:0.15rem; flex:none;
}

/* FLOW (Follow-Through System) */
.flow{ display:grid; gap:0; }
.flow-item{
  display:grid; grid-template-columns:44px 1fr; gap:1.5rem;
  position:relative;
}
.flow-item .node-col{
  display:flex; flex-direction:column; align-items:center;
}
.flow-item .dot{
  width:36px; height:36px; border-radius:50%;
  border:1.5px solid var(--accent); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-weight:600; font-size:0.95rem;
  background:var(--paper-raised); flex:none;
}
.flow-item .stem{ width:1.5px; flex:1; background:var(--line); margin:0.35rem 0; min-height:1.25rem; }
.flow-item:last-child .stem{ display:none; }
.flow-item .body{ padding-bottom:2.1rem; }
.flow-item:last-child .body{ padding-bottom:0; }
.flow-item h3{ font-size:1.12rem; }
.flow-item p{ color:var(--ink-soft); margin:0.45rem 0 0; max-width:58ch; font-size:0.97rem; }

/* USE CASES */
.usecase-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.usecase-card{
  background:var(--paper-raised);
  padding:1.75rem; display:flex; flex-direction:column; gap:0.55rem;
}
.usecase-card .tag{
  font-size:0.7rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--slate); font-weight:600;
}
.usecase-card h3{ font-size:1.05rem; font-family:'Fraunces',serif; font-weight:600; }
.usecase-card p{ color:var(--ink-soft); font-size:0.93rem; margin:0; }
.usecase-card .result{
  margin-top:0.3rem; font-size:0.88rem; color:var(--accent-strong); font-weight:600;
}

/* PROCESS (methodology) */
.process-list{ display:grid; gap:0; border-top:1px solid var(--line); }
.process-item{
  display:grid; grid-template-columns:56px 1fr; gap:1.5rem;
  padding:1.75rem 0; border-bottom:1px solid var(--line);
}
.process-item .num{
  font-family:'Fraunces', serif; font-size:1.05rem; color:var(--slate); padding-top:0.1rem; font-weight:500;
}
.process-item h3{ font-size:1.15rem; }
.process-item p{ color:var(--ink-soft); margin:0.5rem 0 0; max-width:60ch; font-size:0.98rem; }

/* OFFERS */
.offer-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line); border-left:1px solid var(--line); }
.offer-card{
  border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:1.85rem; background:var(--paper-raised); display:flex; flex-direction:column; gap:0.75rem;
}
.offer-card .phase{ font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--slate); font-weight:600; }
.offer-card h3{ font-size:1.2rem; }
.offer-card p{ color:var(--ink-soft); font-size:0.93rem; margin:0; flex:1; }
.offer-card .best-for{ font-size:0.83rem; color:var(--ink-soft); border-top:1px solid var(--line); padding-top:0.75rem; }
.offer-card .best-for b{ color:var(--ink); font-weight:600; }

/* PROOF / STATS */
.stat-row{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; padding-bottom:2rem; border-bottom:1px solid var(--line); margin-bottom:1.75rem; }
.stat{ }
.stat .num{ font-family:'Fraunces',serif; font-size:clamp(2rem,3.4vw,2.6rem); font-weight:600; color:var(--ink); line-height:1; }
.stat .label{ margin-top:0.6rem; color:var(--ink-soft); font-size:0.92rem; max-width:26ch; }
.proof-note{ color:var(--ink-soft); font-size:0.97rem; max-width:70ch; }
.proof-note strong{ color:var(--ink); font-weight:600; }

/* TRUST */
.trust-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0.9rem 2.5rem; }
.trust-item{
  display:flex; align-items:flex-start; gap:0.85rem;
  padding:1rem 0; border-top:1px solid var(--line);
}
.trust-item svg{ flex:none; width:18px; height:18px; color:var(--accent); margin-top:0.2rem; }
.trust-item p{ margin:0; font-size:0.98rem; color:var(--ink); }

/* ABOUT */
.about-grid{ display:grid; grid-template-columns:200px 1fr; gap:2.75rem; align-items:start; }
.about-mark{
  width:100%; aspect-ratio:1; background:var(--paper-raised);
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  font-family:'Fraunces',serif; font-size:2.1rem; color:var(--ink); font-weight:500;
}
.about-copy p{ color:var(--ink-soft); font-size:1rem; margin:0 0 1rem; max-width:62ch; }
.about-copy p:last-child{ margin-bottom:0; }
.about-copy strong{ color:var(--ink); font-weight:600; }
.about-copy ul{ margin:0.9rem 0 1.1rem; padding-left:1.15rem; color:var(--ink-soft); font-size:0.96rem; }
.about-copy li{ margin-bottom:0.4rem; }

/* FAQ */
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item summary{
  list-style:none; cursor:pointer; padding:1.3rem 0; display:flex;
  align-items:center; justify-content:space-between; gap:1rem;
  font-weight:600; font-size:1rem; font-family:'Fraunces',serif;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary .plus{
  color:var(--accent); font-size:1.2rem; flex:none; font-family:'Inter',sans-serif; font-weight:400;
  transition:transform 0.2s ease;
}
.faq-item[open] summary .plus{ transform:rotate(45deg); }
.faq-item .a{ padding:0 0 1.5rem; color:var(--ink-soft); max-width:64ch; font-size:0.96rem; }

/* CONTACT / CTA */
.cta-band{
  background:var(--ink); color:var(--paper); border-radius:8px;
  padding:clamp(2.5rem,5vw,3.5rem); display:grid; grid-template-columns:1.2fr 1fr; gap:2.75rem;
  align-items:center;
}
.cta-band .eyebrow{ color:color-mix(in srgb, var(--paper) 70%, transparent); }
.cta-band .eyebrow::before{ background:var(--accent-strong); }
.cta-band h2{ color:var(--paper); font-size:clamp(1.5rem,3vw,2rem); margin-top:0.75rem; }
.cta-band p{ color:color-mix(in srgb, var(--paper) 72%, transparent); margin-top:0.85rem; max-width:44ch; }
.cta-band .btn-primary{ margin-top:1.5rem; }

form.contact{ display:grid; gap:0.85rem; }
.field{ display:grid; gap:0.35rem; }
.field label{ font-size:0.76rem; color:color-mix(in srgb, var(--paper) 65%, transparent); text-transform:uppercase; letter-spacing:0.05em; font-weight:600; }
.field input, .field textarea{
  background:color-mix(in srgb, var(--paper) 8%, transparent); border:1px solid color-mix(in srgb, var(--paper) 22%, transparent); border-radius:6px;
  padding:0.7rem 0.85rem; font-family:'Inter',sans-serif; font-size:0.92rem; color:var(--paper);
  resize:vertical;
}
.field input::placeholder, .field textarea::placeholder{ color:color-mix(in srgb, var(--paper) 45%, transparent); }
.field input:focus, .field textarea:focus{ outline:2px solid var(--accent-strong); outline-offset:1px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:0.85rem; }
.form-msg{ font-size:0.85rem; color:var(--accent-strong); display:none; }
.form-msg.show{ display:block; }

footer.site{ border-top:1px solid var(--line); padding:2.5rem 0; }
.footer-grid{ display:flex; justify-content:space-between; align-items:flex-start; gap:2rem; flex-wrap:wrap; }
.footer-grid .brand .loc{ margin-top:4px; }
.footer-links{ display:flex; gap:1.75rem; list-style:none; padding:0; margin:0; flex-wrap:wrap; }
.footer-links a{ text-decoration:none; color:var(--ink-soft); font-size:0.87rem; }
.footer-links a:hover{ color:var(--ink); }
.footer-bottom{ margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--line); display:flex; justify-content:space-between; flex-wrap:wrap; gap:0.5rem; font-size:0.8rem; color:var(--slate); }
.footer-legal{ display:flex; gap:1.25rem; list-style:none; padding:0; margin:0; }
.footer-legal a{ text-decoration:none; color:var(--slate); }
.footer-legal a:hover{ color:var(--ink-soft); }

/* SIMPLE CONTENT PAGES (privacy / terms / thank-you) */
.doc{ padding:clamp(3rem,6vw,4.5rem) 0 clamp(4rem,8vw,6rem); }
.doc h1{ font-size:clamp(1.8rem,3.4vw,2.4rem); }
.doc .updated{ color:var(--slate); font-size:0.85rem; margin-top:0.6rem; }
.doc h2{ font-size:1.25rem; margin-top:2.25rem; margin-bottom:0.75rem; }
.doc p, .doc li{ color:var(--ink-soft); font-size:0.98rem; }
.doc ul{ padding-left:1.25rem; }
.doc li{ margin-bottom:0.4rem; }
.doc a{ color:var(--accent-strong); text-decoration:underline; }

.thankyou{ padding:clamp(4rem,10vw,6.5rem) 0; text-align:center; }
.thankyou .mark{
  width:56px; height:56px; border-radius:50%; border:1.5px solid var(--accent); color:var(--accent);
  display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem;
}
.thankyou h1{ font-size:clamp(1.9rem,3.6vw,2.5rem); }
.thankyou p{ color:var(--ink-soft); font-size:1.05rem; max-width:46ch; margin:1rem auto 0; }
.thankyou .btn{ margin-top:2rem; }

@media (max-width: 1040px){
  .nav-links{ display:none; }
}
@media (max-width: 880px){
  .hero-grid{ grid-template-columns:1fr; }
  .demo-cols{ grid-template-columns:1fr; }
  .demo-col + .demo-col{ border-left:none; border-top:1px solid var(--line); }
  .gap-grid{ grid-template-columns:1fr; }
  .usecase-grid{ grid-template-columns:1fr; }
  .offer-grid{ grid-template-columns:1fr; border-left:none; }
  .offer-card{ border-left:1px solid var(--line); }
  .stat-row{ grid-template-columns:1fr; gap:1.25rem; }
  .trust-grid{ grid-template-columns:1fr; }
  .about-grid{ grid-template-columns:1fr; }
  .about-mark{ width:84px; height:84px; font-size:1.5rem; }
  .cta-band{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; }
}
@media (max-width:480px){
  .nav{ flex-wrap:wrap; row-gap:0.75rem; padding-top:1rem; padding-bottom:1rem; }
  .brand{ flex:1 1 100%; }
  .nav-cta{ flex:1 1 100%; justify-content:space-between; }
}