/* Approved Soft Portal type, self-hosted from the brand kit. */
@font-face {
  font-family:'Geist';
  src:url('/assets/fonts/Geist-Regular.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:'Geist';
  src:url('/assets/fonts/Geist-Medium.ttf') format('truetype');
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
/* stay_human labels use its separate, approved Geist Mono kit. */
@font-face {
  font-family:'Geist Mono';
  src:url('/assets/fonts/GeistMono-Regular.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:'Geist Mono';
  src:url('/assets/fonts/GeistMono-Medium.ttf') format('truetype');
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
:root {
  --ink:#17140F;
  --marble:#F4F0E7;
  --terra:#B4492B;
  --stone:#5E574C;
  --line:#D7D0C4;
  --sans:'Geist',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'Geist Mono',ui-monospace,monospace;
  --gutter:clamp(22px,5vw,80px);
  --section:clamp(80px,9vw,140px)
}
*,*::before,*::after {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:92px;
  -webkit-text-size-adjust:100%
}
body {
  margin:0;
  background:var(--marble);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased
}
a {
  color:inherit
}
img {
  display:block;
  max-width:100%;
  height:auto
}
button {
  font:inherit
}
h1,h2,h3,p,figure {
  margin:0
}
h1,h2,h3 {
  font-weight:500
}
.heading-accent {
  font-family:inherit;
  font-style:normal;
  font-weight:500
}
h2 {
  font-size:clamp(48px,5.5vw,82px);
  line-height:1.04;
  letter-spacing:-.04em
}
h2 .heading-accent {
  letter-spacing:inherit;
  font-size:1em
}
a,button,summary {
  -webkit-tap-highlight-color:transparent
}
:focus-visible {
  outline:3px solid #DFAD87;
  outline-offset:6px
}
.wrap {
  max-width:1600px;
  margin:0 auto;
  padding:0 var(--gutter)
}
.section {
  padding:var(--section) 0
}
.eyebrow {
  font:500 11px/1.5 var(--sans);
  letter-spacing:.11em;
  text-transform:uppercase
}
.body-copy {
  color:var(--stone);
  max-width:37ch;
  font-size:17px;
  line-height:1.75
}
.text-link {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:25px;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  padding:8px 0;
  border-bottom:1px solid currentColor
}
.text-link span {
  transition:transform .2s
}
.text-link:hover span {
  transform:translate(3px,-3px)
}
.skip {
  position:fixed;
  top:-100px;
  left:20px;
  background:var(--marble);
  color:var(--ink);
  z-index:100;
  padding:12px 20px
}
.skip:focus {
  top:12px
}
/* Product-first opening: immediate, readable, with no media download. */
.nav { position:sticky; top:0; z-index:20; color:var(--ink); background:var(--marble); border-bottom:1px solid var(--line); transition:box-shadow .25s; }
.nav.is-scrolled { box-shadow:0 3px 18px #17140f0a; }
.nav__inner { display:flex; min-height:90px; align-items:center; gap:44px; }
.nav__logo { flex-shrink:0; }
.nav__logo img { width:200px; }
.nav nav { display:flex; gap:35px; margin-left:auto; }
.nav a { text-decoration:none; font-size:13px; }
.nav nav a[href="/stay-human/"] { font-family:var(--mono); font-weight:500; }
.nav nav a { min-height:44px; display:flex; align-items:center; }
.nav__contact { min-height:44px; display:flex; align-items:center; gap:22px; border-bottom:1px solid var(--stone); }
.hero { background:var(--marble); }
.hero__inner { padding-top:clamp(38px,5vw,70px); padding-bottom:0; }
.hero__intro { display:grid; grid-template-columns:1.7fr 1fr; align-items:end; gap:60px; margin-bottom:42px; }
.hero__eyebrow { margin-bottom:24px; }
h1 { font-size:clamp(48px,5.6vw,86px); line-height:1.04; letter-spacing:-.055em; }
.hero__description { font-size:17px; line-height:1.65; max-width:32ch; padding-bottom:5px; }
.product-cards { display:grid; grid-template-columns:1fr 1fr; gap:26px; scroll-margin-top:115px; }
.product-card { display:flex; flex-direction:column; min-height:340px; padding:clamp(26px,3vw,44px); border-radius:5px; }
.product-card--stratumus { background:var(--ink); color:var(--marble); }
.product-card--feeharbor { background:#E4DED2; color:var(--ink); }
.product-card>.eyebrow { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.product-card__accent { width:8px; height:8px; border-radius:50%; background:var(--terra); }
.product-card h2 { font-size:clamp(30px,3vw,44px); letter-spacing:-.04em; line-height:1.2; margin-top:34px; margin-bottom:16px; }
.tm { font-size:12px; vertical-align:super; letter-spacing:0; margin-left:3px; }
.product-card__description { font-size:17px; line-height:1.6; max-width:35ch; }
.product-card__status { font-size:12px; margin-top:14px; color:var(--stone); }
.product-card__link { display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:52px; text-decoration:none; font-size:14px; font-weight:500; border-top:1px solid #f4f0e736; padding-top:19px; margin-top:auto; }
.product-card--feeharbor .product-card__link { border-color:#5e574c40; }
.product-card__link span { transition:transform .2s; }
.product-card__link:hover span { transform:translate(3px,-3px); }
.product-card__description:last-of-type { margin-bottom:26px; }
.product-card__status { margin-bottom:26px; }
.hero__bottom { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:34px; padding:26px 0; border-bottom:1px solid var(--line); }
.hero__bottom a { display:inline-flex; align-items:center; gap:15px; min-height:44px; font-size:12px; text-decoration:none; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:40px; min-height:50px; padding:12px 22px; font-size:13px; text-decoration:none; border-radius:2px; transition:background .2s; }
.button--light { background:var(--marble); color:var(--ink); }
.button--light:hover { background:#fff; }
/* Warm editorial story, with room for everyday life. */
.about__grid {
  display:grid;
  grid-template-columns:1fr 1.12fr;
  gap:8vw;
  align-items:center
}
.about__copy>.eyebrow {
  color:var(--terra);
  margin-bottom:30px
}
.about__copy h2 {
  margin-bottom:32px
}
.about__copy .body-copy+.body-copy {
  margin-top:18px
}
.about__copy .text-link {
  margin-top:26px
}
.about__photo {
  position:relative;
  padding-bottom:68px
}
.about__photo>img {
  width:100%;
  height:570px;
  object-fit:cover;
  object-position:52% 50%
}
.about__photo figcaption {
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding-top:15px;
  color:var(--stone);
  font-size:10px
}
.photo-credit {
  font-size:9px
}
.photo-note {
  position:absolute;
  bottom:95px;
  left:-40px;
  padding:25px 36px;
  background:var(--terra);
  color:var(--marble);
  font-size:28px;
  line-height:1.1;
  letter-spacing:-.025em;
  box-shadow:0 10px 30px #17140f12
}
.photo-note .heading-accent {
  font-size:28px;
  font-weight:500
}
/* Readable principles, with concrete product examples. Native details work without JS. */
.ethos {
  background:var(--ink);
  color:var(--marble)
}
.ethos__grid {
  display:grid;
  grid-template-columns:1fr 1.12fr;
  gap:8vw
}
.ethos .eyebrow {
  color:#C9B6A2
}
.ethos__intro h2 {
  font-size:clamp(46px,4.8vw,70px);
  margin:28px 0
}
.ethos .body-copy {
  color:#C5BFB3;
  font-size:15px;
  max-width:35ch
}
.ethos__mark {
  width:70px;
  height:auto;
  margin-top:38px;
  opacity:.8
}
.principles {
  padding-top:8px
}
.principle {
  border-top:1px solid #50493F
}
.principle:last-child {
  border-bottom:1px solid #50493F
}
.principle summary {
  list-style:none;
  display:flex;
  gap:24px;
  align-items:center;
  cursor:pointer;
  min-height:98px
}
.principle summary::-webkit-details-marker {
  display:none
}
.principle__number {
  font:11px var(--sans);
  color:#BDA893
}
.principle h3 {
  font-size:22px;
  letter-spacing:-.025em
}
.principle__toggle {
  position:relative;
  margin-left:auto;
  width:20px;
  height:20px;
  flex-shrink:0
}
.principle__toggle:before,.principle__toggle:after {
  content:'';
  position:absolute;
  top:9px;
  left:3px;
  width:14px;
  height:1px;
  background:var(--marble)
}
.principle__toggle:after {
  transform:rotate(90deg)
}
.principle[open] .principle__toggle:after {
  transform:rotate(0)
}
.principle__body {
  padding:0 30px 30px 42px;
  color:#C5BFB3;
  font-size:15px;
  max-width:52ch
}
.principle__proof {
  border-left:2px solid #D27D60;
  padding-left:15px;
  margin-top:22px;
  font-size:12px;
  line-height:1.7;
  color:#D9C6B8
}
.principle__proof span {
  margin:0 7px;
  color:#E49D7F
}
/* A confident, direct invitation. */
.contact {
  background:var(--terra);
  color:var(--marble)
}
.contact__grid {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  align-items:center;
  gap:8vw
}
.contact h2 {
  margin-top:25px;
  font-size:clamp(55px,6vw,90px)
}
.contact__copy>p:first-child {
  font-size:18px;
  line-height:1.6
}
.contact__email {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  font-size:clamp(19px,2vw,28px);
  text-decoration:none;
  padding:25px 0 16px;
  border-bottom:1px solid #f4f0e780;
  margin-bottom:18px
}
.contact .text-link {
  font-size:12px;
  border:0
}
.contact__location {
  margin-top:40px;
  font-size:10px
}
.footer {
  padding:40px 0 26px
}
.footer__top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding-bottom:34px
}
.footer__top img {
  width:200px
}
.footer__links {
  display:flex;
  align-items:center;
  gap:32px;
  margin-left:auto
}
.footer__merch {
  font:500 11px/1.5 var(--mono);
  color:var(--stone);
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  min-height:44px
}
.footer__merch:hover {
  color:var(--ink);
  text-decoration:underline;
  text-underline-offset:4px
}
.back-top {
  min-height:44px;
  font-size:11px;
  text-decoration:none;
  display:flex;
  gap:20px;
  align-items:center
}
.back-top span {
  font-size:20px
}
.footer__bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  padding-top:20px;
  font-size:11px;
  color:var(--stone)
}
/* Content stays visible when scripts or animation are unavailable. */
.motion-ready [data-reveal] {
  opacity:0;
  transform:translateY(16px);
  transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1);
  transition-delay:var(--reveal-delay,0ms)
}
.motion-ready [data-reveal].is-visible {
  opacity:1;
  transform:none
}
.error-page {
  min-height:100svh;
  display:grid;
  align-content:center;
  background:var(--ink);
  color:var(--marble)
}
.error-page img {
  width:70px;
  margin-bottom:30px
}
.error-page h1 {
  font-size:clamp(50px,7vw,90px);
  margin:22px 0
}
.error-page p {
  margin-bottom:28px;
  color:#C5BFB3
}
@media(max-width:1050px) {
  .nav__inner { gap:24px; }
  .nav nav { gap:24px; }
  .hero__intro { gap:35px; grid-template-columns:1.7fr 1fr; }
  .hero__description { font-size:15px; }
  .about__grid,.ethos__grid,.contact__grid { gap:6vw; }
  .about__photo>img { height:510px; }
  .photo-note { left:-20px; }
  .principle h3 { font-size:20px; }
  .principle summary { gap:18px; }
}
@media(max-width:900px) {
  .hero__intro { grid-template-columns:1fr; gap:24px; }
  .hero__description { max-width:48ch; }
  .about__grid,.ethos__grid,.contact__grid { grid-template-columns:1fr; gap:48px; }
  .about__copy .body-copy { max-width:48ch; }
  .about__photo { max-width:700px; }
  .about__photo>img { height:520px; }
  .ethos__mark { display:none; }
  .ethos .body-copy { max-width:48ch; }
  .contact__copy { max-width:600px; }
}
@media(max-width:700px) {
  html { scroll-padding-top:130px; }
  .nav__inner { min-height:112px; flex-wrap:wrap; gap:0 14px; align-content:center; }
  .nav nav { flex-basis:100%; order:3; gap:24px; margin-left:0; }
  .nav nav a { min-height:36px; }
  .nav a { font-size:11px; }
  .nav__contact { margin-left:auto; gap:8px; }
  .hero__intro { margin-bottom:30px; }
  h1 { font-size:clamp(40px,7.5vw,58px); }
  .hero__eyebrow { margin-bottom:20px; }
  .product-cards { grid-template-columns:1fr; gap:20px; scroll-margin-top:130px; }
  .product-card { min-height:310px; padding:28px; }
  .product-card h2 { margin-top:24px; font-size:34px; }
  .product-card__description { font-size:16px; }
  .hero__bottom { align-items:flex-start; flex-direction:column; gap:8px; margin-top:22px; padding:24px 0; }
  .hero__bottom .eyebrow { font-size:10px; }
  .about__copy h2 br:nth-of-type(2) { display:none; }
  .about__copy .body-copy { max-width:45ch; }
  .about__photo { padding-bottom:0; margin-top:10px; }
  .about__photo>img { height:430px; }
  .photo-note { left:14px; bottom:52px; padding:22px 28px; font-size:24px; }
  .photo-note .heading-accent { font-size:31px; }
  .ethos__intro h2 { font-size:52px; }
  .ethos .body-copy { max-width:43ch; }
  .principle summary { min-height:90px; }
  .principle h3 { font-size:21px; }
  .principle__body { padding-left:35px; }
  .contact__grid { gap:40px; }
  .contact__copy>p:first-child { font-size:16px; }
  .contact__email { font-size:24px; }
  .footer__top { gap:20px; flex-wrap:wrap; }
  .footer__links { width:100%; justify-content:space-between; margin-left:0; gap:16px; }
  .back-top { margin-left:auto; }
  .footer__bottom { flex-direction:column; gap:8px; }
}
@media(max-width:370px) {
  .nav__inner { gap:0 10px; }
  .nav nav { gap:18px; }
  .nav a { font-size:10px; }
  .nav__contact span { display:none; }
  .product-card { padding:24px; }
  .principle h3 { font-size:18px; }
  .contact__email { font-size:21px; }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .motion-ready [data-reveal] {
    opacity:1;
    transform:none
  }

}

/* Homepage intro: the view pulls back out of the Soft Portal doorway, the logo takes its
   place in the header, and the opening text blurs in. Gated by the inline script in <head>. */
.intro { display:none; }
.intro-pending { overflow:hidden; }
.intro-pending .intro { display:block; position:fixed; inset:0; z-index:50; overflow:hidden; background:var(--marble); transition:background-color .45s ease; }
.intro__logo { position:absolute; left:0; top:0; width:0; height:auto; overflow:visible; fill:var(--ink); }
.intro-pending .nav__logo img { opacity:0; }
.intro-pending [data-enter] { opacity:0; filter:blur(14px); transform:translateY(10px); }
.intro-entering .intro { background-color:transparent; }
.intro-entering [data-enter] { opacity:1; filter:none; transform:none; transition:opacity .9s cubic-bezier(.2,0,0,1),filter .9s cubic-bezier(.2,0,0,1),transform .9s cubic-bezier(.2,0,0,1); transition-delay:calc(var(--enter,0) * 70ms); }

/* A static explanation: read at your own pace, with no opening interstitial. */
.name-story { margin-bottom:90px; }
.name-story__heading h2 { font-size:clamp(43px,4.5vw,65px); margin-top:20px; }
.name-story__entries { display:grid; grid-template-columns:1fr 1fr 1.3fr; gap:40px; margin-top:50px; }
.name-entry { border-top:1px solid #50493F; padding-top:25px; }
.name-entry__wordline { display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; margin-bottom:20px; }
.name-entry h3 { font:500 36px/1.15 var(--sans); letter-spacing:-.02em; }
.name-entry__pronunciation { font:400 10px/1.5 var(--sans); letter-spacing:.025em; color:#D8B598; }
.name-entry__pronunciation::before { content:'/ '; }
.name-entry__pronunciation::after { content:' /'; }
.name-entry__definition { font:400 24px/1.45 var(--sans); max-width:32ch; text-wrap:pretty; }
.name-entry__meaning { color:#C5BFB3; font-size:13px; max-width:34ch; margin-top:20px; }
/* Quiet interaction details: small distances, soft light, no pointer tracking. */
.nav nav a { position:relative; }
.nav nav a::after {
  content:''; position:absolute; left:0; right:0; bottom:5px; height:1px;
  background:var(--terra); transform:scaleX(0); transform-origin:left;
  transition:transform .35s cubic-bezier(.22,1,.36,1);
}
.nav nav a[aria-current]::after,.nav nav a:focus-visible::after { transform:scaleX(1); }
.product-card { transition:box-shadow .45s ease; }
.product-card--stratumus { background-image:radial-gradient(ellipse at 100% 0%,#f4f0e709,transparent 65%); }
.product-card--feeharbor { background-image:radial-gradient(ellipse at 100% 0%,#f4f0e74d,transparent 65%); }
.product-card__accent { position:relative; flex-shrink:0; }
.product-card__accent::after {
  content:''; position:absolute; inset:-4px; border:1px solid var(--terra);
  border-radius:50%; opacity:0;
}
.product-card__accent.is-breathing { animation:accent-breathe 4.8s ease-in-out infinite; }
.product-card__accent.is-breathing::after { animation:accent-halo 4.8s ease-in-out infinite; }
@keyframes accent-breathe { 0%,100% { opacity:.65; } 50% { opacity:1; } }
@keyframes accent-halo { 0%,100% { opacity:0; transform:scale(.7); } 50% { opacity:.3; transform:scale(1.15); } }
.text-link span,.product-card__link span,.nav__contact span,.contact__email span,.hero__bottom a span,.back-top span {
  display:inline-block; transition:transform .35s cubic-bezier(.22,1,.36,1);
}
:is(.text-link,.product-card__link,.nav__contact,.contact__email):focus-visible span { transform:translate(3px,-3px); }
.hero__bottom a:focus-visible span { transform:translateY(3px); }
.back-top:focus-visible span { transform:translateY(-3px); }
.product-card:focus-within { box-shadow:0 12px 32px #17140f12,inset 0 0 0 1px #b4492b40; }
.principle summary { transition:background-color .3s ease; }
.principle__toggle:after { transition:transform .35s cubic-bezier(.22,1,.36,1); }
.principle[open] .principle__body { animation:principle-enter .35s cubic-bezier(.22,1,.36,1); }
@keyframes principle-enter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:none; } }
.motion-toggle {
  display:inline-flex; align-items:center; min-height:44px; padding:0;
  border:0; background:none; color:var(--stone); font:400 11px/1.5 var(--sans); cursor:pointer;
}
.motion-toggle[hidden] { display:none; }
.motion-toggle:disabled { cursor:default; }
@media(hover:hover) and (pointer:fine) {
  .nav nav a:hover::after { transform:scaleX(1); }
  .product-card:hover { box-shadow:0 12px 32px #17140f12,inset 0 0 0 1px #b4492b40; }
  .nav__contact:hover span,.contact__email:hover span { transform:translate(3px,-3px); }
  .hero__bottom a:hover span { transform:translateY(3px); }
  .back-top:hover span { transform:translateY(-3px); }
  .principle summary:hover { background-color:#f4f0e705; }
  .motion-toggle:hover { color:var(--ink); }
}
/* The explicit preference also applies to the existing intro and collection effects. */
.motion-off { scroll-behavior:auto; }
.motion-off *,.motion-off *::before,.motion-off *::after { animation:none!important; transition:none!important; }
.motion-off [data-reveal] { opacity:1; transform:none; }
.motion-off .product-card__accent::after { opacity:0; }
@media(max-width:900px) {
  .name-story__entries { grid-template-columns:1fr; gap:35px; }
  .name-entry__definition { max-width:45ch; }
  .name-entry__meaning { max-width:50ch; }
}
@media(max-width:700px) {
  .name-story { margin-bottom:65px; }
  .name-entry__definition { font-size:23px; }
}