/*
  Melin Cardi at Garthenor
  Typeface: Brandon Grotesque, via Adobe Fonts (Typekit kit fsi8zfd).
  Bold (700) for headings/titles, Regular (400) / Medium (500) for body & labels.
  Sans-serif fallback stack in case Typekit fails to load.
*/

:root{
  --forest:#1f8c71;
  --sage:#b4e1d5;
  --bg:#e8f0ef;
  --charcoal:#2A2B27;
  --ochre:#D19A2B;
  --white:#ffffff;
  --line: rgba(42,43,39,0.12);
  --muted: #494a44;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--charcoal);
  font-family:'brandon-grotesque', 'Helvetica Neue', Arial, sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.disp{
  font-family:'brandon-grotesque', 'Helvetica Neue', Arial, sans-serif;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:0.01em;
  line-height:1.08;
  margin:0;
  color:var(--charcoal);
}
p{margin:0 0 14px;}
p:last-child{margin-bottom:0;}
a{color:inherit;}
img{max-width:100%;display:block;}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px;}
.eyebrow{
  font-size:12px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--forest);
  font-weight:500;
}
.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:12px;top:-48px;background:var(--charcoal);color:var(--bg);
  padding:10px 16px;border-radius:2px;z-index:100;transition:top .15s;font-size:13px;text-decoration:none;
}
.skip-link:focus{top:12px;}

