/* ============================================================
   Nordre Ocean — Tilda-referenced dark redesign
   Content: Nordre Ocean (WordPress texts, verbatim)
   Design language: dark theme · Avory display · coral accent
   ============================================================ */

@font-face{
  font-family:"AvoryIPE";
  src:url("../fonts/AvoryIPE.woff") format("woff");
  font-weight:400 900;
  font-display:swap;
}

:root{
  --bg:#0b0b0d;
  --bg-2:#111114;
  --panel:#15151a;
  --line:rgba(255,255,255,.12);
  --ink:#ffffff;
  --muted:#9a9aa2;
  --muted-2:#6f6f78;
  --accent:#ff8562;
  --accent-2:#fa876b;
  --wave-green:#1f3a34;
  --display:"AvoryIPE","Arial Narrow",Arial,sans-serif;
  --body:"Inter",-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  --maxw:1660px;
  --pad:5vw;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

.container{max-width:none;margin:0;padding:0 var(--pad);}

h1,h2,h3{font-family:var(--display);font-weight:700;margin:0;letter-spacing:.2px;line-height:1.04;}

/* ---------- eyebrow ---------- */
.eyebrow{
  font-family:var(--display);
  font-weight:700;
  font-size:14px;
  letter-spacing:.4px;
  color:var(--muted);
  margin:0 0 18px;
  text-transform:none;
}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--display);
  font-weight:700;
  font-size:17px;
  line-height:1;
  padding:18px 30px;
  border:1.5px solid transparent;
  cursor:pointer;
  transition:background-color .3s, color .3s, border-color .3s, transform .3s;
}
.btn-white{background:#fff;color:#0b0b0d;}
.btn-white:hover{background:var(--accent);color:#0b0b0d;transform:translateY(-2px);}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.5);}
.btn-outline:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-2px);}
.btn-sm{padding:12px 22px;font-size:15px;}

