/* WALRUS public site — Phoenix Strategies Hi-Vis identity */
:root { --cream:#e6e3dc; --ink:#131313; --yellow:#f5d400; --border:#b9b5aa; --secondary:#4a4a45; --white:#fff; --wide:1120px; --reading:760px; }
* { box-sizing:border-box; } html { -webkit-text-size-adjust:100%; max-width:100%; overflow-x:hidden; scroll-behavior:smooth; } body { margin:0; max-width:100%; overflow-x:hidden; background:var(--cream); color:var(--ink); font:17px/1.55 Archivo,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; } a { color:var(--ink); text-decoration-thickness:2px; text-underline-offset:3px; } a:hover { color:var(--secondary); } a:focus-visible { outline:3px solid var(--ink); outline-offset:4px; } .skip-link { background:var(--yellow); color:var(--ink); font-weight:800; left:12px; padding:9px 12px; position:absolute; top:-60px; z-index:3; } .skip-link:focus { top:12px; }
.site-header { align-items:center; border-bottom:3px solid var(--ink); display:flex; flex-wrap:wrap; gap:18px; justify-content:space-between; padding:20px 24px; }.wordmark { align-items:center; color:var(--ink); display:flex; font-size:22px; font-weight:900; gap:10px; letter-spacing:-.02em; text-decoration:none; text-transform:uppercase; }.badge { background:var(--ink); border-radius:8px; color:var(--yellow); font:800 12px "JetBrains Mono",monospace; letter-spacing:.06em; padding:4px 8px; }.site-nav { display:flex; flex-wrap:wrap; font:700 13px "JetBrains Mono",monospace; gap:18px; letter-spacing:.04em; text-transform:uppercase; }.site-nav a { border-bottom:2px solid transparent; text-decoration:none; }.site-nav a:hover,.site-nav a[aria-current="page"] { border-bottom-color:var(--yellow); }
.wrap,.wrap-wide { margin:0 auto; min-width:0; padding-left:24px; padding-right:24px; width:100%; }.wrap { max-width:var(--reading); padding-bottom:96px; padding-top:48px; }.wrap-wide { max-width:var(--wide); }.eyebrow,.scope-line,.last-updated { color:var(--secondary); font:700 12px "JetBrains Mono",monospace; letter-spacing:.15em; margin:0 0 12px; text-transform:uppercase; }.last-updated { letter-spacing:0; text-transform:none; }.hero { padding-bottom:88px; padding-top:84px; }.hero h1 { font-size:clamp(45px,7vw,88px); letter-spacing:-.055em; line-height:.93; margin:0; text-transform:uppercase; }.hero mark { background:var(--yellow); color:var(--ink); padding:0 .08em; }.hero-copy { font-size:clamp(19px,2.2vw,25px); font-weight:600; margin:32px 0; max-width:720px; }.hero-actions { align-items:center; display:flex; flex-wrap:wrap; gap:24px; }.btn { background:var(--ink); border-radius:10px; color:var(--yellow); display:inline-block; font-size:13px; font-weight:800; letter-spacing:.04em; padding:13px 19px; text-decoration:none; text-transform:uppercase; }.btn:hover { color:var(--white); }.text-link { font-weight:800; }.scope-line { border-top:2px solid var(--border); margin-top:52px; padding-top:15px; }
.feature-grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); padding-bottom:96px; }.feature-card { background:var(--white); border:3px solid var(--ink); border-radius:16px; min-height:260px; padding:24px; }.feature-num,.num { background:var(--yellow); border-radius:6px; display:inline-flex; font:800 13px "JetBrains Mono",monospace; padding:3px 7px; }.feature-card h2 { font-size:25px; letter-spacing:-.025em; line-height:1; margin:36px 0 12px; text-transform:uppercase; }.feature-card p,.statement p,.workflow p { color:var(--secondary); }.statement { background:var(--ink); color:var(--white); max-width:none; padding-bottom:88px; padding-top:88px; }.statement>* { margin-left:auto; margin-right:auto; max-width:var(--wide); }.statement .eyebrow { color:var(--yellow); }.statement h2 { font-size:clamp(31px,4vw,54px); letter-spacing:-.045em; line-height:1; margin-bottom:24px; max-width:900px; text-transform:uppercase; }.statement p { color:var(--cream); font-size:19px; max-width:780px; }.statement .text-link { color:var(--yellow); display:block; margin-top:28px; }.workflow { align-items:start; display:grid; gap:56px; grid-template-columns:1fr 1fr; padding-bottom:88px; padding-top:88px; }.workflow h2,.contact-band h2 { font-size:clamp(29px,3.5vw,46px); letter-spacing:-.04em; line-height:1; margin:0; text-transform:uppercase; }.checklist { list-style:none; margin:0; padding:0; }.checklist li { border-top:2px solid var(--ink); padding:18px 0; }.checklist li:last-child { border-bottom:2px solid var(--ink); }.contact-band { align-items:center; background:var(--yellow); display:grid; gap:48px; grid-template-columns:1.2fr .8fr; max-width:none; padding-bottom:72px; padding-top:72px; }.contact-band>div { max-width:var(--wide); }.link-stack { display:grid; gap:13px; }.link-stack a { font-size:19px; font-weight:800; }
.product-preview { background:var(--yellow); border-top:3px solid var(--ink); padding:88px 0 74px; scroll-margin-top:24px; }.preview-lead { align-items:center; display:grid; gap:72px; grid-template-columns:minmax(0,1fr) minmax(320px,.8fr); }.preview-copy h2 { font-size:clamp(38px,5vw,66px); letter-spacing:-.05em; line-height:.95; margin:0 0 28px; max-width:720px; text-transform:uppercase; }.preview-copy>p:not(.eyebrow):not(.preview-note) { font-size:clamp(19px,2vw,23px); font-weight:600; max-width:620px; }.preview-note { border-top:2px solid var(--ink); font:700 12px/1.5 "JetBrains Mono",monospace; letter-spacing:.06em; margin-top:34px; max-width:620px; padding-top:14px; text-transform:uppercase; }.preview-player-shell { background:var(--ink); border:3px solid var(--ink); border-radius:30px; box-shadow:12px 12px 0 rgba(19,19,19,.18); display:flex; justify-content:center; justify-self:center; padding:18px; width:min(100%,390px); }.preview-video { aspect-ratio:886/1920; background:#000; border:2px solid var(--cream); border-radius:22px; display:block; max-height:660px; object-fit:contain; width:100%; }.screenshot-gallery { margin-top:78px; }.gallery-heading { align-items:end; border-bottom:3px solid var(--ink); display:flex; flex-wrap:wrap; gap:12px 32px; justify-content:space-between; margin-bottom:24px; padding-bottom:12px; }.gallery-heading h3 { font-size:clamp(26px,3vw,38px); letter-spacing:-.035em; line-height:1; margin:0; text-transform:uppercase; }.gallery-heading p { font:700 12px "JetBrains Mono",monospace; letter-spacing:.08em; margin:0; text-transform:uppercase; }.screenshot-strip { display:grid; gap:22px; grid-auto-columns:minmax(230px,27%); grid-auto-flow:column; list-style:none; margin:0; overflow-x:auto; overscroll-behavior-inline:contain; padding:0 10px 24px 0; scroll-snap-type:x mandatory; scrollbar-color:var(--ink) rgba(19,19,19,.18); scrollbar-width:thin; }.screenshot-strip li { min-width:0; scroll-snap-align:start; }.screenshot-strip figure { margin:0; }.screenshot-strip img { background:var(--cream); border:3px solid var(--ink); border-radius:26px; box-shadow:8px 8px 0 rgba(19,19,19,.18); display:block; height:auto; width:100%; }.screenshot-strip figcaption { font:800 12px "JetBrains Mono",monospace; letter-spacing:.08em; padding:18px 2px 0; text-transform:uppercase; }
h1 { font-size:clamp(32px,6vw,44px); font-weight:900; letter-spacing:-.03em; line-height:1.05; margin:0 0 8px; text-transform:uppercase; } h2 { font-size:22px; font-weight:900; letter-spacing:-.01em; margin:48px 0 16px; text-transform:uppercase; } h2 .num { margin-right:10px; } p { margin:0 0 16px; }.subtitle { color:var(--secondary); font-size:17px; font-weight:500; margin-bottom:32px; max-width:56ch; }.panel { background:var(--white); border:3px solid var(--ink); border-radius:16px; margin-bottom:20px; padding:20px 22px; }.panel.callout { background:var(--yellow); }.panel.callout p { font-weight:600; margin:0; }.callout-label { display:block; font:800 12px "JetBrains Mono",monospace; letter-spacing:.14em; margin-bottom:8px; text-transform:uppercase; }.faq-item { background:var(--white); border:3px solid var(--border); border-radius:14px; margin-bottom:16px; padding:18px 20px; }.faq-q { font-size:16px; font-weight:800; margin:0 0 8px; }.faq-a { color:var(--secondary); margin:0; }.contact-block { align-items:center; border:3px solid var(--ink); border-radius:16px; display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; margin-top:48px; padding:24px; }.legal-note { border-left:4px solid var(--yellow); color:var(--secondary); font-size:14px; padding-left:14px; }.site-footer { border-top:3px solid var(--ink); color:var(--secondary); display:flex; flex-wrap:wrap; font:12px "JetBrains Mono",monospace; gap:8px 20px; justify-content:space-between; margin-top:64px; padding:24px; }.site-footer a { color:var(--secondary); }
@media (max-width:720px) { .hero { padding-bottom:64px; padding-top:56px; }.feature-grid,.workflow,.contact-band,.preview-lead { grid-template-columns:1fr; }.feature-grid { padding-bottom:64px; }.product-preview { padding-bottom:58px; padding-top:64px; }.preview-lead { gap:48px; }.preview-player-shell { width:min(100%,340px); }.screenshot-gallery { margin-top:62px; }.screenshot-strip { grid-auto-columns:minmax(225px,72%); }.statement,.workflow { padding-bottom:64px; padding-top:64px; }.contact-band { padding-bottom:56px; padding-top:56px; } }
@media (max-width:520px) { .wrap,.wrap-wide { padding-left:16px; padding-right:16px; }.wrap { padding-bottom:72px; padding-top:32px; }.site-header { align-items:flex-start; flex-direction:column; min-width:0; padding:16px; width:100%; }.site-nav { font-size:11px; gap:10px; justify-content:space-between; min-width:0; width:100%; }.hero h1 { font-size:36px; overflow-wrap:anywhere; word-break:break-word; }.hero mark { -webkit-box-decoration-break:clone; box-decoration-break:clone; overflow-wrap:anywhere; }.hero-actions { align-items:flex-start; flex-direction:column; }.feature-card { min-width:0; }.preview-copy h2 { font-size:38px; overflow-wrap:anywhere; }.preview-note { font-size:10px; }.preview-player-shell { border-radius:24px; padding:12px; width:min(100%,300px); }.preview-video { border-radius:17px; }.screenshot-strip { grid-auto-columns:82%; }.contact-block { align-items:flex-start; flex-direction:column; } }