:root {
  --black: #050505;
  --soft-black: #0b0b0b;
  --panel: #11100f;
  --panel-2: #161411;
  --gold: #b98542;
  --gold-bright: #d3a463;
  --gold-soft: #8e6738;
  --cream: #eee8df;
  --muted: #9a958e;
  --line: rgba(211, 164, 99, .22);
  --white-line: rgba(255,255,255,.11);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); scroll-padding-top: 92px; }
body { margin: 0; background: var(--black); color: var(--cream); font-family: "DM Sans", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
section { background: var(--black); }

.site-header { height: 92px; padding: 0 4.5vw; display: flex; align-items: center; justify-content: space-between; position: fixed; top: 0; left: 0; z-index: 50; width: 100%; background: rgba(5,5,5,.94); border-bottom: 1px solid var(--white-line); box-shadow: 0 8px 30px rgba(0,0,0,.35); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.brand { display: flex; align-items: center; gap: 13px; min-width: 260px; }
.brand img { width: 55px; height: 55px; border-radius: 50%; object-fit: cover; }
.brand strong, .brand small { display: block; }
.brand strong { font: 600 15px Manrope; letter-spacing: -.02em; }
.brand small { color: var(--gold-bright); font: italic 10px "Playfair Display"; margin-top: 3px; }
.desktop-nav { display: flex; align-items: center; gap: clamp(17px, 1.8vw, 30px); }
.desktop-nav > a, .nav-dropdown > button { background: none; border: 0; padding: 35px 0; font-size: 12px; cursor: pointer; transition: color .2s; }
.desktop-nav > a:hover, .nav-dropdown:hover > button { color: var(--gold-bright); }
.nav-dropdown { position: relative; }
.nav-dropdown button span { margin-left: 5px; color: var(--gold-bright); }
.dropdown-menu { position: absolute; top: 77px; left: -22px; width: 250px; padding: 9px; background: #111; border: 1px solid var(--line); box-shadow: 0 20px 50px rgba(0,0,0,.55); opacity: 0; visibility: hidden; transform: translateY(8px); transition: .22s; }
.nav-dropdown:hover .dropdown-menu, .nav-dropdown.open .dropdown-menu { opacity: 1; visibility: visible; transform: none; }
.dropdown-menu a { display: flex; gap: 15px; align-items: center; padding: 14px; font-size: 11px; border-bottom: 1px solid var(--white-line); }
.dropdown-menu a:last-child { border-bottom: 0; }
.dropdown-menu a:hover { background: #191713; color: var(--gold-bright); }
.dropdown-menu span { color: var(--gold-soft); font-size: 8px; }
.header-action { min-width: 260px; text-align: right; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--gold-bright); }
.header-action span { margin-left: 10px; }
.menu-button, .mobile-menu { display: none; }

.hero { min-height: 760px; padding: 150px 4.5vw 130px; position: relative; overflow: hidden; display: flex; align-items: flex-start; border-bottom: 1px solid var(--white-line); }
.hero:after { content: ""; position: absolute; width: 700px; height: 700px; border-radius: 50%; right: -150px; top: 80px; background: radial-gradient(circle, rgba(185,133,66,.14), transparent 67%); filter: blur(5px); }
.hero-grid { position: absolute; inset: 0; opacity: .06; background-image: linear-gradient(var(--cream) 1px, transparent 1px), linear-gradient(90deg, var(--cream) 1px, transparent 1px); background-size: 90px 90px; mask-image: linear-gradient(to right, black, transparent 75%); }
.hero-copy { width: 78%; max-width: 1050px; position: relative; z-index: 2; padding-top: 20px; }
.overline, .section-tag { display: block; color: var(--gold-bright); text-transform: uppercase; letter-spacing: .18em; font-size: 9px; font-weight: 600; }
h1, h2 { margin: 0; font-family: Manrope, sans-serif; letter-spacing: -.06em; }
h1 { font-size: clamp(69px, 8vw, 128px); line-height: .9; font-weight: 500; margin: 30px 0 35px; }
h1 em, h2 em { color: var(--gold-bright); font-family: "Playfair Display", serif; font-weight: 500; }
.hero-copy > p { max-width: 570px; color: #aaa59f; line-height: 1.75; font-size: 15px; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 42px; }
.button { border: 0; padding: 17px 20px; display: inline-flex; align-items: center; justify-content: space-between; gap: 40px; cursor: pointer; font-size: 11px; font-weight: 600; }
.gold-button { background: linear-gradient(135deg, #c89857, #9f6d31); color: #070604; }
.button span { font-size: 17px; }
.line-link { font-size: 11px; padding-bottom: 7px; border-bottom: 1px solid #756d63; color: #c3bdb5; }
.line-link span { color: var(--gold-bright); margin-left: 9px; }
.hero-mark { position: absolute; right: 6vw; top: 150px; width: min(39vw, 540px); height: min(39vw, 540px); z-index: 3; display: grid; place-items: center; }
.hero-mark img { width: 82%; height: 82%; object-fit: cover; border-radius: 50%; position: relative; z-index: 2; mix-blend-mode: screen; filter: contrast(1.08) drop-shadow(0 30px 60px rgba(0,0,0,.8)); }
.logo-halo { position: absolute; inset: 0; border: 1px solid var(--line); border-radius: 50%; box-shadow: 0 0 0 45px rgba(185,133,66,.025), 0 0 0 90px rgba(185,133,66,.018); }
.export-note { position: absolute; bottom: -20px; font-size: 8px; letter-spacing: .2em; color: #746858; }
.hero-proof { position: absolute; left: 4.5vw; right: 4.5vw; bottom: 0; height: 112px; border-top: 1px solid var(--white-line); display: flex; justify-content: flex-end; z-index: 3; }
.hero-proof div { min-width: 180px; border-left: 1px solid var(--white-line); padding: 0 25px; display: flex; align-items: center; gap: 12px; }
.hero-proof strong { color: var(--gold-bright); font: 500 26px Manrope; }
.hero-proof span { color: #79746d; font-size: 8px; line-height: 1.45; text-transform: uppercase; letter-spacing: .08em; }

.company-section { padding: 130px 4.5vw; display: grid; grid-template-columns: 1fr 1fr; gap: 65px 7vw; }
.section-intro h2, .quality-heading h2, .tracking-copy h2, .order-copy h2, .contact-content h2 { font-size: clamp(48px, 5.8vw, 88px); line-height: .96; font-weight: 500; margin-top: 26px; }
.company-copy { padding-top: 35px; }
.company-copy p { color: var(--muted); font-size: 14px; line-height: 1.8; max-width: 540px; }
.company-copy .lead { color: var(--cream); font: 500 22px/1.45 Manrope; letter-spacing: -.035em; }
.pillars { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid var(--line); }
.pillar { min-height: 340px; padding: 35px 4vw 20px 0; border-right: 1px solid var(--line); position: relative; }
.pillar + .pillar { padding-left: 4vw; }
.pillar:last-child { border-right: 0; }
.pillar > span { color: var(--gold-soft); font-size: 9px; }
.pillar > i { display: grid; place-items: center; width: 54px; height: 54px; border: 1px solid var(--gold-soft); border-radius: 50%; color: var(--gold-bright); font: normal 500 10px Manrope; margin: 45px 0 28px; }
.pillar h3 { margin: 0 0 14px; font: 500 20px Manrope; letter-spacing: -.035em; }
.pillar p { margin: 0; color: #817c76; font-size: 12px; line-height: 1.7; max-width: 310px; }

.quality-section { padding: 120px 4.5vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 10vw; background: var(--soft-black); border-top: 1px solid var(--white-line); border-bottom: 1px solid var(--white-line); }
.quality-heading p { color: var(--muted); line-height: 1.7; max-width: 390px; font-size: 13px; margin-top: 28px; }
.quality-step { width: 100%; display: grid; grid-template-columns: 45px 1.2fr 1fr 25px; align-items: center; gap: 15px; text-align: left; padding: 25px 0; border-top: 1px solid var(--white-line); background: transparent; cursor: pointer; transition: padding .2s, background .2s; }
.quality-step:last-child { border-bottom: 1px solid var(--white-line); }
.quality-step > span { color: #625e58; font-size: 9px; }
.quality-step strong { font: 500 14px Manrope; }
.quality-step small { color: #69655f; font-size: 10px; }
.quality-step i { font-style: normal; color: var(--gold-bright); font-size: 17px; transition: transform .2s; }
.quality-step.active strong { color: var(--gold-bright); }
.quality-step:hover { padding-left: 12px; background: rgba(185,133,66,.045); }
.quality-step:hover strong { color: var(--gold-bright); }
.quality-step:hover i { transform: translate(3px,-3px); }

.detail-page { min-height: 100vh; padding: 175px 4.5vw 100px; background: var(--black); }
.detail-hero { display: grid; grid-template-columns: .35fr 1.65fr; gap: 5vw; padding-bottom: 75px; border-bottom: 1px solid var(--line); }
.detail-index { color: var(--gold-bright); font: 500 clamp(72px,10vw,150px)/.85 Manrope; letter-spacing: -.08em; opacity: .4; }
.detail-heading .section-tag { margin-bottom: 26px; }
.detail-heading h1 { font-size: clamp(52px,7vw,105px); margin: 0; max-width: 1050px; }
.detail-heading > p { color: var(--muted); font-size: 15px; line-height: 1.75; max-width: 680px; margin: 32px 0 0; }
.detail-content { display: grid; grid-template-columns: .7fr 1.3fr; gap: 8vw; padding: 90px 0; }
.detail-content h2 { font-size: clamp(34px,4vw,58px); line-height: 1.05; }
.check-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--white-line); }
.check-list li { display: grid; grid-template-columns: 36px 1fr; gap: 15px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--white-line); color: #b4afa8; font-size: 14px; }
.check-list li span { width: 25px; height: 25px; display: grid; place-items: center; border: 1px solid var(--gold-soft); border-radius: 50%; color: var(--gold-bright); font-size: 9px; }
.objective-card { grid-column: 2; margin-top: -30px; padding: 38px; border: 1px solid var(--line); background: radial-gradient(circle at 90% 10%,rgba(185,133,66,.11),transparent 45%),var(--panel); }
.objective-card small { color: var(--gold-bright); font-size: 8px; letter-spacing: .16em; }
.objective-card p { font: 500 24px/1.45 Manrope; letter-spacing: -.035em; margin: 15px 0 0; max-width: 700px; }
.promise-card { margin-top: 22px; padding: 25px 30px; border-left: 2px solid var(--gold-bright); background: rgba(185,133,66,.07); color: var(--cream); font: 500 15px/1.6 Manrope; }
.promise-card strong { color: var(--gold-bright); }
.step-navigation { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding-top: 35px; border-top: 1px solid var(--white-line); }
.step-navigation a { color: var(--gold-bright); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.step-navigation .next { justify-self: end; }
.step-navigation .all-steps { color: #7d7770; }

.tracking-portal { min-height: 100vh; background: var(--black); padding-top: 92px; }
.tracking-login { min-height: calc(100vh - 92px); padding: 100px 8vw; display: grid; grid-template-columns: 1.15fr .85fr; gap: 9vw; align-items: center; background: radial-gradient(circle at 85% 35%,rgba(185,133,66,.13),transparent 28%),var(--black); }
.tracking-login-copy h1, .dashboard-heading h1 { font-size: clamp(52px,6.5vw,100px); margin: 25px 0 30px; }
.tracking-login-copy p { max-width: 580px; color: var(--muted); line-height: 1.75; font-size: 14px; }
.tracking-form { padding: 45px; border: 1px solid var(--line); background: var(--panel); box-shadow: 0 35px 90px rgba(0,0,0,.65); }
.tracking-form label { display: block; margin-bottom: 28px; }
.tracking-form label span { display: block; color: var(--gold-bright); margin-bottom: 10px; font-size: 9px; text-transform: uppercase; letter-spacing: .13em; }
.tracking-form input { width: 100%; padding: 15px 0; border: 0; border-bottom: 1px solid #49433c; background: transparent; color: var(--cream); font-size: 14px; outline: none; }
.tracking-form input:focus { border-color: var(--gold-bright); }
.tracking-form .button { width: 100%; margin-top: 10px; }
.tracking-message { min-height: 38px; margin: 15px 0 0; color: #d98d78; font-size: 10px; line-height: 1.5; }
.tracking-help { margin: 5px 0 0; color: #716b64; font-size: 9px; text-align: center; }
.tracking-help a { color: var(--gold-bright); }
.order-dashboard { padding: 55px 4.5vw 100px; }
.dashboard-toolbar { display: flex; justify-content: space-between; align-items: center; color: #716c66; font-size: 9px; padding-bottom: 28px; border-bottom: 1px solid var(--white-line); }
.dashboard-toolbar button { border: 0; background: none; color: var(--gold-bright); cursor: pointer; font-size: 10px; }
.dashboard-toolbar strong { color: #aaa39b; font-weight: 500; }
.dashboard-heading { display: flex; justify-content: space-between; align-items: flex-end; padding: 70px 0 55px; }
.dashboard-heading h1 { margin-bottom: 0; }
.current-status { min-width: 280px; padding: 25px; border: 1px solid var(--line); background: var(--panel); }
.current-status small, .current-status strong, .current-status span { display: block; }
.current-status small { color: #746d66; font-size: 7px; letter-spacing: .14em; }
.current-status strong { color: var(--gold-bright); font: 500 17px Manrope; margin: 10px 0 7px; }
.current-status span { color: #8c857d; font-size: 9px; }
.order-summary { display: grid; grid-template-columns: repeat(5,1fr); border-top: 1px solid var(--white-line); border-bottom: 1px solid var(--white-line); }
.order-summary div { min-height: 105px; padding: 25px 20px; border-right: 1px solid var(--white-line); }
.order-summary div:first-child { padding-left: 0; }
.order-summary div:last-child { border-right: 0; }
.order-summary small, .order-summary strong { display: block; }
.order-summary small { color: var(--gold-soft); font-size: 7px; letter-spacing: .13em; margin-bottom: 10px; }
.order-summary strong { font: 500 12px/1.4 Manrope; }
.dashboard-progress { height: 4px; margin: 45px 0 90px; background: #24211e; }
.dashboard-progress i { display: block; height: 100%; background: linear-gradient(90deg,var(--gold-soft),var(--gold-bright)); transition: width .5s; }
.organic-traceability-panel { padding: 65px; margin-bottom: 110px; border: 1px solid var(--line); background: radial-gradient(circle at 90% 10%,rgba(185,133,66,.12),transparent 35%),#0d0c0b; display: grid; grid-template-columns: .75fr 1.25fr; gap: 7vw; }
.organic-panel-heading h2, .tracker-section-heading h2 { font-size: clamp(42px,5vw,72px); line-height: .98; margin-top: 25px; }
.organic-panel-heading p { color: var(--muted); font-size: 11px; line-height: 1.7; max-width: 350px; }
.organic-trace-list { border-top: 1px solid var(--white-line); }
.organic-trace-item { display: grid; grid-template-columns: 38px 1fr auto; gap: 15px; align-items: center; padding: 21px 0; border-bottom: 1px solid var(--white-line); }
.organic-trace-item > i { width: 27px; height: 27px; border: 1px solid #4e4943; border-radius: 50%; display: grid; place-items: center; font: normal 8px Manrope; color: #777068; }
.organic-trace-item.complete > i { background: var(--gold-bright); border-color: var(--gold-bright); color: #090807; }
.organic-trace-item.current > i { border: 5px solid var(--gold-bright); color: transparent; }
.organic-trace-item strong, .organic-trace-item small { display: block; }
.organic-trace-item strong { font: 500 12px Manrope; margin-bottom: 5px; }
.organic-trace-item small { color: #716b64; font-size: 9px; }
.organic-trace-item > b { color: #6f6962; font: 500 8px Manrope; text-transform: uppercase; letter-spacing: .08em; }
.organic-trace-item.complete > b, .organic-trace-item.current > b { color: var(--gold-bright); }
.dashboard-certs { grid-column: 2; display: flex; flex-wrap: wrap; gap: 7px; margin-top: -35px; }
.dashboard-certs span { padding: 7px 10px; border: 1px solid var(--line); border-radius: 20px; color: var(--gold-bright); font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.nine-step-tracker { display: grid; grid-template-columns: .65fr 1.35fr; gap: 8vw; }
.dashboard-steps { border-top: 1px solid var(--white-line); }
.dashboard-step { position: relative; display: grid; grid-template-columns: 50px 1fr auto; gap: 18px; min-height: 130px; padding: 25px 0; border-bottom: 1px solid var(--white-line); }
.dashboard-step:after { content: ""; position: absolute; left: 16px; top: 59px; bottom: -1px; width: 1px; background: #3b3732; }
.dashboard-step:last-child:after { display: none; }
.step-marker { position: relative; z-index: 1; width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid #504a43; border-radius: 50%; background: var(--black); color: #706961; font: 500 8px Manrope; }
.dashboard-step.complete .step-marker { background: var(--gold-bright); border-color: var(--gold-bright); color: var(--black); }
.dashboard-step.current .step-marker { border: 6px solid var(--gold-bright); color: transparent; }
.step-copy small { color: #625c56; font-size: 7px; letter-spacing: .13em; }
.step-copy h3 { margin: 8px 0 10px; font: 500 17px Manrope; }
.step-copy p { margin: 0; color: #756f68; font-size: 10px; line-height: 1.6; }
.dashboard-step.current .step-copy h3 { color: var(--gold-bright); }
.step-status { color: #625d57; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; padding-top: 23px; }
.dashboard-step.complete .step-status, .dashboard-step.current .step-status { color: var(--gold-bright); }
.dashboard-contact { margin-top: 100px; padding: 45px 0; display: flex; align-items: center; gap: 35px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.dashboard-contact p { margin: 0 auto 0 0; font: 500 19px Manrope; }
.dashboard-contact a { color: var(--gold-bright); font-size: 10px; }

.employee-portal { min-height: 100vh; padding-top: 92px; background: var(--black); }
.employee-login { min-height: calc(100vh - 92px); padding: 90px 8vw; display: grid; grid-template-columns: 1.1fr .9fr; gap: 10vw; align-items: center; background: radial-gradient(circle at 80% 30%,rgba(185,133,66,.12),transparent 30%),var(--black); }
.employee-login-copy h1 { font-size: clamp(65px,8vw,120px); margin: 25px 0; }
.employee-login-copy p { max-width: 480px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.employee-dashboard { padding: 55px 4.5vw 110px; }
.employee-toolbar { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 40px; border-bottom: 1px solid var(--white-line); }
.employee-toolbar h1 { font-size: clamp(40px,5vw,70px); margin: 15px 0 0; }
.employee-toolbar button { border: 0; background: none; color: var(--gold-bright); cursor: pointer; font-size: 10px; }
.employee-toolbar-actions { display: flex; align-items: center; gap: 28px; }
.employee-toolbar .employee-create-toggle { display: inline-flex; padding: 12px 16px; border: 1px solid var(--gold-soft); color: var(--gold-bright); background: rgba(185,133,66,.06); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.employee-search-panel { display: grid; grid-template-columns: .7fr 1.3fr; gap: 7vw; align-items: end; padding: 65px 0; }
.employee-search-panel h2 { font-size: 34px; margin: 15px 0 0; }
.employee-search-panel form { display: grid; grid-template-columns: 1fr auto; gap: 12px; }
.employee-search-panel input { width: 100%; border: 1px solid #393530; background: var(--panel); color: var(--cream); padding: 17px; outline: none; }
.employee-search-panel input:focus { border-color: var(--gold-bright); }
.employee-search-panel > p { grid-column: 2; margin: -5px 0 0; min-height: 15px; color: #d98d78; font-size: 10px; }
.employee-order-directory { margin-bottom: 90px; }
.directory-heading { display: flex; justify-content: space-between; padding: 14px 0; color: var(--gold-bright); font-size: 8px; letter-spacing: .13em; }
.directory-heading small { color: #736d66; }
.directory-table { border-top: 1px solid var(--line); }
.directory-row { display: grid; grid-template-columns: .65fr 1.1fr 1fr 1fr; gap: 20px; align-items: center; width: 100%; min-height: 68px; padding: 14px 18px; border: 0; border-bottom: 1px solid var(--white-line); background: transparent; color: var(--cream); text-align: left; }
.directory-labels { min-height: 45px; color: #68625c; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.order-directory-button { cursor: pointer; transition: background .2s; }
.order-directory-button:hover { background: rgba(185,133,66,.06); }
.order-directory-button strong { color: var(--gold-bright); font: 500 11px Manrope; }
.order-directory-button span { color: #8d867f; font-size: 10px; }
.employee-order-editor { scroll-margin-top: 115px; padding: 50px; border: 1px solid var(--line); background: var(--panel); }
.employee-create-order { margin: 55px 0 10px; background: radial-gradient(circle at 90% 5%,rgba(185,133,66,.1),transparent 32%),var(--panel); }
.editor-heading { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 35px; margin-bottom: 40px; border-bottom: 1px solid var(--white-line); }
.editor-heading h2 { font-size: 40px; margin: 13px 0 0; }
.editor-close { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--gold-bright); cursor: pointer; font-size: 22px; }
.editor-type { padding: 7px 11px; border: 1px solid var(--line); border-radius: 20px; color: var(--gold-bright); font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }
.employee-order-editor form > label, .employee-order-editor .field-pair label { display: block; margin-bottom: 25px; }
.employee-order-editor label > span { display: block; margin-bottom: 8px; color: var(--gold-bright); font-size: 8px; text-transform: uppercase; letter-spacing: .12em; }
.employee-order-editor input, .employee-order-editor select, .employee-order-editor textarea { width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid #423d37; border-radius: 0; outline: none; background: transparent; color: var(--cream); font-size: 11px; }
.employee-order-editor select { cursor: pointer; color-scheme: dark; }
.employee-order-editor option { color: #111; }
.employee-order-editor input:focus, .employee-order-editor select:focus, .employee-order-editor textarea:focus { border-color: var(--gold-bright); }
.employee-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-top: 12px; }
.employee-form-actions .form-status { margin: 0; max-width: 450px; }
.employee-form-actions .success-message { color: var(--gold-bright); }
.employee-form-actions .success-message strong, .employee-form-actions .success-message span { display: block; }
.employee-form-actions .success-message strong { font: 600 14px Manrope; margin-bottom: 5px; }
.employee-form-actions .success-message span { color: #9d968e; font-size: 9px; }
.order-directory-button.newly-created { background: rgba(185,133,66,.16); box-shadow: inset 3px 0 0 var(--gold-bright); }

.products-section { padding: 130px 4.5vw 0; }
.products-section > .section-intro { max-width: 1000px; }
.products-section > .section-intro p { color: var(--muted); line-height: 1.7; width: 480px; max-width: 100%; margin: 28px 0 90px; }
.division-block { scroll-margin-top: 30px; padding: 80px 0 120px; border-top: 1px solid var(--line); }
.division-heading { display: grid; grid-template-columns: .35fr 1fr .5fr; gap: 4vw; align-items: end; margin-bottom: 55px; }
.division-number { color: var(--gold-soft); font-size: 9px; letter-spacing: .16em; align-self: start; }
.division-heading h3 { margin: 0 0 12px; font: 500 clamp(36px,4vw,58px) Manrope; letter-spacing: -.055em; }
.division-heading p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; max-width: 600px; }
.division-heading > a { justify-self: end; font-size: 10px; color: var(--gold-bright); border-bottom: 1px solid var(--gold-soft); padding-bottom: 7px; }
.fabric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 65px 25px; }
.fabric-art { height: 360px; position: relative; overflow: hidden; background: #151412; border: 1px solid var(--white-line); }
.fabric-art > span { position: absolute; z-index: 3; top: 18px; left: 18px; width: 30px; height: 30px; display: grid; place-items: center; background: rgba(5,5,5,.85); border: 1px solid var(--line); font-size: 8px; color: var(--gold-bright); }
.fabric-art div { position: absolute; inset: -15%; }
.grey-art { background: #27221c; }
.grey-art div { transform: rotate(-12deg); background: repeating-linear-gradient(0deg, rgba(220,200,170,.13) 0 1px, transparent 1px 5px), repeating-linear-gradient(90deg, rgba(0,0,0,.22) 0 1px, transparent 1px 5px), linear-gradient(135deg,#5e5140,#211d18); }
.poplin-art div { inset: 10% -10%; transform: rotate(-10deg); background: linear-gradient(100deg,#171511,#6d573e 18%,#28231c 39%,#9a764a 57%,#30271c 77%,#715737); box-shadow: 0 30px 70px #000; }
.sheeting-art div { width: 120%; height: 80%; left: -10%; top: 8%; border-radius: 50%; transform: rotate(7deg); background: radial-gradient(ellipse at 30% 25%, #806b51, #2a241d 48%, #a48966 68%, #211e1a); box-shadow: 0 25px 60px #000; }
.canvas-art { background: #2b2117; }
.canvas-art div { background: repeating-linear-gradient(45deg,transparent 0 3px,rgba(210,164,99,.14) 3px 5px), repeating-linear-gradient(-45deg,transparent 0 3px,rgba(0,0,0,.3) 3px 5px); transform: scale(1.5) rotate(4deg); }
.fabric-card h4 { margin: 22px 0 10px; font: 500 20px Manrope; letter-spacing: -.03em; }
.fabric-card p { color: #807b75; font-size: 11px; line-height: 1.65; max-width: 470px; }
.fabric-card ul { display: flex; list-style: none; padding: 12px 0 0; margin: 0; border-top: 1px solid var(--white-line); gap: 7px; }
.fabric-card li, .certifications span { padding: 6px 9px; border: 1px solid var(--white-line); border-radius: 20px; color: #8f8880; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.organic-block { background: #0a0908; margin: 0 -4.5vw; padding-left: 4.5vw; padding-right: 4.5vw; }
.organic-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 6vw; }
.organic-products { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.organic-products > div { padding: 30px 25px 35px 0; border-bottom: 1px solid var(--line); }
.organic-products > div:nth-child(even) { padding-left: 25px; border-left: 1px solid var(--line); }
.organic-products span { color: var(--gold-soft); font-size: 8px; }
.organic-products h4 { margin: 22px 0 10px; font: 500 16px Manrope; }
.organic-products p { margin: 0; color: #77716a; line-height: 1.6; font-size: 10px; }
.trace-card { padding: 45px; border: 1px solid var(--line); background: radial-gradient(circle at 80% 10%,rgba(185,133,66,.12),transparent 45%),#11100e; }
.trace-label { color: var(--gold-bright); font-size: 8px; letter-spacing: .16em; }
.trace-card > h4 { font: 500 32px/1.15 Manrope; letter-spacing: -.04em; max-width: 430px; margin: 24px 0 15px; }
.trace-card > p { color: #858078; font-size: 11px; line-height: 1.7; max-width: 490px; }
.trace-route { margin: 38px 0; }
.trace-route > div { display: flex; gap: 20px; min-height: 72px; position: relative; }
.trace-route > div:after { content:""; position: absolute; left: 15px; top: 34px; height: 38px; width: 1px; background: var(--gold-soft); }
.trace-route > div:last-child:after { display: none; }
.trace-route i { z-index: 1; width: 31px; height: 31px; border: 1px solid var(--gold-soft); background: var(--panel); color: var(--gold-bright); border-radius: 50%; display: grid; place-items: center; font: normal 500 8px Manrope; }
.trace-route strong, .trace-route small { display: block; }
.trace-route strong { font: 500 12px Manrope; margin: 2px 0 5px; }
.trace-route small { color: #6e6963; font-size: 9px; }
.certifications { display: flex; flex-wrap: wrap; gap: 7px; }
.certifications span { color: var(--gold-bright); border-color: var(--line); }

.tracking-section { padding: 130px 4.5vw; display: grid; grid-template-columns: .85fr 1.15fr; gap: 10vw; align-items: center; border-top: 1px solid var(--white-line); }
.tracking-copy p { color: var(--muted); font-size: 13px; line-height: 1.75; max-width: 440px; margin-top: 30px; }
.tracker-card { border: 1px solid var(--line); background: #0f0e0d; box-shadow: 0 30px 80px #000; }
.tracker-top, .tracker-bottom { display: flex; justify-content: space-between; padding: 18px 22px; font-size: 8px; letter-spacing: .1em; color: #77716a; }
.tracker-top { border-bottom: 1px solid var(--white-line); }
.tracker-top i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-bright); box-shadow: 0 0 0 5px rgba(211,164,99,.1); margin-right: 9px; }
.tracker-top strong { color: var(--cream); font: 500 9px Manrope; }
.tracker-main { padding: 35px; }
.tracker-main > small { font-size: 7px; color: #6d6862; letter-spacing: .15em; }
.tracker-main > h3 { margin: 8px 0 20px; font: 500 18px Manrope; color: var(--gold-bright); }
.progress { height: 3px; background: #292622; margin-bottom: 30px; }
.progress i { display: block; width: 20%; height: 100%; background: var(--gold-bright); transition: width .35s; }
.tracker-quantity { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tracker-quantity div { background: #171512; padding: 18px; }
.tracker-quantity small, .tracker-quantity strong { display: block; }
.tracker-quantity small { color: #716c65; font-size: 7px; letter-spacing: .12em; margin-bottom: 7px; }
.tracker-quantity strong { font: 500 17px Manrope; }
.timeline { display: grid; grid-template-columns: repeat(4,1fr); margin-top: 35px; }
.timeline span { position: relative; padding-top: 28px; border-top: 1px solid #36322e; }
.timeline span > i { position: absolute; top: -8px; left: 0; width: 15px; height: 15px; display: grid; place-items: center; border: 1px solid #4a4540; background: #0f0e0d; border-radius: 50%; font: normal 7px sans-serif; }
.timeline .done i { background: var(--gold-bright); color: #111; }
.timeline .current i { border: 4px solid var(--gold-bright); }
.timeline b, .timeline small { display: block; padding-right: 8px; }
.timeline b { font: 500 9px Manrope; }
.timeline small { color: #65605b; font-size: 7px; margin-top: 5px; }
.tracker-bottom { background: #171512; }

.order-section { padding: 130px 4.5vw; display: grid; grid-template-columns: .8fr 1.2fr; gap: 9vw; background: var(--soft-black); border-top: 1px solid var(--white-line); }
.order-copy > p { color: var(--muted); font-size: 13px; line-height: 1.75; max-width: 430px; margin: 30px 0 48px; }
.order-note { display: grid; grid-template-columns: 25px 1fr; gap: 12px 15px; max-width: 390px; }
.order-note span { color: var(--gold-bright); font-size: 8px; }
.order-note p { margin: 0; padding-bottom: 13px; border-bottom: 1px solid var(--white-line); color: #7f7a74; font-size: 10px; }
.order-form { padding: 45px; border: 1px solid var(--line); background: #0e0d0c; }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.order-form label { display: block; margin-bottom: 23px; }
.order-form label > span { display: block; color: var(--gold-bright); font-size: 8px; text-transform: uppercase; letter-spacing: .12em; margin-bottom: 8px; }
.order-form input, .order-form select, .order-form textarea { width: 100%; padding: 12px 0; color: var(--cream); background: transparent; border: 0; border-bottom: 1px solid #3b3732; border-radius: 0; outline: none; font-size: 11px; }
.order-form textarea { resize: vertical; }
.order-form input:focus, .order-form select:focus, .order-form textarea:focus { border-color: var(--gold-bright); }
.order-form option { color: #111; }
.form-button { width: 100%; margin-top: 5px; }
.form-status { color: var(--gold-bright); font-size: 10px; min-height: 14px; margin: 12px 0 0; }
.form-honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; }

.thank-you-page { min-height: 100vh; padding: 170px 4.5vw 90px; display: grid; place-items: center; text-align: center; background: radial-gradient(circle at 50% 35%,rgba(185,133,66,.15),transparent 32%),var(--black); }
.thank-you-card { max-width: 850px; }
.thank-you-card img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; margin-bottom: 35px; }
.thank-you-card h1 { font-size: clamp(55px,8vw,110px); margin: 25px 0 30px; }
.thank-you-card p { max-width: 620px; margin: 0 auto 38px; color: var(--muted); font-size: 14px; line-height: 1.75; }

.contact-section { min-height: 690px; padding: 110px 8vw; display: grid; grid-template-columns: .75fr 1.25fr; gap: 10vw; align-items: center; border-top: 1px solid var(--line); }
.contact-logo { display: flex; justify-content: center; }
.contact-logo img { width: min(390px,100%); border-radius: 50%; mix-blend-mode: screen; filter: drop-shadow(0 25px 60px #000); }
.contact-details { margin-top: 55px; }
.contact-details a { display: grid; grid-template-columns: 155px 1fr 25px; align-items: center; padding: 25px 0; border-top: 1px solid var(--white-line); }
.contact-details a:last-child { border-bottom: 1px solid var(--white-line); }
.contact-details small { color: var(--gold-soft); font-size: 8px; letter-spacing: .12em; }
.contact-details strong { font: 500 clamp(16px,2vw,25px) Manrope; letter-spacing: -.03em; }
.contact-details span { color: var(--gold-bright); }

footer { background: var(--black); padding: 70px 4.5vw 25px; border-top: 1px solid var(--white-line); }
.footer-brand { display: flex; align-items: center; gap: 15px; }
.footer-brand img { width: 65px; height: 65px; object-fit: cover; border-radius: 50%; }
.footer-brand strong, .footer-brand span { display: block; }
.footer-brand strong { font: 500 16px Manrope; }
.footer-brand span { font: italic 11px "Playfair Display"; color: var(--gold-bright); margin-top: 4px; }
footer > nav { display: flex; justify-content: flex-end; gap: 28px; margin-top: -42px; padding-bottom: 70px; }
footer > nav a { color: #837e77; font-size: 10px; }
footer > nav a:hover { color: var(--gold-bright); }
.footer-bottom { border-top: 1px solid var(--white-line); padding-top: 22px; display: flex; justify-content: space-between; color: #5f5a55; font-size: 8px; text-transform: uppercase; letter-spacing: .1em; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity: 1; transform: none; }
.delay-1 { transition-delay: .12s; }
.delay-2 { transition-delay: .24s; }

@media (max-width: 980px) {
  .desktop-nav, .header-action { display: none; }
  .menu-button { display: flex; flex-direction: column; gap: 6px; border: 0; background: none; padding: 9px; }
  .menu-button span { width: 25px; height: 1px; background: var(--gold-bright); }
  .mobile-menu { position: absolute; top: 92px; left: 0; right: 0; padding: 25px 4.5vw 30px; background: #090909; border-bottom: 1px solid var(--line); flex-direction: column; gap: 18px; }
  .mobile-menu.open { display: flex; }
  .mobile-menu a { font-size: 12px; }
  .mobile-menu .mobile-label { color: var(--gold-bright); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; margin-top: 5px; }
  .mobile-menu .sub-link { padding-left: 18px; color: #97918a; }
  .hero { min-height: 760px; }
  .hero-copy { width: 100%; }
  .hero-proof { display: none; }
  .company-section, .quality-section, .tracking-section, .order-section, .contact-section { grid-template-columns: 1fr; }
  .company-copy { padding-top: 0; }
  .quality-section, .tracking-section, .order-section, .contact-section { gap: 65px; }
  .division-heading { grid-template-columns: .25fr 1fr; }
  .division-heading > a { grid-column: 2; justify-self: start; }
  .organic-layout { grid-template-columns: 1fr; }
  .contact-logo img { width: 320px; }
  .detail-content { grid-template-columns: 1fr; gap: 45px; }
  .objective-card { grid-column: 1; margin-top: 0; }
  .tracking-login { grid-template-columns: 1fr; gap: 55px; padding-top: 80px; padding-bottom: 80px; }
  .dashboard-heading { align-items: flex-start; flex-direction: column; gap: 35px; }
  .order-summary { grid-template-columns: repeat(2,1fr); }
  .order-summary div { border-bottom: 1px solid var(--white-line); }
  .organic-traceability-panel, .nine-step-tracker { grid-template-columns: 1fr; }
  .dashboard-certs { grid-column: 1; margin-top: 0; }
  .employee-login { grid-template-columns: 1fr; gap: 50px; }
  .employee-search-panel { grid-template-columns: 1fr; gap: 30px; }
  .employee-search-panel > p { grid-column: 1; }
}

@media (max-width: 680px) {
  html { scroll-padding-top: 76px; }
  .site-header { height: 76px; }
  .brand { min-width: 0; }
  .brand img { width: 45px; height: 45px; }
  .brand strong { font-size: 12px; }
  .brand small { font-size: 8px; }
  .mobile-menu { top: 76px; }
  .hero { min-height: 660px; padding: 120px 4.5vw 75px; }
  h1 { font-size: clamp(56px,16vw,78px); }
  .hero-copy > p { font-size: 13px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .company-section, .quality-section, .products-section, .tracking-section, .order-section, .contact-section { padding-top: 85px; padding-bottom: 85px; }
  .pillars { grid-template-columns: 1fr; }
  .pillar { min-height: auto; padding: 30px 0 40px !important; border-right: 0; border-bottom: 1px solid var(--line); }
  .pillar > i { margin: 30px 0 22px; }
  .quality-step { grid-template-columns: 30px 1fr 20px; }
  .quality-step small { display: none; }
  .fabric-grid { grid-template-columns: 1fr; }
  .fabric-art { height: 275px; }
  .division-heading { grid-template-columns: 1fr; }
  .division-heading > a { grid-column: 1; }
  .organic-products { grid-template-columns: 1fr; }
  .organic-products > div:nth-child(even) { padding-left: 0; border-left: 0; }
  .trace-card { padding: 30px 22px; }
  .timeline { grid-template-columns: 1fr; margin-left: 8px; }
  .timeline span { min-height: 65px; border-top: 0; border-left: 1px solid #36322e; padding: 0 0 20px 30px; }
  .timeline span > i { top: 0; left: -8px; }
  .field-pair { grid-template-columns: 1fr; gap: 0; }
  .order-form { padding: 30px 22px; }
  .contact-details a { grid-template-columns: 1fr 20px; gap: 8px; }
  .contact-details small { grid-column: 1 / -1; }
  .contact-details strong { overflow-wrap: anywhere; }
  footer > nav { margin-top: 45px; justify-content: flex-start; flex-wrap: wrap; padding-bottom: 45px; }
  .footer-bottom { flex-direction: column; gap: 10px; }
  .detail-page { padding-top: 125px; }
  .detail-hero { grid-template-columns: 1fr; gap: 30px; }
  .detail-index { font-size: 68px; }
  .detail-content { padding: 60px 0; }
  .objective-card { padding: 28px 22px; }
  .objective-card p { font-size: 19px; }
  .step-navigation { grid-template-columns: 1fr 1fr; gap: 25px; }
  .step-navigation .all-steps { grid-column: 1 / -1; grid-row: 2; text-align: center; }
  .tracking-portal { padding-top: 76px; }
  .tracking-login { min-height: calc(100vh - 76px); padding: 65px 4.5vw; }
  .tracking-login-copy h1, .dashboard-heading h1 { font-size: clamp(46px,14vw,66px); }
  .tracking-form { padding: 30px 22px; }
  .order-dashboard { padding-top: 35px; }
  .dashboard-toolbar { align-items: flex-start; flex-direction: column; gap: 15px; }
  .current-status { min-width: 100%; }
  .order-summary { grid-template-columns: 1fr; }
  .order-summary div, .order-summary div:first-child { padding: 20px 0; border-right: 0; }
  .organic-traceability-panel { padding: 35px 22px; margin-bottom: 80px; }
  .organic-trace-item { grid-template-columns: 36px 1fr; }
  .organic-trace-item > b { grid-column: 2; }
  .dashboard-step { grid-template-columns: 43px 1fr; }
  .step-status { grid-column: 2; padding-top: 0; }
  .dashboard-contact { align-items: flex-start; flex-direction: column; gap: 15px; }
  .dashboard-contact p { margin-bottom: 12px; }
  .employee-portal { padding-top: 76px; }
  .employee-login { min-height: calc(100vh - 76px); padding: 65px 4.5vw; }
  .employee-login-copy h1 { font-size: 65px; }
  .employee-dashboard { padding-top: 35px; }
  .employee-toolbar { align-items: flex-start; flex-direction: column; gap: 25px; }
  .employee-toolbar-actions { width: 100%; justify-content: space-between; }
  .employee-search-panel form { grid-template-columns: 1fr; }
  .directory-labels { display: none; }
  .directory-row { grid-template-columns: 1fr; gap: 7px; padding: 20px 12px; }
  .employee-order-editor { padding: 30px 20px; }
  .editor-heading { align-items: flex-start; flex-direction: column; gap: 20px; }
  .employee-form-actions { align-items: stretch; flex-direction: column; }
  .employee-form-actions .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
}