@font-face{font-family:"Rampart One";src:url("/fonts/RampartOne-latin.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Assistant";src:url("/fonts/Assistant-var-latin.woff2") format("woff2");font-weight:400 700;font-style:normal;font-display:swap}
:root{
  --ink:#0c0709;--magma:#ff3a22;--ember:#ffb044;--teal:#2eefe0;--bone:#f6eee0;--bronze:#d4923e;
  --ink-2:#160b0e;--panel:#14090c;--line:rgba(212,146,62,.5);--max:1260px;
  --h-quay:60px;--h-tick:28px;--h-cross:298px;--h-barge:124px;--h-berth:192px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
html,body{margin:0;padding:0;background:var(--ink);color:var(--bone);font-family:Assistant,system-ui,sans-serif;font-size:16px;line-height:1.55}
img{max-width:100%;height:auto;display:block}a{color:var(--teal);text-decoration:none}a:hover{color:var(--ember)}
.ss-skip{position:absolute;left:-999px}.ss-skip:focus{left:8px;top:8px;background:var(--teal);color:#04110f;padding:8px 12px;z-index:80}
.ss-quay{position:sticky;top:0;z-index:40;height:var(--h-quay);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:linear-gradient(180deg,#1a0a0d,#0c0709);border-bottom:1px solid var(--ember);box-shadow:0 0 28px rgba(255,45,26,.45),0 0 16px rgba(26,212,196,.2)}
.ss-mark{display:flex;align-items:center;gap:10px;color:var(--bone);font-family:"Rampart One",cursive;font-size:32px;letter-spacing:.05em;white-space:nowrap;text-shadow:0 0 18px rgba(255,176,68,.6),0 0 8px rgba(255,45,26,.45)}
.ss-mark svg{width:44px;height:44px;flex:none;filter:drop-shadow(0 0 8px rgba(255,176,68,.75)) drop-shadow(0 0 4px rgba(46,239,224,.4))}
.ss-chips{display:flex;align-items:center;gap:7px;flex-wrap:nowrap}
.ss-chip{border:1.5px solid rgba(255,58,34,.8);color:var(--bone);background:rgba(12,7,9,.45);border-radius:999px;height:38px;display:inline-flex;align-items:center;padding:0 15px;font-weight:700;font-size:14px;box-shadow:0 0 8px rgba(255,45,26,.18)}
.ss-chip[aria-current="page"],.ss-chip:hover{background:linear-gradient(180deg,#4a1410,#1a0708);border-color:var(--magma);color:#fff;box-shadow:0 0 12px rgba(255,45,26,.45)}
.ss-age{margin-left:6px;width:44px;height:44px;border-radius:50%;border:2px solid var(--magma);display:grid;place-items:center;font-size:10px;font-weight:800;line-height:1.1;text-align:center;color:#fff;background:#2a0808;box-shadow:0 0 12px rgba(255,45,26,.6)}
.ss-toggle{display:none;background:none;border:1px solid var(--bronze);color:var(--bone);border-radius:8px;padding:6px 10px}
.ss-ticker{height:var(--h-tick);background:#070405;border-top:1px solid rgba(46,239,224,.55);border-bottom:1px solid rgba(255,58,34,.7);overflow:hidden;display:flex;align-items:center;box-shadow:0 0 14px rgba(46,239,224,.28)}
.ss-ticker-track{display:flex;gap:36px;white-space:nowrap;animation:ss-marq 32s linear infinite;font-size:13px;font-weight:700;letter-spacing:.08em}
.ss-ticker b{color:var(--teal)}.ss-ticker em{color:var(--magma);font-style:normal}
@keyframes ss-marq{to{transform:translateX(-100%)}}
.ss-crossing{height:var(--h-cross);margin:10px auto 0;width:min(var(--max),calc(100% - 20px));border-radius:14px;position:relative;overflow:hidden;border:1px solid var(--ember);box-shadow:0 0 42px rgba(255,45,26,.5),0 0 24px rgba(46,239,224,.28),inset 0 0 50px rgba(255,45,26,.14)}
.ss-crossing img.ss-hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:16% 36%;filter:brightness(1.22) contrast(1.1) saturate(1.22)}
.ss-crossing::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,3,4,.08) 0%,rgba(8,3,4,.22) 34%,rgba(8,3,4,.42) 56%,rgba(8,3,4,.18) 100%)}
.ss-crossing-copy{position:relative;z-index:2;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:10px 210px 10px 36px}
.ss-crossing-copy p.ss-kicker{margin:0;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);font-weight:700;text-shadow:0 0 10px rgba(46,239,224,.55)}
.ss-crossing-copy h1{margin:4px 0 8px;font-family:"Rampart One",cursive;font-weight:400;font-size:clamp(42px,4.8vw,62px);line-height:1.02;color:var(--bone);text-shadow:0 0 22px rgba(0,0,0,.65),0 2px 0 rgba(0,0,0,.45)}
.ss-crossing-copy h1 span.z{color:var(--teal);text-shadow:0 0 18px rgba(46,239,224,.7)} .ss-crossing-copy h1 span.h{color:var(--magma);text-shadow:0 0 18px rgba(255,58,34,.75)}
.ss-crossing-copy .ss-lead{margin:0 0 12px;font-size:16px;color:#f3eadc;text-shadow:0 1px 8px rgba(0,0,0,.7)}
.ss-cta,.ss-cta-rec{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 28px;font-weight:800;letter-spacing:.05em;border:2px solid transparent;cursor:pointer;text-decoration:none}
.ss-cta{background:linear-gradient(90deg,#14c4b6,#ff3a22);color:#fff;box-shadow:0 0 22px rgba(46,239,224,.55),0 0 22px rgba(255,45,26,.45);font-size:17px}
.ss-cta:hover{color:#fff;filter:brightness(1.08)}
.ss-cta-rec{background:#081614;color:var(--teal);border-color:var(--teal);font-size:13px;padding:8px 14px}
.ss-cta-rec:hover{background:#0e2a27;color:#fff}
.ss-obol{position:absolute;right:18px;top:50%;transform:translateY(-50%);z-index:3;width:176px;height:176px}
.ss-obol svg{width:176px;height:176px;filter:drop-shadow(0 0 16px rgba(46,239,224,.7)) drop-shadow(0 0 8px rgba(255,176,68,.35))}
.ss-obol .ss-obol-n{font-family:"Rampart One",cursive;font-size:22px;fill:var(--teal)}
.ss-barges{width:min(var(--max),calc(100% - 20px));margin:10px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;height:var(--h-barge)}
.ss-barge{display:flex;align-items:center;gap:12px;height:var(--h-barge);border-radius:10px;overflow:hidden;border:1px solid var(--bronze);background:linear-gradient(90deg,#160b0e,#0a0506);box-shadow:0 0 18px rgba(255,45,26,.3),0 0 10px rgba(46,239,224,.16);color:var(--bone);text-decoration:none}
.ss-barge:hover{color:var(--bone);border-color:var(--ember);box-shadow:0 0 22px rgba(255,45,26,.45)}
.ss-barge img{width:148px;height:100%;object-fit:cover;object-position:12% center;flex:none;filter:brightness(1.12) saturate(1.15)}
.ss-barge-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;padding-right:12px}
.ss-barge-copy strong{font-family:"Rampart One",cursive;font-weight:400;font-size:20px;color:#ff4a2a;line-height:1.15;letter-spacing:.02em;text-shadow:0 0 12px rgba(255,45,26,.55)}
.ss-barge-copy em{font-style:normal;font-size:14px;color:#efe2ce;margin-top:4px;line-height:1.3}
.ss-pier-head{width:min(var(--max),calc(100% - 20px));margin:8px auto 0;display:flex;align-items:baseline;justify-content:space-between;height:24px}
.ss-pier-head h2{margin:0;font-family:"Rampart One",cursive;font-size:20px;color:var(--bone);font-weight:400}
.ss-pier-head p{margin:0;font-size:12px;color:var(--teal)}
@media (min-width:901px){
  .ss-pier-head{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);margin:0;padding:0;border:0}
}
.ss-pier{width:min(var(--max),calc(100% - 20px));margin:8px auto 0;display:grid;grid-template-columns:repeat(8,1fr);gap:8px;height:var(--h-berth)}
.ss-berth{position:relative;display:block;height:var(--h-berth);border-radius:10px;overflow:hidden;border:1px solid var(--bronze);background:#070405;box-shadow:0 0 16px rgba(255,176,68,.32),0 0 10px rgba(46,239,224,.14)}
.ss-berth:hover{border-color:var(--ember);box-shadow:0 0 20px rgba(255,45,26,.4)}
.ss-berth img{width:100%;height:100%;object-fit:contain;background:#070405;filter:brightness(1.08) saturate(1.12)}
.ss-badge{position:absolute;top:8px;left:50%;transform:translateX(-50%);font-size:11px;font-weight:800;letter-spacing:.08em;padding:4px 10px;border-radius:6px;color:#fff;z-index:2;box-shadow:0 0 8px rgba(0,0,0,.45)}
.ss-hot{background:#8a1210;border:1px solid var(--magma)}.ss-novo{background:#0a4a44;border:1px solid var(--teal)}
.ss-main{width:min(var(--max),calc(100% - 20px));margin:70px auto 40px}
.ss-grid-2{display:grid;grid-template-columns:1.3fr .7fr;gap:18px}
.ss-panel{background:linear-gradient(180deg,#160b0e,#10080a);border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:inset 0 0 0 1px rgba(26,212,196,.08)}
.ss-panel h2,.ss-copy h2{font-family:"Rampart One",cursive;font-weight:400;font-size:28px;margin:0 0 10px;color:var(--bone)}
.ss-panel h3,.ss-copy h3{font-family:"Rampart One",cursive;font-weight:400;font-size:22px;margin:18px 0 8px}
.ss-copy p,.ss-panel p{margin:0 0 12px}
.ss-exchange table{width:100%;border-collapse:collapse;font-size:14px}
.ss-exchange th,.ss-exchange td{border-bottom:1px solid rgba(196,132,58,.25);padding:8px 6px;text-align:left}
.ss-exchange th{color:var(--teal);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.ss-note{font-size:13px;color:#d9cbb8}.ss-warn{font-size:13px;border-left:3px solid var(--magma);padding:8px 12px;background:#1a0a0c;border-radius:0 8px 8px 0}
.ss-crumbs{font-size:13px;margin:0 0 14px;color:#cbb8a4}.ss-crumbs a{color:var(--ember)}
.ss-hero-page{border-radius:14px;overflow:hidden;border:1px solid var(--bronze);margin:0 0 18px}
.ss-hero-page img{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover}
.ss-fig{margin:0 0 16px}.ss-fig figcaption{font-size:13px;color:#d9cbb8;margin-top:6px}
.ss-cta-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0}
.ss-disc{font-size:12px;color:#cbb8a4;margin:6px 0 0}
.ss-keel{background:#070405;border-top:1px solid var(--bronze);padding:28px 18px 40px;margin-top:40px}
.ss-keel-in{width:min(var(--max),calc(100% - 8px));margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px;font-size:14px}
.ss-keel h2{font-family:"Rampart One",cursive;font-weight:400;font-size:20px;margin:0 0 8px}
.ss-keel ul{margin:0;padding:0;list-style:none}.ss-keel li{margin:0 0 6px}
.ss-pass{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:16px 0}
.ss-pass a.ss-feat{display:block;border:1px solid var(--bronze);border-radius:12px;overflow:hidden;background:#10080a}
.ss-pass a.ss-feat img{aspect-ratio:16/9;object-fit:cover;width:100%}
.ss-pass a.ss-feat span{display:block;padding:8px 10px;font-weight:700}
.ss-vaus{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.ss-vaus button{background:#14090c;color:var(--bone);border:1px solid var(--bronze);border-radius:999px;padding:6px 12px;font-weight:700;cursor:pointer}
.ss-vaus button.is-on{background:#1a2e2c;border-color:var(--teal);color:var(--teal)}
.ss-search{width:min(420px,100%);padding:8px 12px;border-radius:999px;border:1px solid var(--bronze);background:#070405;color:var(--bone);font:inherit}
.ss-ford{margin:22px 0}
.ss-ford h2{font-family:"Rampart One",cursive;font-weight:400;margin:0 0 10px}
.ss-slips{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.ss-slip{border:1px solid var(--line);border-radius:12px;padding:12px;background:linear-gradient(180deg,#16100a,#10080a);position:relative}
.ss-slip h3{margin:0 0 4px;font-size:16px;font-family:"Rampart One",cursive;font-weight:400}
.ss-slip .ss-stamp{position:absolute;right:8px;top:8px;width:28px;height:28px;border-radius:50%;border:2px solid var(--bronze);display:grid;place-items:center;font-size:11px;color:var(--ember);font-weight:800}
.ss-slip .ss-actions{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.ss-slip a.ss-visit{color:var(--ember);font-weight:700;font-size:13px}
.ss-hidden{display:none !important}
.ss-more{margin-top:10px;background:#14090c;color:var(--teal);border:1px solid var(--teal);border-radius:999px;padding:8px 16px;font-weight:700;cursor:pointer}
.ss-permit{border:1px solid var(--bronze);border-radius:16px;padding:18px;background:#12080a;margin:0 0 18px}
.ss-faq details{border-bottom:1px solid var(--line);padding:8px 0}
.ss-faq summary{cursor:pointer;font-weight:700;color:var(--ember)}
.ss-ok{font-size:13px;color:#d9cbb8;margin-top:24px}
@media (max-width:900px){
  .ss-chips{display:none;position:absolute;top:var(--h-quay);left:0;right:0;background:#12080a;flex-direction:column;padding:12px;border-bottom:1px solid var(--bronze);z-index:30;height:auto}
  .ss-chip{height:40px;justify-content:center}
  .ss-quay.is-open .ss-chips{display:flex}
  .ss-toggle{display:block}
  .ss-crossing{height:auto;min-height:220px}
  .ss-crossing-copy{padding:16px 14px 16px;flex-direction:column}
  .ss-crossing-copy h1{font-size:clamp(30px,9vw,48px)}
  .ss-obol{position:relative;right:auto;top:auto;transform:none;margin:8px auto 10px}
  .ss-barges{height:auto;grid-template-columns:1fr;gap:8px}
  .ss-barge{height:96px}
  .ss-barge img{width:120px}
  .ss-pier{grid-template-columns:repeat(2,1fr);height:auto}
  .ss-berth{height:230px}
  .ss-grid-2,.ss-keel-in,.ss-pass{grid-template-columns:1fr}
  .ss-main{margin:28px auto 40px}
  :root{--h-cross:auto}
}
