@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;600;800&display=swap');

:root{
  --color-bg:#F4F2EE;
  --color-surface:#E9E5DD;
  --color-text:#14120F;
  --color-divider:color-mix(in srgb,#14120F 32%,transparent);
  --gold:#C1963C;
  --gold-dk:#8E6C26;
  --gold-lt:#EFE4CB;
  --ink:#14120F;
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:"Archivo",system-ui,sans-serif;-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.55;font-weight:400}
h1,h2,h3,h4,h5,h6{font-family:"Archivo",system-ui,sans-serif;font-weight:800;line-height:1.12;letter-spacing:-0.015em;margin:0 0 8px}
h6{font-size:13px;letter-spacing:0.08em;text-transform:uppercase}
p{margin:0 0 12px}
a{color:var(--gold-dk);text-decoration:none}
a:hover{color:var(--ink)}
img{display:block;max-width:100%}
:focus{outline:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
::selection{background:color-mix(in srgb,var(--gold) 30%,transparent)}

.page{min-height:100vh;display:flex;flex-direction:column;background:var(--color-bg)}
main{flex:1}

.kicker{color:var(--gold-dk);margin:0 0 14px}

/* header */
.site-header{position:sticky;top:0;z-index:30;background:var(--color-bg);border-bottom:2px solid var(--ink)}
.header-inner{max-width:1280px;margin:0 auto;padding:12px clamp(18px,4vw,44px);display:flex;align-items:center;gap:28px}
.logo-link{display:block;margin-right:auto;line-height:0}
.logo-img{height:clamp(44px,6.5vw,62px);width:auto;mix-blend-mode:multiply}

.nav-desktop{display:none;align-items:center;gap:clamp(12px,1.8vw,28px)}
.nav-link{font-size:12px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;white-space:nowrap;color:var(--ink);opacity:.62;border-bottom:3px solid transparent;padding-bottom:3px}
.nav-link:hover{opacity:1;border-bottom-color:var(--gold)}
.nav-link.is-active{font-weight:800;opacity:1;border-bottom-color:var(--gold)}
.nav-quote{font-size:12px;font-weight:800;letter-spacing:0.1em;text-transform:uppercase;white-space:nowrap;background:var(--gold);color:var(--ink);padding:11px 18px}
.nav-quote:hover{background:var(--ink);color:var(--gold)}

.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;padding:0 11px;background:var(--ink);border:0;cursor:pointer}
.menu-toggle span{display:block;height:2px;background:var(--gold)}

.nav-mobile{display:none;flex-direction:column;border-top:2px solid var(--ink);background:var(--ink);padding:8px clamp(18px,4vw,44px) 20px}
.nav-mobile.open{display:flex}
.nav-mobile a{font-size:15px;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:#F4F2EE;padding:16px 0;border-bottom:1px solid rgba(244,242,238,.18)}
.nav-mobile .mobile-phone{font-size:13px;color:var(--gold);padding:18px 0 0;letter-spacing:0.04em;border-bottom:0}

@media(min-width:1040px){
  .nav-desktop{display:flex}
  .menu-toggle{display:none}
  .nav-mobile{display:none !important}
}

/* footer */
.site-footer{background:var(--ink);color:#F4F2EE;border-top:2px solid var(--ink)}
.footer-inner{max-width:1280px;margin:0 auto;padding:clamp(32px,5vw,64px) clamp(18px,4vw,44px)}
.footer-top{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(24px,4vw,56px);border-bottom:2px solid rgba(244,242,238,.25);padding-bottom:clamp(24px,3vw,40px)}
.footer-brand{font-size:clamp(19px,2.2vw,26px);font-weight:800;line-height:1.15;letter-spacing:-0.02em;color:var(--gold);text-transform:uppercase;margin-bottom:14px}
.footer-tagline{font-size:13px;line-height:1.6;margin:0;color:rgba(244,242,238,.7)}
.footer-label{font-size:11px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.footer-address{font-size:14px;line-height:1.7;margin:0;color:rgba(244,242,238,.82)}
.footer-nav{display:flex;flex-direction:column;gap:9px}
.footer-nav a{font-size:14px;color:rgba(244,242,238,.82);letter-spacing:0.02em}
.footer-nav a:hover{color:var(--gold)}
.footer-bottom{padding-top:20px;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(244,242,238,.5)}

/* table (About > Company information) */
.table{width:100%;border-collapse:collapse;font-size:14px;max-width:820px}
.table th{text-align:left;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:color-mix(in srgb,var(--color-text) 60%,transparent);padding:8px;border-bottom:2px solid var(--color-divider);width:38%}
.table td{padding:8px;border-bottom:1px solid var(--color-divider)}
.table tbody tr:hover{background:color-mix(in srgb,var(--color-text) 4%,transparent)}

/* form (Contact) */
.field>label{display:block;font-size:12px;margin-bottom:5px;color:color-mix(in srgb,var(--color-text) 70%,transparent)}
.input{width:100%;min-height:36px;padding:6px 10px;font:inherit;font-size:14px;color:var(--color-text);caret-color:var(--gold);background:var(--color-surface);border:1px solid var(--color-divider);border-radius:0}
.input:hover{border-color:color-mix(in srgb,var(--color-text) 45%,transparent)}
.input:focus-visible{border-color:var(--gold);outline-offset:0}
textarea.input{min-height:90px;resize:vertical}
.field-error{font-size:11px;font-weight:600;color:#A8321A;margin-top:5px}
.form-error{font-size:12px;font-weight:600;color:#A8321A;margin-top:14px}

/* placeholder photo box (image-slot replacement) */
.photo-slot{position:relative;width:100%;border:2px solid var(--ink);background:var(--color-surface);overflow:hidden}
.photo-slot img{width:100%;height:100%;object-fit:cover}

/* buttons used as links */
.btn-gold{font-size:13px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;background:var(--gold);color:var(--ink);padding:16px 26px;display:inline-block;border:0;cursor:pointer}
.btn-gold:hover{background:var(--ink);color:var(--gold)}
.btn-outline{font-size:13px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink);padding:16px 26px;border:2px solid var(--ink);display:inline-block}
.btn-outline:hover{background:var(--ink);color:var(--gold)}
.btn-ink{font-size:12px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;background:var(--ink);color:var(--gold);border:0;padding:14px 22px;cursor:pointer}
.btn-ink:hover{background:var(--gold);color:var(--ink)}

/* sections shared across pages */
.wrap{max-width:1280px;margin:0 auto;padding-left:clamp(18px,4vw,44px);padding-right:clamp(18px,4vw,44px)}
.page-intro{padding-top:clamp(30px,5vw,72px);padding-bottom:clamp(30px,5vw,72px)}

/* Home */
.hero{border-bottom:2px solid var(--ink)}
.hero-inner{padding-top:clamp(28px,5vw,64px);padding-bottom:clamp(28px,5vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(28px,4vw,56px);align-items:center}
.hero-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.hero-eyebrow-line{width:44px;height:3px;background:var(--gold)}
.hero-eyebrow-text{font-size:11px;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;opacity:.6}
.hero-title{font-size:clamp(34px,5.4vw,72px);line-height:0.98;letter-spacing:-0.03em;text-transform:uppercase;margin:0 0 22px;max-width:16ch}
.hero-title span{color:var(--gold-dk)}
.hero-copy{font-size:clamp(15px,1.5vw,19px);line-height:1.5;max-width:46ch;margin:0 0 30px;opacity:.78;text-wrap:pretty}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero-photo{aspect-ratio:5/4;width:92%;margin-left:auto}

.chain-strip{border-bottom:2px solid var(--ink);background:var(--color-surface)}
.chain-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.chain-item{padding:22px clamp(14px,2vw,24px);border-left:1px solid var(--color-divider);display:flex;flex-direction:column;gap:8px}
.chain-n{font-size:11px;font-weight:800;color:var(--gold-dk);letter-spacing:0.1em}
.chain-label{font-size:clamp(13px,1.3vw,15px);font-weight:800;letter-spacing:0.06em;text-transform:uppercase}

.welcome{padding-top:clamp(36px,6vw,88px);padding-bottom:clamp(36px,6vw,88px)}
.welcome-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(28px,4vw,64px)}
.welcome-title{font-size:clamp(26px,3.4vw,44px);letter-spacing:-0.025em;margin:0 0 24px;max-width:18ch}
.welcome-copy p{font-size:16px;line-height:1.6;margin:0 0 16px;max-width:60ch;text-wrap:pretty}
.welcome-side{display:flex;flex-direction:column;gap:20px}
.welcome-photo{aspect-ratio:4/3}
.welcome-quote{font-size:16px;line-height:1.6;margin:0;border-left:3px solid var(--gold);padding-left:18px;text-wrap:pretty}

.stats{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.stats-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.stat{padding:clamp(22px,3vw,34px) clamp(16px,2.5vw,28px);border-left:1px solid var(--color-divider)}
.stat-value{font-size:clamp(30px,4vw,52px);font-weight:800;letter-spacing:-0.03em;line-height:1;color:var(--gold-dk);margin-bottom:10px}
.stat-label{font-size:12px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;opacity:.65}

.manufacture{padding-top:clamp(36px,6vw,88px);padding-bottom:clamp(36px,6vw,80px)}
.manufacture-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:2px solid var(--ink);padding-bottom:16px;margin-bottom:clamp(24px,3vw,40px)}
.manufacture-head h2{font-size:clamp(24px,3vw,38px);letter-spacing:-0.025em;margin:0;text-transform:uppercase}
.manufacture-head a{font-size:12px;font-weight:800;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold-dk)}
.manufacture-head a:hover{color:var(--ink)}
.category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:2px;background:var(--color-divider)}
.category-item{background:var(--color-bg);padding:26px 22px 30px;display:flex;flex-direction:column;gap:10px;min-height:170px}
.category-item:hover{background:var(--gold-lt)}
.category-n{font-size:11px;font-weight:800;letter-spacing:0.12em;color:var(--gold-dk)}
.category-title{font-size:clamp(17px,1.8vw,21px);font-weight:800;letter-spacing:-0.01em;line-height:1.15}
.category-note{font-size:13px;line-height:1.5;opacity:.7;margin-top:auto}

.closing{background:var(--ink);border-top:2px solid var(--ink)}
.closing-inner{padding-top:clamp(40px,6vw,90px);padding-bottom:clamp(40px,6vw,90px)}
.closing-statement{font-size:clamp(26px,4.4vw,60px);font-weight:800;line-height:1.05;letter-spacing:-0.03em;text-transform:uppercase;color:var(--gold);margin:0;max-width:22ch}

/* About */
.about-title{font-size:clamp(32px,5vw,64px);letter-spacing:-0.03em;text-transform:uppercase;margin:0 0 clamp(24px,4vw,44px)}
.about-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(28px,4vw,60px);border-top:2px solid var(--ink);padding-top:clamp(24px,3vw,40px)}
.about-copy p{font-size:16px;line-height:1.6;margin:0 0 16px;text-wrap:pretty}
.about-photo{aspect-ratio:1/1}

.mission-vision{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);background:var(--color-surface)}
.mission-vision-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.mission-vision-col{padding:clamp(28px,4vw,52px) clamp(18px,4vw,44px)}
.mission-vision-col+.mission-vision-col{border-left:2px solid var(--ink)}
.mission-vision-col p{font-size:clamp(17px,1.9vw,23px);line-height:1.4;margin:0;text-wrap:pretty}

.company-info{padding-top:clamp(30px,5vw,72px);padding-bottom:clamp(30px,5vw,72px)}
.company-info h2{font-size:clamp(22px,2.6vw,32px);letter-spacing:-0.02em;text-transform:uppercase;margin:0 0 20px}

/* Products */
.products-title{font-size:clamp(32px,5vw,64px);letter-spacing:-0.03em;text-transform:uppercase;margin:0 0 22px}
.products-lede{font-size:clamp(16px,1.7vw,20px);line-height:1.5;max-width:62ch;margin:0;opacity:.8;text-wrap:pretty}
.products-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:2px;background:var(--color-divider);border:2px solid var(--ink)}
.product-card{background:var(--color-bg);display:flex;flex-direction:column}
.product-photo{aspect-ratio:4/3;border-bottom:1px solid var(--color-divider);border:0}
.product-body{padding:24px 22px 28px;display:flex;flex-direction:column;gap:14px;flex:1}
.product-n{font-size:11px;font-weight:800;letter-spacing:0.12em;color:var(--gold-dk)}
.product-title{font-size:clamp(19px,2vw,24px);margin:0;letter-spacing:-0.015em}
.product-items{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px 14px}
.product-items li{font-size:14px;line-height:1.4;display:flex;gap:9px;align-items:baseline}
.product-items li::before{content:"";width:5px;height:5px;background:var(--gold);flex:none}
.product-desc{font-size:14px;line-height:1.55;margin:0;opacity:.78;text-wrap:pretty}

