:root {
  --ink:#174d3c;
  --cream:#fcf8ed;
  --muted:#58685a;
  --lime:#dce9ac;
  --orange:#f3a563;
  --line:#d9dfcf;
  --serif:Georgia,'Times New Roman',serif;
  --sans:'Avenir Next',Avenir,'Segoe UI',sans-serif;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:28px;
}

body {
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.65;
}

a {
  color:inherit;
  text-decoration:none;
}

button,a,summary {
  -webkit-tap-highlight-color:transparent;
}

a:focus-visible,summary:focus-visible {
  outline:3px solid #b95a28;
  outline-offset:6px;
}

img {
  display:block;
  max-width:100%;
  height:auto;
}

figure,p,h1,h2,h3 {
  margin:0;
}

h1,h2,h3 {
  line-height:1.08;
}

h1,h2 {
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.045em;
}

.wrap {
  width:min(1240px,calc(100% - 88px));
  margin-inline:auto;
}

.preview-note {
  text-align:center;
  background:var(--ink);
  color:var(--cream);
  font-size:12px;
  letter-spacing:.08em;
  padding:9px 16px;
}

.preview-note span {
  margin:0 10px;
  color:var(--lime);
}

.skip-link {
  position:absolute;
  top:-80px;
  left:20px;
  z-index:10;
  background:var(--cream);
  padding:12px;
}

.skip-link:focus {
  top:12px;
}

.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-block:28px;
}

.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--serif);
  font-size:38px;
  font-weight:bold;
  letter-spacing:-.065em;
  line-height:.8;
}

.brand-small {
  display:block;
  font-family:var(--sans);
  font-size:9px;
  letter-spacing:.3em;
  line-height:1.8;
  margin-top:8px;
  margin-left:5px;
}

.brand-icon {
  color:#b66630;
  font-family:var(--sans);
  font-size:47px;
  font-weight:400;
  line-height:1;
}

.site-header nav {
  display:flex;
  gap:30px;
  font-size:13px;
  font-weight:600;
}

.site-header nav a:hover,.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  background:var(--ink);
  color:var(--cream);
  border:1px solid var(--ink);
  border-radius:99px;
  padding:14px 26px;
  font-size:14px;
  font-weight:600;
  transition:background .2s;
}

.button:hover {
  background:#24654b;
}

.button span {
  font-size:21px;
  line-height:1;
}

.button-small {
  font-size:12px;
  padding:11px 19px;
  gap:20px;
}

.hero {
  display:grid;
  grid-template-columns:1.03fr 1fr;
  gap:50px;
  align-items:center;
  padding:40px 0 64px;
}

.eyebrow {
  text-transform:uppercase;
  font-size:10px;
  letter-spacing:.18em;
  font-weight:700;
  margin-bottom:21px;
}

.sun {
  font-size:24px;
  vertical-align:middle;
  margin-right:8px;
  color:#a75b25;
}

.hero h1 {
  font-size:clamp(54px,5.9vw,81px);
  line-height:1.02;
  margin-bottom:25px;
}

.hero h1 em {
  font-weight:400;
  color:#ab6033;
}

.hero-description {
  max-width:415px;
  font-size:17px;
  line-height:1.7;
  margin-bottom:29px;
  color:var(--muted);
}

.hero-footnote {
  font-size:11px;
  margin-top:29px;
  color:var(--muted);
}

.hero-footnote span {
  font-size:9px;
  color:#688345;
  margin-right:7px;
}

.hero-image {
  min-width:0;
  text-align:center;
}

.hero-image img {
  width:min(100%,360px);
  margin:auto;
  background:#e8edda;
  border-radius:24px;
}

.mood-strip {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:56px;
  background:var(--lime);
  padding:19px 24px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.mood-strip span:nth-child(even) {
  font-size:24px;
  font-weight:400;
}

.section-space {
  padding-block:93px;
}

.section-heading {
  max-width:700px;
  margin:auto;
  text-align:center;
}

.section-heading h2,h2 {
  font-size:clamp(38px,4vw,54px);
}

.section-heading>p:last-child {
  color:var(--muted);
  max-width:570px;
  margin:23px auto 0;
  font-size:16px;
}

.lineup {
  background:#fff;
  margin:37px 0 0;
  border-radius:16px;
  padding:22px 35px 19px;
}

.lineup img {
  width:100%;
  max-height:320px;
  object-fit:contain;
}

.lineup figcaption {
  text-align:center;
  color:var(--muted);
  font-size:10px;
  margin-top:18px;
}

.steps {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:50px;
  margin-top:36px;
}

.step-number {
  font-size:11px;
  letter-spacing:.1em;
  color:#a65c2c;
}

.steps h3 {
  font-family:var(--serif);
  font-size:25px;
  font-weight:400;
  margin:12px 0;
}

.steps p {
  color:var(--muted);
  font-size:13px;
  max-width:310px;
}

.machine-section {
  background:#e8edda;
  padding:65px 0;
}

.machine-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
  align-items:center;
}

