/* Origin section rebuilt from the client mockup "first section.png".
   Tokens, pills, header and 22px frames come from site.css. */

@font-face{font-family:"Newsreader Italic";src:url("../assets/fonts/newsreader-400italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}

.fs-page{background:var(--paper);color:var(--slate)}
.fs-page .site-header{color:var(--pine)}
.fs-page .site-header__logo{filter:drop-shadow(0 4px 14px rgba(29,57,47,.14))}
.fs-page .menu-button{color:var(--pine);background:rgba(255,253,248,.55);box-shadow:inset 0 0 0 1px rgba(29,57,47,.3)}
.fs-page .menu-button:hover{background:rgba(255,253,248,.95)}

.fs-note{position:relative;z-index:4;padding:148px 0 0;text-align:center}
.fs-note p{display:inline-block;margin:0;padding:8px 16px;border-radius:999px;background:rgba(255,253,248,.7);box-shadow:inset 0 0 0 1px rgba(29,57,47,.14);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ochre-deep)}

.fs{position:relative;overflow:clip;isolation:isolate;padding:clamp(36px,4vw,56px) 0 clamp(72px,8vw,110px);background:var(--paper)}
.fs__wash{position:absolute;z-index:0;inset:0 0 0 28%;pointer-events:none;
  background:url("art/ridge-wash.webp") 62% 38%/cover no-repeat;
  opacity:.58;filter:saturate(.4) contrast(.92) brightness(1.1)}
.fs__pines{position:absolute;z-index:0;right:-6%;top:0;bottom:0;width:52%;pointer-events:none;
  background:url("../about-us-concepts/round-three/pine-engraving.webp") right 58%/contain no-repeat;
  opacity:.16;mix-blend-mode:multiply;filter:saturate(.3)}
.fs__veil{position:absolute;z-index:1;inset:0;pointer-events:none;background:
  linear-gradient(90deg,rgba(247,245,239,1) 0%,rgba(247,245,239,.96) 28%,rgba(247,245,239,.55) 48%,rgba(247,245,239,.22) 68%,rgba(247,245,239,.38) 100%),
  linear-gradient(180deg,rgba(247,245,239,.55) 0%,rgba(247,245,239,0) 18%,rgba(247,245,239,0) 78%,rgba(247,245,239,.7) 100%)}
.fs__topo{position:absolute;z-index:1;left:-2%;bottom:-8%;width:min(520px,46vw);height:42%;pointer-events:none;opacity:.55}
.fs__grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1.08fr);gap:clamp(28px,4vw,56px);align-items:center}

.fs__kicker{display:flex;align-items:center;gap:14px;margin:0 0 22px;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ochre)}
.fs__kicker::before{content:"";width:42px;height:1px;background:var(--ochre)}
.fs h2{margin:0 0 28px;font-size:clamp(2.15rem,3.55vw,3.45rem);line-height:1.06;letter-spacing:-.02em;color:var(--pine);max-width:none}
.fs h2 .accent{color:var(--ochre)}
.fs__line{white-space:nowrap}
.fs__keep{white-space:nowrap}

.fs__letter{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,3.4vw,48px);align-items:start}
.fs__letter p{margin:0 0 1.05em;font-size:clamp(.98rem,1.05vw,1.08rem);line-height:1.68;color:#44534d;max-width:none}
.fs__letter p:last-child{margin-bottom:0}
.fs__rule{width:46px;height:1px;margin:4px 0 18px;background:var(--ochre);border:0}
.fs__sign{margin-top:22px}
.fs__sign strong{display:block;font-family:var(--body);font-size:.72rem;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:var(--ochre)}
.fs__sign span{display:block;margin-top:6px;font-family:"Newsreader Italic",Georgia,serif;font-style:italic;font-size:1.02rem;color:#5a675f}

.fs__visual{position:relative;min-height:720px}
.fs__main{position:absolute;left:0;top:12%;width:74%;height:70%;margin:0;z-index:2}
.fs__inset{position:absolute;z-index:3;left:-4%;bottom:6%;width:48%;height:44%;margin:0;transform:rotate(-1.8deg)}
.fs__frame{width:100%;height:100%;overflow:hidden;background:var(--paper-deep);border:7px solid var(--white);border-radius:var(--radius);box-shadow:0 28px 70px -28px rgba(29,57,47,.34)}
.fs__frame img{width:100%;height:100%;object-fit:cover;display:block}
.fs__seal{position:absolute;z-index:4;right:-2%;bottom:0;width:148px;text-align:center;color:var(--ochre)}
.fs__seal svg{width:132px;height:90px;display:block;margin:0 auto}
.fs__seal svg text{font-family:var(--body);font-size:9.4px;letter-spacing:.14em;fill:var(--ochre)}
.fs__seal b{display:block;width:36px;height:1px;margin:2px auto 10px;background:var(--ochre)}
.fs__seal p{margin:0;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:#5d6964}

@media (max-width:1080px){
  .fs__visual{min-height:560px}
  .fs__main{width:86%;height:70%}
}

@media (max-width:820px){
  .fs-note{padding-top:128px}
  .fs__grid{grid-template-columns:1fr;gap:36px}
  .fs__letter{grid-template-columns:1fr;gap:8px}
  .fs__line{white-space:normal}
  .fs__wash{inset:auto 0 0 0;height:52%}
  .fs__veil{background:linear-gradient(180deg,rgba(247,245,239,1) 0%,rgba(247,245,239,.92) 42%,rgba(247,245,239,.2) 70%,rgba(247,245,239,.55) 100%)}
  .fs__visual{min-height:460px;order:-1}
  .fs__main{left:8%;top:8%;width:84%;height:68%}
  .fs__inset{width:56%;height:40%;left:4%}
  .fs__seal{right:8px;bottom:0}
  .fs__topo{opacity:.28}
}

@media (max-width:420px){
  .fs h2{font-size:2.2rem}
  .fs__visual{min-height:400px}
}