/* Naomi Market v4 | brand: forest #1c5500, cream #e1e2c9, dark green #1c3300 */
@font-face{font-family:"Regisha";src:url("fonts/regisha.woff2") format("woff2"),url("fonts/regisha.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"The Constellation";src:url("fonts/constellation.woff2") format("woff2"),url("fonts/constellation.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Nexa";src:url("fonts/nexa-extralight.woff2") format("woff2"),url("fonts/nexa-extralight.ttf") format("truetype");font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:"Nexa";src:url("fonts/nexa-heavy.woff2") format("woff2"),url("fonts/nexa-heavy.ttf") format("truetype");font-weight:800;font-style:normal;font-display:swap}

:root{--cream:#e1e2c9;--forest:#1c5500;--dark:#1c3300;--ink:#0f1a05;--line:#c4c6a6}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--cream);color:var(--dark);font:200 16px/1.5 "Nexa",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--forest);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--dark)}
img{display:block;width:100%;height:auto}
strong,b{font-weight:800}

/* type roles */
.nm{font-family:"Regisha",Georgia,serif;font-weight:400;letter-spacing:.01em}
.gx{font-family:"The Constellation",cursive;font-weight:400}
.label,h1,h2,h3,h4{font-family:"Nexa",Helvetica,Arial,sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.12em}
.label{font-size:11px;line-height:1.3}

/* film grain over every photo (from v3) */
.film{position:relative;overflow:hidden;background:#1c3300}
.film:after{content:"";position:absolute;inset:-50%;pointer-events:none;opacity:.22;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.film img{filter:contrast(.95) saturate(.85)}

/* top ticker */
.tick{position:sticky;top:0;z-index:20;background:var(--dark);color:var(--cream);overflow:hidden;white-space:nowrap;height:30px;display:flex;align-items:center}
.tick div{display:inline-block;font:800 11px/1 "Nexa",sans-serif;text-transform:uppercase;letter-spacing:.16em;animation:run 34s linear infinite;padding-top:2px}
.tick span{padding:0 14px}
.tick b{font-weight:400;opacity:.55}
@keyframes run{to{transform:translateX(-50%)}}

/* brand lockup: round logo + typed name */
.brand{display:flex;align-items:center;gap:10px;color:var(--dark);text-decoration:none}
.brand img{width:40px;height:40px;flex:none}
.brand .words{display:flex;flex-direction:column;line-height:1}
.brand .nm{font-size:21px;color:var(--dark)}
.brand .gx{font-size:15px;color:var(--forest);margin-top:2px;margin-left:1px}

/* nav */
header.top{padding:14px 18px 10px}
header.top .links{display:flex;flex-wrap:wrap;gap:6px 13px;margin-top:14px}
header.top .links a{font:800 11px/1 "Nexa",sans-serif;text-transform:uppercase;letter-spacing:.1em;color:var(--dark);text-decoration:none;padding:4px 0;border-bottom:1px solid transparent}
header.top .links a[aria-current="page"],header.top .links a:hover{border-bottom-color:var(--forest);color:var(--forest)}

main{display:block}
.wrap{padding:0 18px}

/* home hero */
.hero{padding:26px 18px 10px}
.hero .film{aspect-ratio:4/5}
.hero .film img{width:100%;height:100%;object-fit:cover;object-position:55% 50%}
.lock{text-align:center;padding:46px 18px 10px}
.lock img{width:112px;margin:0 auto 18px}
.lock .nm{display:block;font-size:46px;line-height:1;color:var(--dark)}
.lock .gx{display:block;font-size:31px;line-height:1.1;color:var(--forest);margin-top:4px}
.tag{max-width:330px;margin:26px auto 0;text-align:center}
.tag p+p{margin-top:8px}

/* info strip */
.strip{margin:46px 18px 0;border-top:1px solid var(--dark);border-bottom:1px solid var(--dark);display:grid;grid-template-columns:1fr;text-align:center}
.strip div{padding:18px 8px}
.strip div+div{border-top:1px solid var(--line)}
.strip .label{display:block;margin-bottom:6px;color:var(--forest)}
.strip a{color:var(--dark)}

/* finds grid */
.finds{padding:60px 18px 70px}
.finds .label.center{display:block;text-align:center;margin-bottom:28px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:44px 18px}
.item{text-align:center}
.item .film{aspect-ratio:1/1}
.item .film img{width:100%;height:100%;object-fit:cover}
.item p{margin-top:10px;font-size:13px}
.more{text-align:center;margin-top:46px;font-size:14px}

/* dark green column gallery (jetskis-like) */
.out{background:var(--dark);color:var(--cream);padding:46px 14px 56px}
.out .label{display:block;text-align:center;margin-bottom:26px;color:var(--cream)}
.cols{columns:2;column-gap:10px}
.cols .film{break-inside:avoid;margin-bottom:10px;border:1px solid #2f4a17}

/* page index */
.pages{padding:60px 18px 30px;text-align:center}
.pages a{display:block;font:800 22px/1 "Nexa",sans-serif;text-transform:uppercase;letter-spacing:.1em;color:var(--dark);text-decoration:none;padding:16px 0;border-top:1px solid var(--line)}
.pages a:last-child{border-bottom:1px solid var(--line)}
.pages a span{display:block;font:200 13px/1.3 "Nexa",sans-serif;text-transform:none;letter-spacing:0;margin-top:6px;color:var(--forest)}
.pages a:hover{color:var(--forest)}

/* inner pages */
.page{padding:34px 18px 60px}
.page h1{font-size:13px;color:var(--forest);margin-bottom:22px}
.lead{font-size:22px;line-height:1.3;max-width:560px}
.page .film{margin-top:30px}
.page p+p{margin-top:14px}
.narrow{max-width:560px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.pair .film{margin-top:0;aspect-ratio:4/5}
.pair .film img{height:100%;object-fit:cover}
.btn{display:inline-block;margin-top:24px;font:800 12px/1 "Nexa",sans-serif;text-transform:uppercase;letter-spacing:.14em;padding:15px 18px 13px;background:var(--forest);color:var(--cream);text-decoration:none}
.btn:hover{background:var(--dark);color:var(--cream)}
.btn.ghost{background:transparent;color:var(--dark);border:1px solid var(--dark)}
.btn.ghost:hover{background:var(--dark);color:var(--cream)}
.btns{display:flex;flex-wrap:wrap;gap:0 10px}
.note{font-size:14px;margin-top:18px}

/* faq */
.qa{max-width:600px;margin-top:10px}
.qa div{padding:20px 0;border-top:1px solid var(--line)}
.qa div:last-child{border-bottom:1px solid var(--line)}
.qa h2{font-size:13px;line-height:1.4;margin-bottom:8px;letter-spacing:.08em}

/* policy: plain readable */
.policy{max-width:640px}
.policy h2{font-size:13px;margin:38px 0 10px;color:var(--forest)}
.policy h2:first-of-type{margin-top:6px}
.policy h3{font-size:12px;margin:22px 0 6px;letter-spacing:.1em}
.policy p{font-size:16px;line-height:1.6;margin-top:10px}
.policy ul{margin:10px 0 0 20px}
.policy li{margin-top:6px;line-height:1.55}
.policy .final{font:800 20px/1.2 "Nexa",sans-serif;letter-spacing:.04em;color:var(--dark)}
.policy .sub{font-weight:800;margin-top:20px}

/* contact */
.big{font-size:22px;line-height:1.3}
.cblock{padding:22px 0;border-top:1px solid var(--line)}
.cblock .label{display:block;margin-bottom:8px;color:var(--forest)}
.cblock a{color:var(--dark)}
.socials a{margin-right:16px}

/* footer */
footer{border-top:1px solid var(--dark);margin:0 18px;padding:28px 0 44px;text-align:center;font-size:13px}
footer .brand{justify-content:center;margin-bottom:18px}
footer p{margin-top:4px}
footer a{color:var(--dark)}
footer .fl{margin-top:16px}
footer .fl a{font:800 10px/1 "Nexa",sans-serif;text-transform:uppercase;letter-spacing:.14em;margin:0 7px;text-decoration:none;display:inline-block;padding:6px 0}

.js .fade{opacity:0;transform:translateY(8px);transition:opacity .8s ease,transform .8s ease}
.js .fade.on{opacity:1;transform:none}

/* desktop: v3 left column nav */
@media(min-width:900px){
  body{font-size:17px}
  header.top{position:fixed;top:30px;left:0;width:210px;height:calc(100vh - 30px);padding:28px 26px;z-index:10}
  header.top .brand{flex-direction:column;align-items:flex-start;gap:12px}
  header.top .brand img{width:58px;height:58px}
  header.top .links{flex-direction:column;gap:10px;margin-top:34px}
  main,footer{margin-left:210px}
  footer{margin-right:60px}
  .hero{padding:40px 60px 0}
  .hero .film{aspect-ratio:16/9}
  .hero .film img{object-position:50% 22%}
  .lock{padding-top:60px}
  .lock .nm{font-size:72px}
  .lock .gx{font-size:46px}
  .tag{max-width:460px}
  .strip{margin:60px 60px 0;grid-template-columns:repeat(3,1fr)}
  .strip div+div{border-top:0;border-left:1px solid var(--line)}
  .strip div{padding:24px 12px}
  .finds{padding:80px 60px 90px}
  .grid{grid-template-columns:repeat(4,1fr);gap:60px 40px}
  .out{padding:60px 50px 80px}
  .cols{columns:3;column-gap:14px}
  .cols .film{margin-bottom:14px}
  .pages{padding:80px 60px 40px;max-width:760px;margin:0 auto}
  .pages a{font-size:30px}
  .page{padding:60px 60px 80px}
  .lead{font-size:30px;max-width:720px}
  .split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
  .split .film{margin-top:0}
  .pair{gap:14px}
  .contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 56px}
}

/* keep the round mark readable on cream: thin dark ring around the cream circle */
.brand img,.lock img{border-radius:50%;box-shadow:0 0 0 1.5px var(--dark)}
.lock img{box-shadow:0 0 0 2.5px var(--dark)}
.contact-grid>.film,.split>.film{align-self:start}

/* latest on instagram (hand-updated grid) */
.item a.post{display:block;color:var(--dark);text-decoration:none}
.item a.post p{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;color:var(--forest)}
.item a.post:hover p{color:var(--dark)}
.item a.post:focus-visible,.finds a:focus-visible{outline:2px solid var(--forest);outline-offset:4px}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:900px){
  .iggrid{grid-template-columns:repeat(3,1fr)}
}