.machine-figure {
  text-align:center;
}

.machine-figure img {
  width:100%;
  border-radius:16px;
}

.machine-figure figcaption {
  margin-top:12px;
  font-size:12px;
  line-height:1.5;
  color:var(--muted);
}

.machine-copy>p:not(.eyebrow) {
  font-size:16px;
  color:var(--muted);
  margin:24px 0;
}

.venue-list {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  list-style:none;
  padding:0;
  margin:0 0 24px;
  font-size:13px;
}

.venue-list li {
  border-radius:99px;
  background:var(--cream);
  padding:6px 12px;
}

.text-link {
  font-size:12px;
  font-weight:600;
  display:inline-block;
}

.text-link span {
  margin-left:10px;
}

.story {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:90px;
}

.story-copy>p {
  color:var(--muted);
  font-size:15px;
  margin-bottom:22px;
}

.story-details {
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:18px 0;
  margin-top:28px;
}

.story-details summary {
  cursor:pointer;
  font-size:13px;
  font-weight:600;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.story-details summary::-webkit-details-marker {
  display:none;
}

.story-details summary span {
  font-size:23px;
  font-weight:400;
}

.story-details[open] summary span {
  transform:rotate(45deg);
}

.story-details p {
  font-size:13px;
  color:var(--muted);
  margin-top:14px;
}

.future {
  background:var(--ink);
  color:var(--cream);
  border-radius:16px;
  padding:54px 58px;
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:70px;
}

.future-intro .eyebrow {
  color:var(--lime);
}

.future-intro p:last-child {
  font-size:13px;
  color:#d7e1cf;
  margin-top:22px;
  max-width:230px;
}

.future-items article+article {
  border-top:1px solid #50735e;
  margin-top:26px;
  padding-top:26px;
}

.status-label {
  color:var(--lime);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.13em;
}

.future h3 {
  font-family:var(--serif);
  font-size:26px;
  font-weight:400;
  margin:12px 0;
}

.future-items p {
  color:#d7e1cf;
  font-size:13px;
}

.closing {
  text-align:center;
  padding:65px 0;
}

.closing>span {
  font-size:48px;
  color:#ac653b;
}

.closing p {
  font-family:var(--serif);
  font-size:29px;
  margin:12px 0 16px;
  letter-spacing:-.025em;
}

.site-footer {
  border-top:1px solid var(--line);
  padding-block:28px 34px;
  display:flex;
  align-items:center;
  gap:25px;
  justify-content:space-between;
}

.footer-brand {
  font-size:27px;
}

.footer-brand .brand-icon {
  font-size:35px;
}

.footer-brand .brand-small {
  font-size:7px;
}

.site-footer p {
  font-size:11px;
}

.site-footer p span {
  margin:0 7px;
}

.site-footer .footer-note {
  max-width:240px;
  color:var(--muted);
  font-size:9px;
  text-align:right;
}

@media(min-width:1500px) {
  .hero {
    gap:90px;
  }
}

@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 48px);
  }
  .site-header nav {
    gap:18px;
  }
  .hero {
    gap:28px;
  }
  .hero h1 {
    font-size:60px;
  }
  .machine-grid,.story {
    gap:45px;
  }
  .future {
    gap:35px;
    padding:40px;
  }
  .mood-strip {
    gap:26px;
    font-size:9px;
  }
  .steps {
    gap:30px;
  }
}