/* ============ HEADER ============ */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:60;
  background:transparent;border-bottom:1px solid transparent;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
}
.site-header.scrolled{
  background:rgba(11,11,13,.82);
  backdrop-filter:blur(12px);
  border-bottom-color:var(--line);
}
.header-inner{display:flex;align-items:center;gap:28px;padding-top:20px;padding-bottom:20px;transition:padding .3s;}
.site-header.scrolled .header-inner{padding-top:13px;padding-bottom:13px;}
.logo img{height:52px;width:auto;transition:height .3s;}
.site-header.scrolled .logo img{height:42px;}
.main-nav{margin-left:auto;}
.main-nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0;}
.main-nav a{font-family:var(--display);font-weight:700;font-size:15px;color:var(--muted);transition:color .25s;}
.main-nav a:hover{color:#fff;}
.header-cta{margin-left:4px;}
.nav-toggle{display:none;}

/* ============ HERO ============ */
.hero{
  position:relative;
  min-height:100vh;
  display:flex;align-items:center;
  padding:150px 0 110px;
  background:linear-gradient(180deg,#0b0b0d 0%, #0d1211 60%, #0b0b0d 100%);
  overflow:hidden;
}
/* photographic depth on the right, fading to black behind the text */
.hero::before{
  content:"";position:absolute;inset:0;z-index:0;
  background-image:url("../images/salmon_fresh.jpg");
  background-size:cover;background-position:center right;
  opacity:.9;
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(120% 100% at 80% 25%, rgba(255,133,98,.10), transparent 50%),
    linear-gradient(98deg,#0a0a0c 22%, rgba(10,10,12,.82) 44%, rgba(10,10,12,.3) 72%, rgba(10,10,12,.08) 100%),
    linear-gradient(0deg,#0a0a0c 2%, transparent 38%);
}
.hero-wave{
  position:absolute;right:-8%;top:50%;transform:translateY(-50%);
  width:64%;max-width:920px;opacity:.55;pointer-events:none;z-index:1;
  filter:brightness(.95);
}
.hero-inner{position:relative;z-index:3;}
.hero-content{max-width:740px;}
.hero h1{
  font-size:clamp(44px,7.2vw,92px);
  margin:.1em 0 .3em;
  letter-spacing:-.5px;
}
.hero strong{font-weight:900;color:#fff;}
.hero-sub{
  font-family:var(--display);font-weight:700;
  font-size:clamp(20px,2.6vw,30px);
  color:var(--muted);margin:0 0 1.2em;
}
.hero-lead{
  font-size:clamp(17px,1.6vw,20px);
  color:#d4d4da;max-width:620px;margin:0 0 2em;line-height:1.7;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:2em;}
.hero-contact{font-size:15px;color:var(--muted);}
.hero-contact a{color:#cfcfd6;border-bottom:1px solid transparent;transition:border-color .25s,color .25s;}
.hero-contact a:hover{color:var(--accent);border-color:var(--accent);}

/* ============ SECTIONS / SPLIT ============ */
.section{padding:110px 0;position:relative;}
/* full-background split sections run edge-to-edge with no vertical padding */
.about,.salmon,.product,.fishing{padding:0;}
.principles{background:var(--bg-2);}
.specs{background:var(--bg-2);}

/* ---- stacking / overlap: every block after the 2nd (About) rides up onto
        the previous one with a rounded top edge and a soft shadow ---- */
.section:not(.about){
  position:relative;
  z-index:1;
  margin-top:-66px;
  border-top-left-radius:40px;
  border-top-right-radius:40px;
  overflow:hidden;
  box-shadow:0 -26px 60px rgba(0,0,0,.55);
}
/* keep full-bg photo sections opaque under the rounded corners */
.section:not(.about).product,
.section.salmon,
.section.fishing{background:var(--bg);}

/* full-background: photo covers the whole block; text overlays the darkened side */
.container.split{max-width:none;padding:0;}
.split{
  position:relative;display:flex;align-items:center;
  min-height:90vh;overflow:hidden;
}
.split-media{position:absolute;inset:0;margin:0;z-index:0;}
.split-media img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(1.04) contrast(1.03);
}
/* readability overlay — dark on the text side, fading toward the photo */
.split::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(100deg, #0a0a0c 0%, rgba(10,10,12,.92) 26%, rgba(10,10,12,.55) 52%, rgba(10,10,12,.12) 78%, rgba(10,10,12,0) 100%),
    linear-gradient(0deg, rgba(10,10,12,.55) 0%, transparent 32%);
}
.split.reverse{justify-content:flex-end;}
.split.reverse::after{
  background:
    linear-gradient(260deg, #0a0a0c 0%, rgba(10,10,12,.92) 26%, rgba(10,10,12,.55) 52%, rgba(10,10,12,.12) 78%, rgba(10,10,12,0) 100%),
    linear-gradient(0deg, rgba(10,10,12,.55) 0%, transparent 32%);
}
.split-text{
  position:relative;z-index:2;
  max-width:660px;padding:80px var(--pad);
}
.split.reverse .split-text{text-align:left;}
.split-text h2{
  font-size:clamp(38px,5vw,78px);
  margin:0 0 .5em;
}
.split-text p{color:#d4d4da;margin:0 0 1.2em;}
.split-text .lead-line{
  font-family:var(--display);font-weight:700;color:#fff;
  font-size:clamp(22px,2.4vw,30px);line-height:1.3;margin-bottom:1em;
}

.section-h{font-size:clamp(38px,5vw,72px);margin:0 0 16px;}

/* ============ PRINCIPLES ============ */
.principles .section-h{margin-bottom:48px;}
.cards-3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.pcard{
  background:var(--panel);
  border:1px solid var(--line);
  overflow:hidden;
  display:flex;flex-direction:column;
}
.pcard-img{aspect-ratio:16/10;overflow:hidden;}
.pcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.pcard:hover .pcard-img img{transform:scale(1.05);}
.pcard h3{font-size:24px;padding:24px 24px 0;line-height:1.15;}
.pcard p{color:#b5b5bd;padding:12px 24px 28px;margin:0;font-size:16px;}

/* ============ SALMON cert ============ */
.cert-row{display:flex;align-items:center;gap:14px;margin:0 0 1.8em;}
.cert-badge{height:54px;width:auto;background:#fff;padding:6px 8px;border-radius:4px;}
.cert-row span{color:var(--muted);font-size:15px;}

/* ============ SPECS ============ */
.specs .section-h{margin-bottom:44px;}
.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-bottom:34px;}
.spec-card{
  background:var(--panel);border:1px solid var(--line);
  padding:36px 34px;
}
.spec-card h3{font-size:26px;margin-bottom:18px;}
.spec-label{
  font-family:var(--display);font-weight:700;font-size:13px;
  letter-spacing:.5px;color:var(--accent);margin:0 0 16px;text-transform:uppercase;
}
.chips{display:flex;flex-wrap:wrap;gap:12px;}
.chips span{
  font-family:var(--display);font-weight:700;font-size:18px;
  border:1px solid var(--line);padding:12px 18px;color:#fff;
  background:rgba(255,255,255,.02);
}
.spec-table{width:100%;border-collapse:collapse;}
.spec-table td{
  padding:13px 6px;border-bottom:1px solid var(--line);color:#d4d4da;font-size:16px;
}
.spec-table td:first-child{font-family:var(--display);font-weight:700;color:#fff;width:70px;font-size:18px;}
.spec-table tr:last-child td{border-bottom:0;}
.specs-note{color:var(--muted);margin:0;font-size:16px;}

/* product spec cards */
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:46px;}
.prod-card{background:var(--panel);border:1px solid var(--line);padding:28px 26px;transition:border-color .25s;}
.prod-card:hover{border-color:rgba(255,133,98,.5);}
.prod-card h3{font-size:20px;line-height:1.2;margin:0 0 18px;color:#fff;}
.prod-card dl{margin:0;}
.prod-card dt{font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.4px;text-transform:uppercase;color:var(--accent);margin-top:12px;}
.prod-card dt:first-child{margin-top:0;}
.prod-card dd{margin:3px 0 0;color:#d4d4da;font-size:15px;line-height:1.5;}
.trim-guide{border-top:1px solid var(--line);padding-top:36px;margin-bottom:30px;}
.trim-guide .spec-label{margin-bottom:20px;}
.trim-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 48px;}
.trim-list li{color:#c0c0c8;font-size:15px;line-height:1.6;}
.trim-list strong{color:#fff;font-family:var(--display);font-weight:700;}
.disclaimer{color:var(--muted-2);font-size:13px;margin:18px 0 0;max-width:920px;line-height:1.5;}

/* ============ ATLANTIC ============ */
.opt-row{display:flex;gap:40px;flex-wrap:wrap;margin-top:6px;}
.opt-row p{margin:0;}
.opt-row .spec-label{margin-bottom:6px;}
.species-wrap{margin-top:80px;}
.species-wrap .eyebrow{margin-bottom:26px;font-size:22px;color:#fff;}
.species-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 40px;
  border-top:1px solid var(--line);padding-top:34px;}
.species-cols ul{list-style:none;margin:0;padding:0;}
.species-cols li{color:#fff;font-weight:600;margin:0 0 16px;line-height:1.4;font-size:17px;}
.species-cols li span{color:var(--muted-2);font-weight:400;font-size:14px;}

/* ============ CONTACT ============ */
.contact{
  background:linear-gradient(180deg,#0b0b0d,#0e1413);
  overflow:hidden;
}
.contact-wave{
  position:absolute;right:-10%;top:-10%;width:60%;opacity:.35;pointer-events:none;
}
.contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;position:relative;z-index:2;align-items:start;}
.contact-left h2{font-size:clamp(32px,3.8vw,52px);margin:0 0 36px;line-height:1.08;}
#request-form{display:flex;flex-direction:column;gap:16px;max-width:560px;}
.field-row{display:flex;gap:16px;}
.field-row input{flex:1;min-width:0;}
#request-form input,#request-form textarea{
  width:100%;font-family:var(--body);font-size:16px;color:#fff;
  background:transparent;border:0;border-bottom:1.5px solid var(--line);
  padding:14px 2px;transition:border-color .25s;
}
#request-form input::placeholder,#request-form textarea::placeholder{color:var(--muted-2);}
#request-form input:focus,#request-form textarea:focus{outline:none;border-color:var(--accent);}
#request-form textarea{resize:vertical;min-height:90px;}
.form-bottom{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:8px;}
.captcha{display:flex;align-items:center;gap:10px;font-size:16px;color:#fff;flex:0 0 auto;}
.captcha #captcha-q{white-space:nowrap;font-family:var(--display);font-weight:700;}
#request-form .captcha input{width:64px;flex:0 0 64px;text-align:center;border-bottom-color:var(--line);}
.form-status{margin:0;font-size:14px;min-height:1.2em;}
.form-status.ok{color:#5fd08a;}
.form-status.err{color:#ff8a7a;}

.ci-cards{display:flex;flex-direction:column;gap:14px;margin-bottom:24px;}
.ci-card{
  display:block;background:var(--panel);border:1px solid var(--line);
  padding:20px 24px;transition:border-color .25s,transform .25s,background .25s;
}
.ci-card:hover{border-color:var(--accent);transform:translateX(4px);}
.ci-role{font-family:var(--display);font-weight:700;font-size:13px;letter-spacing:.4px;
  color:var(--muted);margin:0 0 4px;text-transform:uppercase;}
.ci-mail{margin:0;color:#fff;font-size:17px;}
.addr-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.addr-card{background:var(--panel);border:1px solid var(--line);padding:22px 24px;}
.addr-card p{margin:0 0 10px;color:#c7c7cf;font-size:15px;line-height:1.6;}
.addr-card p:last-child{margin-bottom:0;}
.addr-card a:hover{color:var(--accent);}

/* ============ FOOTER ============ */
.site-footer{background:#08080a;border-top:1px solid var(--line);padding:48px 0;}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.footer-inner .logo img{height:38px;}
.footer-note{color:var(--muted);font-size:14px;text-align:right;margin:0;line-height:1.7;}

/* ============ back to top ============ */
.to-top{
  position:fixed;right:18px;bottom:18px;z-index:50;
  width:44px;height:44px;border:1px solid var(--line);background:rgba(20,20,24,.8);
  color:#fff;display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .3s,transform .3s,visibility .3s,border-color .25s;
}
.to-top.show{opacity:1;visibility:visible;transform:none;}
.to-top:hover{border-color:var(--accent);color:var(--accent);}

/* ============ reveal (visible by default; .pre hides below-fold) ============ */
.reveal{opacity:1;transform:none;}
.reveal.pre{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.22,.61,.36,1);}
.reveal.pre.in{opacity:1;transform:none;}

/* ============ responsive ============ */
@media (max-width:1200px){
  .prod-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:980px){
  .cards-3{grid-template-columns:1fr;max-width:460px;}
  .species-cols{grid-template-columns:1fr 1fr;}
  .trim-list{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .prod-grid{grid-template-columns:1fr;}
}
@media (max-width:820px){
  body{font-size:16px;}
  .main-nav,.header-cta{display:none;}
  .nav-toggle{display:flex;flex-direction:column;gap:5px;margin-left:auto;background:none;border:0;cursor:pointer;padding:6px;}
  .nav-toggle span{width:26px;height:2px;background:#fff;transition:transform .3s,opacity .3s;}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  .main-nav.open{
    display:block;position:absolute;top:100%;left:0;right:0;
    background:rgba(11,11,13,.97);border-bottom:1px solid var(--line);
  }
  .main-nav.open ul{flex-direction:column;gap:0;padding:8px 6vw 18px;}
  .main-nav.open a{display:block;padding:12px 0;color:#fff;}
  .split{min-height:78vh;}
  .split.reverse{justify-content:flex-start;}
  .split-text{padding:48px var(--pad);max-width:none;}
  .split::after,.split.reverse::after{
    background:
      linear-gradient(180deg, rgba(10,10,12,.55) 0%, rgba(10,10,12,.78) 45%, rgba(10,10,12,.92) 100%);
  }
  .spec-grid{grid-template-columns:1fr;}
  .contact-grid{grid-template-columns:1fr;gap:44px;}
  .hero-wave{width:120%;right:-30%;opacity:.32;}
}
@media (max-width:560px){
  .species-cols{grid-template-columns:1fr;}
  .addr-cards{grid-template-columns:1fr;}
  .field-row{flex-direction:column;}
  .opt-row{gap:24px;}
}

/* ============ reduced motion ============ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;transition:none;}
  .btn:hover,.ci-card:hover,.pcard:hover .pcard-img img{transform:none;}
}