/* HALA concept 02: derived from the supplied logo and working shop reference. */
:root {
  --paper: #fff;
  --ink: #2e3032;
  --orange: #2e3032;
  --line: #e1e0de;
  --muted: #656568;
  --green: #2e3032;
  --cream: #f3f1ef;
  --radius: 0;
  --typewriter: "Courier New", Courier, monospace;
  color: var(--ink);
  background: var(--paper);
}

.concept-bar { background: #2e3032; color: #dedddd; }
.concept-bar i { background: #e4d3d2; }
.concept-bar a { color: #c5c3c4; }
.transition-bar { background: #f4eeee; font-family: var(--typewriter); }
.site-header { height: 120px; border-bottom: 1px solid #eee; }
.wordmark { gap: 15px; letter-spacing: 0; }
.hala-logo { width: 104px; height: auto; flex: 0 0 auto; }
.brand-print {
  border-left: 1px solid #c7c5c4;
  padding: 3px 0 3px 14px;
  margin: 0;
  color: #2e3032;
  font-family: var(--typewriter);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 2px;
  line-height: 1.5;
}
.brand-print > span {
  display: block;
  font-size: 7px;
  letter-spacing: .8px;
  font-weight: 400;
  white-space: nowrap;
}
.desktop-nav, .language, .eyebrow, .image-caption, .image-top-label,
.product-index, .product-badge, .audience-strip > span,
.technology-list small, .tech-tag, .steps article > span {
  font-family: var(--typewriter);
}
.desktop-nav { gap: 25px; font-weight: 400; font-size: 12px; text-transform: uppercase; }
.desktop-nav a:hover, .text-link:hover { color: #866362; }
.header-actions { gap: 18px; }
.button { border-radius: 0; }
.button.dark, .button.primary { background: #2e3032; color: white; }
.button.dark:hover, .button.primary:hover { background: #4a4446; }
.button.cream { background: #fff; color: #2e3032; }
.button:focus-visible, a:focus-visible, summary:focus-visible { outline-color: #8d6569; }
.hero { gap: 48px; padding-top: 43px; padding-bottom: 59px; }
.hero .eyebrow { margin-bottom: 25px; letter-spacing: 1.2px; }
.dot { border-radius: 0; background: #2e3032; }
h1, h2 { font-family: var(--typewriter); font-weight: 700; }
h1 { font-size: clamp(42px, 4.25vw, 62px); line-height: 1.13; letter-spacing: -2.8px; }
h1 em { color: #2e3032; }
h2 { font-size: 35px; letter-spacing: -1.4px; line-height: 1.22; }
.hero-description { color: #626165; font-size: 15px; line-height: 1.85; }
.hero-footnote { color: #727074; }
.image-frame { border-radius: 0; background: #e9dfd6; }
.image-top-label { color: #383335; font-size: 8px; letter-spacing: 1.1px; }
.image-stamp { border-radius: 0; transform: none; gap: 15px; border: 1px solid #ddd; }
.image-frame .stamp-logo { position: static; inset: auto; flex-shrink: 0; width: 60px; height: auto; }
.image-caption { color: #6c696d; }
.audience-strip { min-height: 76px; }
.audience-strip > span { color: #656368; }
.audience-strip p { font-family: var(--typewriter); font-size: 15px; font-weight: 400; }
.audience-strip i { color: #aaa2a3; font-size: 15px; }
.section-heading > p { color: #656568; }
.product-art { border-radius: 0; }
.apparel .product-art { background: #f3f1ef; }
.workwear .product-art { background: #edeeee; }
.gifts .product-art { background: #eee1df; }
.product-index { color: #656568; }
.round-arrow { border-radius: 0; background: #ffffffbd; }
.product-badge { border-radius: 0; background: #fff; font-size: 8px; }
.product-info h3 { font-family: var(--typewriter); font-size: 17px; letter-spacing: -.5px; }
.custom-icon { color: #6b6469; }
.technology-section { background: #2e3032; color: #fff; }
.technology-layout .eyebrow, .technology-intro { color: #c7c2c5; }
.technology-layout h2 { font-size: 36px; }
.technology-list b { font-family: var(--typewriter); color: white; font-weight: 400; }
.technology-list small, .technology-list i { color: #c7c2c5; }
.tech-tag { background: #e4d3d2; color: #2e3032; border-radius: 0; }
.tech-tag.muted { color: #e7e1e4; border-color: #ffffff4d; }
.technology-list details > p { color: #d9d4d7; }
.steps i { color: #8b7076; }
.steps h3, .custom-project h3 { font-family: var(--typewriter); }
.about-section h2 { font-size: 28px; }
.final-cta { background: #eee2e0; border-radius: 0; padding-block: 43px; }
.final-cta h2 { font-size: 41px; }
.site-footer .hala-logo { width: 88px; }
.site-footer .brand-print { font-size: 12px; padding-left: 11px; }
.site-footer .brand-print > span { font-size: 6px; }
.footer-note a { display: inline-block; margin-top: 8px; text-decoration: underline; text-underline-offset: 3px; }
dialog { border-radius: 0; background: #fff; }
dialog::backdrop { background: #282529a6; }
.close-button { border-radius: 0; }
dialog h2 { font-size: 30px; }
input, select, textarea { border-color: #ccc6c8; border-radius: 0; background: #fff; }
.form-grid .upload-zone { border-radius: 0; border-color: #b1a7ac; background: #f5f0f1; }
.result-icon { background: #ede4e6; }
.demo-notice { background: #f3edef; }
.plan-hero h1 { font-size: 54px; }
.plan-summary { background: #f3edef; border-radius: 0; }
.plan-block h2 { font-size: 29px; }
.plan-columns article { background: #f5f3f2; border-radius: 0; }
.plan-columns h3 { font-family: var(--typewriter); }
.plan-table th { background: #f3edef; }
.plan-flow b { background: #2e3032; color: #fff; border-radius: 0; }
.plan-flow span { color: #8a7075; }
.plan-swatch div { border-radius: 0; }

@media (max-width: 1180px) {
  .desktop-nav { font-size: 10px; gap: 18px; }
  .site-header { gap: 18px; }
  .hero { gap: 30px; }
  h1 { font-size: 48px; letter-spacing: -2.6px; }
  .brand-print { padding-left: 11px; font-size: 13px; }
  .hala-logo { width: 90px; }
  .brand-print > span { font-size: 6px; }
  .audience-strip p { font-size: 13px; }
}
@media (max-width: 950px) {
  h1 { font-size: 38px; letter-spacing: -2.4px; }
  .site-header { height: 104px; }
  .section-heading h2, .technology-layout h2 { font-size: 29px; }
  .product-info h3 { font-size: 14px; }
  .about-section h2 { font-size: 27px; }
  .final-cta h2 { font-size: 33px; }
  .plan-hero h1 { font-size: 43px; }
}
@media (max-width: 680px) {
  .site-header { height: 91px; }
  .wordmark { gap: 10px; }
  .hala-logo { width: 83px; }
  .brand-print { font-size: 11px; padding-left: 10px; letter-spacing: 1.8px; }
  .brand-print > span { font-size: 5px; letter-spacing: .5px; }
  .hero { padding-top: 30px; gap: 28px; padding-bottom: 32px; }
  .hero .eyebrow { margin-bottom: 22px; font-size: 8px; }
  h1 { font-size: clamp(29px, 8.65vw, 49px); line-height: 1.22; letter-spacing: -1.8px; }
  .hero-description { font-size: 13px; margin-top: 20px; }
  .hero-actions { gap: 16px; }
  .hero-actions .button { gap: 11px; padding-inline: 15px; }
  .hero-actions .text-link { font-size: 9px; }
  .image-stamp { right: 13px; bottom: 17px; padding: 12px; gap: 10px; font-size: 9px; }
  .image-frame .stamp-logo { width: 43px; }
  .image-top-label { font-size: 7px; top: 15px; left: 14px; letter-spacing: .7px; }
  .image-caption { font-size: 6px; }
  .audience-strip p { font-size: 10px; gap: 10px; }
  .audience-strip i { font-size: 10px; }
  .section-heading h2, h2 { font-size: 28px; }
  .product-info h3 { font-size: 16px; }
  .technology-layout h2 { font-size: 30px; }
  .technology-list b { font-size: 21px; }
  .technology-list small { font-size: 9px; }
  .tech-tag { font-size: 7px; }
  .steps h3 { font-size: 13px; }
  .about-section h2 { font-size: 25px; }
  .final-cta { padding: 29px 24px; }
  .final-cta h2 { font-size: 31px; }
  .site-footer .hala-logo { width: 74px; }
  .site-footer .brand-print { font-size: 10px; padding-left: 9px; }
  .site-footer .brand-print > span { font-size: 5px; }
  dialog h2 { font-size: 25px; }
  .plan-hero h1 { font-size: 39px; }
  .plan-block h2 { font-size: 25px; }
}