@media(max-width:740px) {
  .wrap {
    width:calc(100% - 36px);
  }
  .preview-note {
    font-size:9px;
  }
  .site-header {
    padding:22px 0;
    flex-wrap:wrap;
    gap:23px;
  }
  .brand {
    font-size:32px;
  }
  .brand-icon {
    font-size:38px;
  }
  .site-header nav {
    order:3;
    width:100%;
    justify-content:center;
    border-top:1px solid var(--line);
    padding-top:15px;
    font-size:11px;
    gap:28px;
  }
  .button-small {
    font-size:10px;
    padding:10px 13px;
    gap:10px;
  }
  .hero {
    grid-template-columns:1fr;
    padding:24px 0 40px;
    gap:36px;
  }
  .hero h1 {
    font-size:clamp(49px,10.8vw,72px);
  }
  .hero-description {
    font-size:15px;
    max-width:460px;
  }
  .hero-footnote {
    margin-top:22px;
  }
  .mood-strip {
    gap:18px;
    padding:16px 12px;
    font-size:8px;
    flex-wrap:wrap;
  }
  .section-space {
    padding-block:58px;
  }
  .section-heading h2,h2 {
    font-size:40px;
  }
  .section-heading>p:last-child {
    font-size:14px;
  }
  .lineup {
    padding:20px 12px;
    margin-top:26px;
  }
  .lineup figcaption {
    font-size:9px;
  }
  .steps {
    grid-template-columns:1fr;
    gap:25px;
  }
  .steps article {
    border-bottom:1px solid var(--line);
    padding-bottom:22px;
  }
  .steps p {
    max-width:none;
  }
  .machine-section {
    padding:40px 0;
  }
  .machine-grid,.story {
    grid-template-columns:1fr;
    gap:35px;
  }
  .machine-figure {
    max-width:420px;
    width:100%;
    margin:auto;
  }
  .machine-copy>p:not(.eyebrow) {
    font-size:14px;
  }
  .story-copy>p {
    font-size:14px;
  }
  .future {
    grid-template-columns:1fr;
    padding:35px 25px;
    gap:35px;
  }
  .future-intro p:last-child {
    max-width:none;
  }
  .closing {
    padding:46px 0;
  }
  .closing p {
    font-size:25px;
  }
  .site-footer {
    flex-wrap:wrap;
    gap:20px;
  }
  .site-footer .footer-note {
    max-width:none;
    text-align:left;
    width:100%;
  }
}

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

/* Cole's original logo: preserve its transparent canvas and orange/green artwork. */
:root { --brand-orange:#f16621; --brand-green:#00a551; --orange:#f16621; }
.site-header .brand-logo { width:175px; height:auto; display:block; }
.footer-brand .brand-logo { width:130px; height:auto; display:block; }
.hero h1 em { color:#a94e20; }
.brand-logo { object-fit:contain; }
.support-nav { border-top:1px solid var(--line); padding:24px 0; display:flex; justify-content:center; gap:24px; }
.support-nav a { font-size:13px; font-weight:600; }
.support-body { background:var(--cream); }
.support-header { max-width:850px; margin:auto; padding:28px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); }
.support-logo { width:155px; height:auto; }
.support-header>span { font-size:11px; color:var(--muted); }
.support-main { width:min(650px,calc(100% - 40px)); margin:48px auto; }
.support-main h1 { font-size:clamp(42px,8vw,64px); margin-bottom:20px; }
.support-lead { color:var(--muted); font-size:16px; line-height:1.8; margin-bottom:28px; }
.support-form { margin:25px 0; }
.support-form label { display:block; font-size:13px; font-weight:600; margin:18px 0 8px; }
.support-form input,.support-form select,.support-form textarea { width:100%; padding:13px 14px; border:1px solid #cbd6c1; border-radius:8px; background:#fff; color:var(--ink); font:inherit; font-size:16px; }
.support-form textarea { resize:vertical; }
.support-fields { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.support-hint { font-size:11px; color:var(--muted); line-height:1.7; margin:12px 0 20px; }
.support-policy,.support-demo { border-left:3px solid var(--brand-orange); padding:18px 20px; background:#fff0de; font-size:13px; line-height:1.8; margin:28px 0; }
.support-policy p { margin-top:7px; color:var(--muted); }
.support-draft { border:1px solid var(--line); border-radius:12px; padding:24px; background:#fff; margin-top:28px; }
.support-draft h2 { font-size:30px; }
.support-draft p { font-size:13px; line-height:1.8; margin-top:12px; }
.support-draft pre { font:13px/1.7 var(--sans); white-space:pre-wrap; overflow-wrap:anywhere; padding:18px; background:#f3f5ea; border-radius:8px; margin:18px 0; }
.support-contact,.support-footer { font-size:12px; color:var(--muted); text-align:center; }
.support-footer { padding:28px 20px; border-top:1px solid var(--line); }
#support-status { font-size:13px; color:var(--ink); }
@media(max-width:740px) { .site-header .brand-logo { width:135px; } .support-header { padding:22px 20px; } .support-logo { width:120px; } .support-header>span { max-width:120px; text-align:right; } .support-main { margin:35px auto; } .support-fields { grid-template-columns:1fr; gap:0; } }

.support-trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.support-error:empty { display: none; }
.support-error { color: #8c251a; font-weight: 700; }
.support-reference { overflow-wrap: anywhere; padding: 1rem; background: #fff; border-radius: 1rem; }