.products-cta{border-top:2px solid var(--ink);background:var(--color-surface)}
.products-cta-inner{padding-top:clamp(30px,4vw,56px);padding-bottom:clamp(30px,4vw,56px);display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.products-cta p{font-size:clamp(18px,2.2vw,26px);font-weight:800;letter-spacing:-0.02em;margin:0;max-width:34ch;text-wrap:pretty}

/* Production */
.production-title{font-size:clamp(32px,5vw,64px);letter-spacing:-0.03em;text-transform:uppercase;margin:0;max-width:20ch}
.steps{padding-bottom:clamp(36px,6vw,80px)}
.step{border-top:2px solid var(--ink);padding:clamp(20px,3vw,34px) 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(16px,3vw,48px);align-items:start}
.step:hover{background:var(--gold-lt)}
.step-head{display:flex;align-items:baseline;gap:16px}
.step-n{font-size:clamp(28px,3.4vw,44px);font-weight:800;letter-spacing:-0.03em;line-height:1;color:var(--gold)}
.step-title{font-size:clamp(19px,2.1vw,26px);margin:0;letter-spacing:-0.02em;text-transform:uppercase}
.step-body{font-size:16px;line-height:1.6;margin:0;max-width:58ch;opacity:.82;text-wrap:pretty}
.steps-rule{border-top:2px solid var(--ink)}
.production-photo{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}
.production-photo .photo-slot{height:clamp(220px,34vw,430px);border:0}

/* Capabilities */
.capabilities-title{font-size:clamp(32px,5vw,64px);letter-spacing:-0.03em;text-transform:uppercase;margin:0 0 clamp(24px,4vw,44px)}
.capabilities-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:0 clamp(20px,3vw,44px);border-top:2px solid var(--ink)}
.capability{display:flex;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid var(--color-divider);font-size:15px;font-weight:600}
.capability:hover{color:var(--gold-dk)}
.capability-n{font-size:10px;font-weight:800;letter-spacing:0.08em;color:var(--gold);min-width:20px}
.capabilities-note{font-size:clamp(17px,1.9vw,23px);line-height:1.45;margin:clamp(28px,4vw,48px) 0 0;max-width:48ch;border-left:3px solid var(--gold);padding-left:20px;text-wrap:pretty}

