@font-face{font-family:Arimo;src:url('fonts/Arimo.ttf') format('truetype');font-display:swap;font-weight:400 700}
@font-face{font-family:Tinos;src:url('fonts/Tinos.ttf') format('truetype');font-display:swap}
:root{color-scheme:dark;--background:#142d25;--deep:#0d211b;--text:#f7f3e9;--muted:#c6d5c9;--line:#527060;--lime:#dcf2b8;--ink:#1a3023}
*{box-sizing:border-box}
body{margin:0;background:var(--background);color:var(--text);font:16px/1.55 Arimo,Arial,sans-serif}
body :focus-visible{outline:3px solid #ff9a8c;outline-offset:4px}
h1,h2,h3,p,figure{margin:0}
a{color:inherit;text-decoration:none}
.wrap{width:min(100% - 80px,1280px);margin-inline:auto}
.skip{position:absolute;left:1rem;top:-10rem;padding:.75rem;background:var(--text);color:var(--ink);z-index:3}
.skip:focus{top:1rem}
.site-header{border-bottom:1px solid #ffffff20}
.header-row{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:25px;font-weight:700;letter-spacing:-.8px;white-space:nowrap}
.brand img{display:block;flex:none}
nav,.actions{display:flex;align-items:center;gap:22px}
nav a:not(.button):hover{text-decoration:underline;text-underline-offset:4px}
.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:44px;padding:11px 20px;border:1px solid transparent;border-radius:7px;font-size:15px;font-weight:700;line-height:1.3;white-space:nowrap}
.primary{background:var(--lime);color:var(--ink)}
.primary:hover{background:#f1ffda}
.secondary{border-color:#91a99b;color:var(--text)}
.secondary:hover{background:#ffffff16}
.hero{background:radial-gradient(ellipse at 76% 46%,#274b3b 0%,var(--background) 62%)}
.hero-grid{display:grid;grid-template-columns:minmax(330px,.85fr) minmax(0,1.3fr);align-items:center;gap:clamp(30px,5vw,78px);padding-block:clamp(58px,8vw,116px)}
.eyebrow{color:var(--lime);font-size:12px;font-weight:700;letter-spacing:.13em}
h1,h2{font-family:Tinos,Georgia,serif;font-weight:400;line-height:1.02;letter-spacing:-.025em}
h1{font-size:clamp(55px,6.6vw,94px);margin-block:13px 20px;text-wrap:balance}
.hero-copy>p:not(.eyebrow){max-width:480px;font-size:clamp(17px,1.55vw,20px);color:var(--muted)}
.actions{margin-top:29px;gap:12px;flex-wrap:wrap}
.demo{min-width:0;scroll-margin-top:20px}
.video-shell{position:relative;background:var(--deep);border:1px solid #719180;border-radius:14px;padding:7px;box-shadow:0 26px 60px #07160c70}
video{display:block;aspect-ratio:16 / 9;width:100%;height:auto;border-radius:8px;background:#0d201b}
.play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:64px;height:64px;border:0;border-radius:50%;color:var(--ink);background:var(--lime);box-shadow:0 6px 24px #0009;cursor:pointer}
.play-button[hidden]{display:none}
.play-button:hover{background:#f1ffda}
.play-button span{width:0;height:0;margin-left:4px;border-block:10px solid transparent;border-left:16px solid currentColor}
figcaption{display:flex;justify-content:space-between;gap:12px;margin-top:12px;padding-inline:4px;color:var(--muted);font-size:14px}
figcaption strong{color:var(--text);font-weight:700}
.features{background:#f4f2e9;color:var(--ink);color-scheme:light;padding-block:clamp(50px,7vw,88px)}
h2{font-size:clamp(34px,4.2vw,56px)}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}
.feature-grid article{border-top:2px solid #96b099;padding:20px 14px 0 0}
h3{font-size:21px;line-height:1.2;margin-bottom:9px}
.feature-grid p,.next-step p{color:#47594e;max-width:365px}
.live-feeds,.businesses,.holiday-samples{padding-block:clamp(50px,7vw,88px)}
.live-feeds{background:var(--deep)}
.holiday-samples{background:#1b382c}
.businesses{background:#f4f2e9;color:var(--ink);color-scheme:light}
.section-intro{margin-top:13px;max-width:640px;font-size:17px}
.live-feeds .section-intro,.live-feeds .example-grid p{color:var(--muted)}
.businesses .section-intro,.businesses .example-grid p{color:#47594e}
.example-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:30px}
.example-grid img{display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;border-radius:9px;margin-bottom:16px;background:#183027}
.feed-grid img{border:1px solid var(--line)}
.example-grid h3{margin-bottom:6px}
.business-grid{row-gap:34px}
.holiday-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.holiday-samples .section-intro{color:var(--muted)}
.display-stage{aspect-ratio:4 / 3;display:grid;place-items:center;background:#1b3027;border-radius:10px;margin-bottom:15px;overflow:hidden}
.display-stage img{aspect-ratio:auto;object-fit:contain;margin:0;box-shadow:0 0 0 4px #0d1713;border-radius:3px}
.display-stage.wide img{width:72%;height:auto}
.display-stage.tall img{width:auto;height:96%}
.next-step{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:56px;padding:28px;background:#e3ebdd;border-radius:11px}
.next-step h2{font-size:clamp(30px,3.4vw,44px);margin-bottom:7px}
.next-step .primary{background:#214637;color:#fff}
.next-step .primary:hover{background:#32604d}
.site-footer{display:flex;justify-content:space-between;gap:18px;padding-block:25px;color:var(--muted);font-size:14px}
@media(max-width:850px){.wrap{width:min(100% - 44px,1280px)}.hero-grid{grid-template-columns:1fr;gap:38px}.hero-copy>p:not(.eyebrow){max-width:610px}h1{max-width:680px}.demo{max-width:720px;width:100%}.feature-grid{gap:17px}}
@media(max-width:525px){.wrap{width:calc(100% - 32px)}.header-row{min-height:64px;gap:9px}.brand{font-size:21px;gap:6px}.brand img{width:23px;height:23px}.header-row nav{gap:11px;font-size:14px}.header-row .button{padding-inline:11px;font-size:13px}.hero-grid{padding-block:39px 48px;gap:28px}h1{font-size:clamp(45px,12vw,60px);margin-bottom:14px}.actions{margin-top:20px}.actions .button{padding-inline:12px;font-size:14px}.video-shell{padding:4px}.play-button{width:50px;height:50px}.feature-grid{grid-template-columns:1fr;margin-top:22px}.feature-grid article{padding-top:15px}.next-step{flex-direction:column;align-items:flex-start;margin-top:33px;padding:20px}.site-footer{flex-direction:column;gap:8px}}
@media(max-width:800px){.business-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}
@media(max-width:610px){.feed-grid{grid-template-columns:1fr}.example-grid{gap:24px}}
@media(max-width:610px){.holiday-grid{grid-template-columns:1fr}}
@media(max-width:445px){.business-grid{grid-template-columns:1fr}}