/* NAV */
nav{position:sticky;top:0;z-index:50;background:var(--bg);}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:94px;gap:24px;}
.logo-link{display:block;line-height:0;}
.logo-link img{height:52px;width:auto;display:block;}
nav ul{list-style:none;display:flex;gap:30px;margin:0;padding:0;font-size:12.5px;letter-spacing:0.05em;text-transform:uppercase;}
nav ul a{text-decoration:none;border-bottom:1px solid transparent;padding-bottom:3px;transition:border-color .2s;}
nav ul a:hover,nav ul a[aria-current="page"]{border-color:var(--forest);color:var(--forest);}
.nav-right{display:flex;align-items:center;gap:26px;}
.nav-cta{
  background:var(--forest);color:var(--white);
  font-size:12px;letter-spacing:0.07em;text-transform:uppercase;font-weight:500;
  padding:10px 18px;border-radius:2px;text-decoration:none;white-space:nowrap;
}
.nav-cta:hover{background:#186e5a;}
.nav-toggle{display:none;background:none;border:1px solid var(--line);border-radius:2px;padding:8px 10px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;}
@media (max-width:820px){
  nav ul{display:none;}
  nav ul.nav-open{
    display:flex;flex-direction:column;gap:0;position:absolute;top:94px;left:0;right:0;
    background:var(--bg);border-top:1px solid var(--line);padding:8px 28px 20px;
  }
  nav ul.nav-open li{border-bottom:1px solid var(--line);}
  nav ul.nav-open a{display:block;padding:14px 0;}
  .nav-toggle{display:block;}
}

/* JAGGED EDGE — core brand transition device */
.jagged{width:100%;height:20px;display:block;line-height:0;color:var(--sage);}
.jagged svg{display:block;width:100%;height:100%;}
.jagged polygon{fill:currentColor;}
.jagged-sage{color:var(--sage);}
.jagged-bg{color:var(--bg);}
.jagged-charcoal{color:var(--charcoal);}
.jagged-white{color:var(--white);}

/* HERO */
.hero{padding:64px 0 60px;position:relative;background:var(--sage);}
.hero .wrap{max-width:820px;}
.hero .eyebrow{color:#186e5a;}
.hero h1{font-size:clamp(32px,4.4vw,52px);margin-top:14px;max-width:760px;}
.hero p.lede{font-size:17px;max-width:620px;margin-top:20px;color:#294034;}
.hero p.lede + p.lede{margin-top:10px;}
.hero-actions{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap;}

/* HERO with companion image (Home) */
.hero-split .wrap{max-width:1160px;}
.hero-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:48px;align-items:center;}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr;} }
.hero-img{border-radius:2px;overflow:hidden;}
.hero-img img{width:100%;height:100%;min-height:320px;object-fit:cover;display:block;}
.btn-primary,.btn-ghost{
  font-size:13px;letter-spacing:0.05em;text-transform:uppercase;font-weight:500;
  padding:14px 22px;text-decoration:none;border-radius:2px;display:inline-block;
  border:1px solid transparent;cursor:pointer;font-family:inherit;
}
.btn-primary{background:var(--forest);color:var(--white);}
.btn-primary:hover{background:#186e5a;}
.btn-ghost{border-color:var(--charcoal);color:var(--charcoal);background:transparent;}
.btn-ghost:hover{background:var(--charcoal);color:var(--bg);}

section{padding:72px 0;}
.section-tight{padding:48px 0;}
.section-head{max-width:640px;margin-bottom:40px;}
.section-head h2{font-size:clamp(24px,3.2vw,36px);margin-top:10px;}
.section-alt{background:var(--white);}
.section-dark{background:var(--charcoal);color:var(--bg);}
.section-dark .eyebrow{color:#9fcabb;}
.section-dark h2,.section-dark h3{color:var(--bg);}
.section-dark p{color:#c9d3ce;}
.section-sage{background:var(--sage);}

/* Body copy blocks */
.prose{max-width:720px;}
.prose p{font-size:16px;color:var(--muted);}
.prose h3{font-size:20px;margin-bottom:12px;color:var(--forest);}
.text-block + .text-block{margin-top:48px;}

/* CAPABILITY CARDS (Spin / Design / Source) */
.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.card-grid > div{background:var(--white);padding:34px 32px;}
.card-grid h3{font-size:19px;margin-bottom:12px;color:var(--forest);}
.card-grid p{font-size:14.5px;color:var(--muted);margin:0;}
@media (max-width:900px){ .card-grid{grid-template-columns:1fr;} }

/* FOUR-POINT GRID (Why Melin Cardi) */
.point-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.point-grid > div{background:var(--white);padding:32px;}
.point-grid h3{font-size:17px;margin-bottom:10px;}
.point-grid p{font-size:14.5px;color:var(--muted);margin:0;}
@media (max-width:820px){ .point-grid{grid-template-columns:1fr;} }

/* SELECTOR (Home — Where are you starting?) */
.selector-card{
  background:#33342f;border:1px solid rgba(232,240,239,0.12);border-radius:2px;
  padding:36px;max-width:760px;
}
.selector-options{display:grid;gap:10px;}
.selector-opt{
  text-align:left;background:transparent;border:1px solid rgba(232,240,239,0.25);color:var(--bg);
  padding:16px 20px;font-size:15px;border-radius:2px;cursor:pointer;transition:.15s;font-family:inherit;
  display:block;width:100%;text-decoration:none;
}
.selector-opt:hover,.selector-opt:focus-visible{border-color:var(--ochre);background:rgba(209,154,43,0.1);}

/* SPLIT / TEASER (image + text) */
.split{display:grid;grid-template-columns:0.9fr 1.1fr;gap:48px;align-items:center;}
.split.reverse{grid-template-columns:1.1fr 0.9fr;}
.split.reverse .split-visual{order:2;}
@media (max-width:900px){ .split,.split.reverse{grid-template-columns:1fr;} .split.reverse .split-visual{order:0;} }
.split h2{font-size:clamp(24px,3.2vw,34px);margin-top:10px;}
.split p{font-size:16px;color:var(--muted);margin-top:14px;max-width:480px;}
.split-visual{border-radius:2px;overflow:hidden;}
.split-visual img{width:100%;height:100%;min-height:340px;object-fit:cover;display:block;}

/* IMAGE PLACEHOLDER — clearly marked, swap for supplied photography */
.img-placeholder{
  background:repeating-linear-gradient(135deg, rgba(42,43,39,0.06), rgba(42,43,39,0.06) 10px, rgba(42,43,39,0.02) 10px, rgba(42,43,39,0.02) 20px);
  border:1px dashed rgba(42,43,39,0.3);
  display:flex;align-items:center;justify-content:center;text-align:center;
  min-height:340px;padding:24px;border-radius:2px;
}
.img-placeholder span{font-size:12px;letter-spacing:0.06em;text-transform:uppercase;color:#6b6f66;max-width:220px;}

/* FEATURE IMAGE — single large confident image (e.g. Mill page) */
.feature-img{border-radius:2px;overflow:hidden;}
.feature-img img{width:100%;height:auto;max-height:600px;object-fit:cover;display:block;}

/* PROCESS STEPS (Develop / Source / Manufacture) */
.process-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;counter-reset:step;}
.process-step{position:relative;padding-top:14px;border-top:2px solid var(--forest);}
.process-step .step-num{font-size:12px;letter-spacing:0.1em;color:var(--forest);font-weight:500;text-transform:uppercase;}
.process-step h3{font-size:18px;margin:10px 0 8px;}
.process-step p{font-size:14.5px;color:var(--muted);margin:0;}
@media (max-width:820px){ .process-steps{grid-template-columns:1fr;} }

/* MANUFACTURING PROCESS FLOW (simple label row) */
.flow-row{display:flex;flex-wrap:wrap;gap:0;border:1px solid var(--line);border-radius:2px;overflow:hidden;background:var(--white);}
.flow-row .flow-item{
  flex:1 1 110px;padding:16px 14px;text-align:center;font-size:12.5px;letter-spacing:0.04em;
  text-transform:uppercase;font-weight:500;border-right:1px solid var(--line);color:var(--muted);
}
.flow-row .flow-item:last-child{border-right:none;}
@media (max-width:700px){ .flow-row .flow-item{flex:1 1 33%;border-bottom:1px solid var(--line);} }

/* FAQ — native disclosure, minimal JS */
.faq-list{max-width:760px;border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{
  cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:20px 0;font-weight:500;font-size:16px;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"+";font-size:20px;color:var(--forest);font-weight:400;flex:none;}
.faq-item[open] summary::after{content:"\2212";}
.faq-item .faq-a{padding:0 0 20px;font-size:15px;color:var(--muted);max-width:620px;}

/* TRUST STRIP */
.trust-strip{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.trust-strip-footer{border-bottom:1px solid rgba(232,240,239,0.15);padding-bottom:30px;margin-bottom:32px;}

/* FORM (Contact page — progressive enquiry) */
.enquiry-form{max-width:640px;}
.form-row{margin-bottom:20px;}
.form-row label{display:block;font-size:13px;letter-spacing:0.04em;text-transform:uppercase;font-weight:500;margin-bottom:8px;color:var(--charcoal);}
.form-row .hint{font-size:13px;color:var(--muted);font-weight:400;text-transform:none;letter-spacing:0;display:block;margin-top:4px;}
.form-row input[type=text],
.form-row input[type=email],
.form-row input[type=number],
.form-row select,
.form-row textarea{
  width:100%;font-family:inherit;font-size:15px;padding:13px 14px;border:1px solid rgba(42,43,39,0.25);
  border-radius:2px;background:var(--white);color:var(--charcoal);
}
.form-row textarea{min-height:110px;resize:vertical;}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{outline:2px solid var(--forest);outline-offset:1px;}
fieldset{border:none;padding:0;margin:0;}
fieldset legend{font-size:13px;letter-spacing:0.04em;text-transform:uppercase;font-weight:500;margin-bottom:10px;padding:0;}
.radio-group{display:flex;flex-direction:column;gap:8px;}
.radio-group label{
  display:flex;align-items:flex-start;gap:10px;font-size:15px;text-transform:none;letter-spacing:0;font-weight:400;
  border:1px solid rgba(42,43,39,0.18);padding:12px 14px;border-radius:2px;cursor:pointer;
}
.radio-group input{margin-top:3px;}
.reveal-group{display:none;border-top:1px solid var(--line);padding-top:20px;margin-top:24px;}
.reveal-group.active{display:block;}
.form-note{font-size:13px;color:var(--muted);margin-top:6px;}
.form-status{font-size:14px;margin-top:16px;}

/* FOOTER */
footer{background:var(--charcoal);color:#c9d3ce;padding:52px 0 30px;}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:36px;margin-bottom:36px;}
@media (max-width:820px){ .footer-grid{grid-template-columns:1fr;} }
footer h4{font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;color:#9fcabb;margin:0 0 12px;font-weight:600;}
footer p, footer a{font-size:14px;color:#c9d3ce;text-decoration:none;line-height:1.7;}
footer a:hover{color:var(--ochre);}
.footer-logo{height:26px;width:auto;opacity:0.92;margin-bottom:12px;filter:brightness(0) invert(1);}
.footer-bottom{border-top:1px solid rgba(232,240,239,0.12);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:12.5px;color:#8f978f;}
.footer-bottom.no-border{border-top:none;padding-top:0;margin-top:8px;}

/* Utility */
.mt-0{margin-top:0;}
.center{text-align:center;}