/* Contact */
.contact-title{font-size:clamp(32px,5vw,64px);letter-spacing:-0.03em;text-transform:uppercase;margin:0 0 20px}
.contact-lede{font-size:clamp(16px,1.7vw,20px);line-height:1.5;max-width:60ch;margin:0;opacity:.8;text-wrap:pretty}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2px;background:var(--color-divider);border:2px solid var(--ink);margin-bottom:clamp(36px,6vw,80px)}
.contact-details{background:var(--color-surface);padding:clamp(24px,3.5vw,44px)}
.contact-details h2{font-size:clamp(20px,2.2vw,27px);letter-spacing:-0.02em;text-transform:uppercase;margin:0 0 26px}
.contact-row{padding:14px 0;border-top:1px solid var(--color-divider)}
.contact-row-label{font-size:11px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;opacity:.55;margin-bottom:5px}
.contact-row-value{font-size:16px;font-weight:600;line-height:1.4}
.contact-photo{aspect-ratio:16/9;margin-top:26px}
.contact-form-col{background:var(--color-bg);padding:clamp(24px,3.5vw,44px)}
.contact-form-col h2{font-size:clamp(20px,2.2vw,27px);letter-spacing:-0.02em;text-transform:uppercase;margin:0 0 26px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:18px}
.form-message{margin-top:18px}
.form-submit{margin-top:24px}
.success-box{border:2px solid var(--gold);padding:clamp(24px,3vw,36px)}
.success-eyebrow{font-size:11px;font-weight:800;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-dk);margin-bottom:14px}
.success-title{font-size:clamp(20px,2.2vw,28px);letter-spacing:-0.02em;margin:0 0 14px}
.success-copy{font-size:15px;line-height:1.6;margin:0 0 22px;opacity:.75}
.hidden{display:none !important}
