/* /assets/okto-system.css */
/* OKTOPODS shared content system v1, 29 October 2026; type tokens 6 November 2026.
   Canonical source: oktopods-relaunch-2026. Copy with sync-design-system.py.
   Opt-in components only. No global element/type resets; the locked header,
   opening and authored case compositions keep their existing styles. */
@font-face{font-family:OktoSystem;src:url('/assets/system/fonts/lausanne-100.woff2') format('woff2');font-weight:100;font-display:swap}
@font-face{font-family:OktoSystem;src:url('/assets/system/fonts/lausanne-200.woff2') format('woff2');font-weight:200;font-display:swap}
@font-face{font-family:OktoSystem;src:url('/assets/system/fonts/lausanne-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:OktoSystem;src:url('/assets/system/fonts/lausanne-700.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:OktoSystem;src:url('/assets/system/fonts/lausanne-800.woff2') format('woff2');font-weight:800;font-display:swap}
:root{
 --okto-paper:#f8f8f8;--okto-ink:#181b18;--okto-muted:#62665f;--okto-line:#d9dcd5;
 --okto-brand:linear-gradient(90deg,#ffd400,#ff1e1e);
 --okto-tech:linear-gradient(90deg,#00e5ff,#2962ff);
 --okto-creative:linear-gradient(90deg,#6a2bff,#ff2d95);
 --okto-font:OktoSystem,Lausanne,Arial,sans-serif;
 /* Type roles (see DESIGN_SYSTEM.md). Applied by type-system.css; case-system.css and legal.css read them too. */
 --type-display:clamp(56px,7.778vw,112px);--type-chapter:clamp(45.6px,4.8vw,72px);
 --type-statement:clamp(32px,3.333vw,48px);--type-title:clamp(24px,2.222vw,32px);
 --type-body:clamp(19px,1.528vw,22px);--type-supporting:16px;--type-label:14px;
 --type-light:200;
 --okto-edge:16px;--okto-grid-gap:clamp(40px,6.667vw,96px);
 --okto-chapter-space:clamp(104px,12svh,176px);--okto-chapter-gap:clamp(48px,6svh,80px);
 --okto-context-gradient:var(--okto-brand);--okto-focus:#181b18;--okto-focus-gap:#f8f8f8;
}
[data-okto-heart=brand]{--okto-context-gradient:var(--okto-brand)}
[data-okto-heart=tech]{--okto-context-gradient:var(--okto-tech)}
[data-okto-heart=creative]{--okto-context-gradient:var(--okto-creative)}
.okto-surface-paper{background:var(--okto-paper);color:var(--okto-ink)}
.okto-surface-dark{--okto-focus:#f8f8f8;--okto-focus-gap:#181b18;background:var(--okto-ink);color:var(--okto-paper)}
.okto-equal-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--okto-grid-gap)}
.okto-equal-columns>*{min-width:0}
.okto-type-chapter.okto-type-chapter,.okto-type-statement.okto-type-statement,.okto-type-subsection.okto-type-subsection,.okto-type-body.okto-type-body,.okto-type-supporting.okto-type-supporting,.okto-type-caption.okto-type-caption,.okto-type-label.okto-type-label,.okto-type-ui.okto-type-ui{font-family:var(--okto-font)}
.okto-type-chapter.okto-type-chapter{font-size:clamp(45.6px,4.8vw,72px);line-height:1.02;font-weight:700;letter-spacing:-.04em;text-wrap:balance}
.okto-type-statement.okto-type-statement{font-size:clamp(40px,3.35vw,52px);line-height:1.12;font-weight:200;letter-spacing:-.035em;max-width:29ch}
.okto-type-subsection.okto-type-subsection{font-size:36px;line-height:42px;font-weight:700;letter-spacing:-.035em;text-wrap:balance}
.okto-type-body.okto-type-body{font-size:21px;line-height:30px;font-weight:200;letter-spacing:-.02em;max-width:58ch}
.okto-type-supporting.okto-type-supporting{font-size:18px;line-height:26px;font-weight:200;letter-spacing:-.01em}
.okto-type-caption.okto-type-caption{font-size:14px;line-height:20px;font-weight:200;letter-spacing:0;color:var(--okto-muted)}
.okto-type-label.okto-type-label{font-size:14px;line-height:20px;font-weight:400;letter-spacing:.15em;text-transform:uppercase}
.okto-type-ui.okto-type-ui{font-size:16px;line-height:20px;font-weight:400;letter-spacing:0}
.okto-product-name.okto-product-name{display:block;margin:0;font-family:var(--okto-font);font-size:clamp(72px,7.778vw,112px);line-height:1.04;letter-spacing:-.04em;font-weight:100;white-space:nowrap;color:var(--okto-ink);text-transform:none}
.okto-product-prefix.okto-product-prefix{font-family:var(--okto-font);font-weight:100;color:var(--okto-ink)}
.okto-product-pod.okto-product-pod{font-family:var(--okto-font);font-weight:800;background:var(--okto-context-gradient);background-clip:text;-webkit-background-clip:text;color:transparent}
.okto-product-pod.okto-product-pod{display:inline-block;padding-right:.035em;margin-right:-.035em}
.okto-product-name--teaser.okto-product-name--teaser{font-size:clamp(56px,5.556vw,80px)}
.okto-product-name--compact.okto-product-name--compact{font-size:56px}
.okto-product-descriptor.okto-product-descriptor{margin:16px 0 0;font-family:var(--okto-font);font-size:24px;line-height:32px;font-weight:200;letter-spacing:-.015em;color:var(--okto-ink);text-transform:none}
.okto-product-title.okto-product-title{font-family:var(--okto-font);font-size:clamp(45.6px,4.8vw,72px);line-height:1.02;font-weight:700;letter-spacing:-.04em;text-wrap:balance;text-transform:none}
.okto-action,.okto-text-action,.okto-control,.okto-tab{box-sizing:border-box;font-family:var(--okto-font);letter-spacing:0;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.okto-action.okto-action{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;width:fit-content;max-width:100%;min-height:56px;padding:17px 24px;border:1px solid var(--okto-ink);border-radius:0;background:var(--okto-ink);color:var(--okto-paper);font-size:16px;font-weight:700;line-height:20px;text-transform:uppercase;text-decoration:none;white-space:normal;box-shadow:none;cursor:pointer;transition:background-color 140ms ease,color 140ms ease,border-color 140ms ease}
.okto-action.okto-action:hover{background:#303530;border-color:#303530;color:var(--okto-paper);box-shadow:none;transform:none}
.okto-action.okto-action:active{background:#000;border-color:#000;transform:none}
.okto-action.okto-action--large{min-height:64px;padding-block:21px}
.okto-action.okto-action--inverse{--okto-focus:#f8f8f8;--okto-focus-gap:#181b18;background:var(--okto-paper);border-color:var(--okto-paper);color:var(--okto-ink)}
.okto-action.okto-action--inverse:hover{background:#e7eae4;border-color:#e7eae4;color:var(--okto-ink)}
.okto-action.okto-action--inverse:active{background:#cdd2c9;border-color:#cdd2c9}
.okto-action.okto-action:disabled,.okto-action.okto-action[aria-disabled=true]{background:var(--okto-line);border-color:var(--okto-line);color:var(--okto-muted);cursor:not-allowed}
.okto-action.okto-action--inverse:disabled{background:#3e433c;border-color:#3e433c;color:#a6ada1}
.okto-action :is(svg,img),.okto-text-action svg{width:20px;height:20px;flex:0 0 20px}
.okto-action .button-arrow{font-family:var(--okto-font);font-size:20px;line-height:20px;flex:0 0 20px;color:currentColor;background:none}
.okto-action .okto-icon,.okto-text-action .okto-icon{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:square;stroke-linejoin:miter}
.okto-text-action.okto-text-action{display:inline-flex;align-items:center;gap:20px;min-height:44px;max-width:100%;padding:10px 0;border:0;border-radius:0;background:none;color:inherit;font-size:16px;font-weight:400;line-height:24px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;cursor:pointer}
.okto-text-action.okto-text-action:hover{text-decoration-thickness:2px}
.okto-control.okto-control{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:10px;border:0;border-radius:0;font-family:var(--okto-font);font-size:16px;font-weight:400;line-height:24px;cursor:pointer}
.okto-control.okto-control[hidden]{display:none}
.okto-control.okto-control:disabled{cursor:default;opacity:.6}
.okto-control--text.okto-control--text{width:auto;gap:8px;padding-inline:8px;background:transparent;color:inherit;text-decoration:underline;text-underline-offset:5px}
.okto-tab.okto-tab{min-height:44px;padding-block:10px;font-family:var(--okto-font);font-size:16px;line-height:24px;font-weight:400;border-radius:0}
.okto-tab.okto-tab[aria-selected=true]{font-weight:700}
:is(.okto-action,.okto-text-action,.okto-control,.okto-tab,.okto-field):focus-visible{outline:2px solid var(--okto-focus);outline-offset:4px;box-shadow:0 0 0 4px var(--okto-focus-gap)}
.okto-field{font-family:var(--okto-font);font-size:18px;line-height:26px}
.okto-field[aria-invalid=true],.okto-field:user-invalid{border-color:#b02525}
/* Existing glass renderers, shared framing. They sleep offscreen/at rest. */
.okto-lens{--okto-lens-reach:max(32%,128px);position:relative;aspect-ratio:1;width:100%;min-width:0;container-type:inline-size;overflow:visible;isolation:isolate;background:var(--okto-paper)}
.okto-lens :is(.clarity-lens-word,.brandpod-lens-word){position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;display:flex;align-items:baseline;white-space:nowrap;font-family:var(--okto-font);font-size:14.5cqw;font-weight:100;line-height:1;letter-spacing:-.05em;pointer-events:none;color:var(--okto-ink)}
.okto-lens .clarity-lens-word{filter:blur(calc((1 - var(--clarity-focus,0)) * max(7px,2.1cqw)))}
.okto-lens :is(.clarity-lens-word,.brandpod-lens-word)>strong{font-weight:800;background:var(--okto-context-gradient);background-clip:text;-webkit-background-clip:text;color:transparent}
.okto-lens :is(canvas,.clarity-lens-fallback,.brandpod-lens-fallback){position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.okto-lens canvas{z-index:2}
/* The lens canvas reaches past its square, so the cursor droplet never meets an
   edge near the lens: it joins and leaves in one continuous motion. */
.okto-lens.okto-lens>canvas:is(.clarity-lens-canvas,.brandpod-lens-canvas){left:calc(-1 * var(--okto-lens-reach));top:calc(-1 * var(--okto-lens-reach));width:calc(100% + 2 * var(--okto-lens-reach));height:calc(100% + 2 * var(--okto-lens-reach))}
/* Clip that reach at the screen's sides only; clip keeps the sticky lens working. */
:is(.home-clarity,.clarity-feature,.brandpod-feature),:is(section,main):has(.okto-lens){overflow-x:clip}
.okto-lens :is(.clarity-lens-fallback,.brandpod-lens-fallback){z-index:3;object-fit:contain}
.okto-lens[data-state=ready] :is(.clarity-lens-fallback,.brandpod-lens-fallback){visibility:hidden}
@media(max-width:1100px){:root{--okto-grid-gap:48px}.okto-type-chapter.okto-type-chapter,.okto-product-title.okto-product-title{font-size:clamp(42px,4.8vw,56px)}}
@media(max-width:800px){.okto-equal-columns{grid-template-columns:minmax(0,1fr);gap:40px}.okto-lens{max-width:640px;justify-self:center}}
@media(max-width:700px){
 :root{--okto-grid-gap:40px;--okto-chapter-space:96px;--okto-chapter-gap:40px}
 .okto-type-chapter.okto-type-chapter,.okto-product-title.okto-product-title{font-size:clamp(34px,8.72vw,44px);line-height:1.05}
 .okto-type-statement.okto-type-statement{font-size:32px;line-height:1.12}
 .okto-type-subsection.okto-type-subsection{font-size:25px;line-height:31px}
 .okto-type-body.okto-type-body{font-size:20px;line-height:29px}
 .okto-product-name.okto-product-name{font-size:clamp(52px,14.36vw,72px)}
 .okto-product-name--compact.okto-product-name--compact{font-size:48px}
 .okto-product-descriptor.okto-product-descriptor{font-size:20px;line-height:28px}
}
@media(prefers-reduced-motion:reduce){.okto-action.okto-action{transition:none}.okto-lens .clarity-lens-word{filter:none}}

/* Content hierarchy: large chapter messages, tangible outputs and one check.
   These opt-in roles grow with wide reading layouts; utility copy stays compact. */
.okto-copy-lead.okto-copy-lead{font-family:var(--okto-font);font-size:clamp(24px,1.35vw,32px);font-weight:200;line-height:1.38;letter-spacing:-.025em;max-width:44ch}
.okto-type-banner.okto-type-banner{font-family:var(--okto-font);font-size:clamp(64px,7.778vw,144px);line-height:.98;letter-spacing:-.045em;font-weight:700;text-transform:none;text-wrap:balance;margin:0}
.okto-gradient{background:var(--okto-context-gradient);background-clip:text;-webkit-background-clip:text;color:transparent}
.okto-check.okto-check{display:grid;place-items:center;flex:none;width:36px;height:36px;padding:1.5px;border:0;border-radius:50%;background:var(--okto-context-gradient);box-sizing:border-box}
.okto-check.okto-check>svg{display:block;box-sizing:border-box;width:33px;height:33px;padding:7px;border-radius:50%;background:var(--okto-paper);fill:none;stroke:var(--okto-ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.okto-deliverables{width:100%;min-width:0}
.okto-deliverables>h3{font-family:var(--okto-font);font-size:clamp(24px,2vw,36px);font-weight:700;line-height:1.12;letter-spacing:-.025em;margin:0 0 28px}
.okto-deliverables-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--okto-grid-gap);row-gap:0;list-style:none;margin:0;padding:0}
.okto-deliverable.okto-deliverable{display:grid;grid-template-columns:36px minmax(0,1fr);gap:20px;align-items:start;padding:28px 0 32px;border-top:1px solid var(--okto-line);min-width:0}
.okto-deliverable h4{font-family:var(--okto-font);font-size:clamp(26px,2vw,36px);font-weight:400;line-height:1.16;letter-spacing:-.03em;margin:0;text-wrap:balance;overflow-wrap:anywhere;hyphens:auto}
.okto-deliverable p{font-family:var(--okto-font);font-size:clamp(20px,1.1vw,26px);font-weight:200;line-height:1.38;letter-spacing:-.015em;margin:12px 0 0;max-width:40ch;color:var(--okto-ink)}
.okto-lens--value :is(.clarity-lens-word,.brandpod-lens-word){font-size:6.5cqw;font-weight:400;letter-spacing:-.025em;line-height:1.15;width:auto}
@media(min-width:1600px){.okto-deliverables--wide .okto-deliverables-grid{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:40px}}
@media(max-width:700px){
 .okto-copy-lead.okto-copy-lead{font-size:22px;line-height:1.35}
 .okto-type-banner.okto-type-banner{font-size:clamp(38px,10.5vw,72px);line-height:1.02;letter-spacing:-.04em;overflow-wrap:break-word}
 .okto-check.okto-check{width:32px;height:32px}.okto-check.okto-check>svg{width:29px;height:29px;padding:6px}
 .okto-deliverables-grid{grid-template-columns:minmax(0,1fr)}
 .okto-deliverables>h3{font-size:25px;margin-bottom:24px}
 .okto-deliverable.okto-deliverable{grid-template-columns:32px minmax(0,1fr);gap:16px;padding:24px 0}
 .okto-deliverable h4{font-size:25px;line-height:1.2}.okto-deliverable p{font-size:20px;line-height:1.4;margin-top:8px}
}


/* Layout spacing pass: wider page edges, calmer section rhythm and secondary text sized like boost.oktopods.com. */
:root{--pad:clamp(32px,calc(13.77vw - 70px),160px);--okto-edge:var(--pad);--okto-chapter-gap:clamp(56px,8svh,104px)}
.intro.section-pad,.services.section-pad,.connection.section-pad,.brandpod.section-pad,.contact.section-pad{padding-left:var(--pad);padding-right:var(--pad)}
.offering-page .offering-intro{padding-left:var(--pad);padding-right:var(--pad)}
.heart-index{max-width:calc(100% - 2 * var(--pad))}
.okto-type-supporting.okto-type-supporting{font-size:16px;line-height:26px}
.okto-type-caption.okto-type-caption,.home-product-footer .home-clarity-scope.okto-type-caption{font-size:16px;line-height:24px}
.ado-content li p{font-size:16px;line-height:24px}
/* Checklist descriptions share one size under their large titles. */
.offering-main .engagement-item-body.okto-type-supporting,.okto-deliverable.okto-deliverable p{font-size:20px;line-height:28px}
/* Heart heroes and handoffs start on the page edge like every other section. */
.arrival-content{padding-inline:0}
@media(min-width:801px){
 /* Engagement: the review points sit side by side under the message instead of leaving an empty column. */
 .engagement-grid{grid-template-columns:minmax(0,1fr);gap:40px}
 .engagement-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));column-gap:var(--heart-gutter);border-top:0}
 .engagement-item{border-top:1px solid #181b182e;border-bottom:0}
 .engagement-item-title{hyphens:auto;overflow-wrap:break-word}
 /* POD features: one block. The lens stays in view while the copy, deliverables and action scroll beside it. */
 .offering-page :is(.clarity-feature,.brandpod-feature){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--heart-gutter);row-gap:56px;align-items:start}
 :is(.clarity-feature-main,.brandpod-feature-main){display:contents}
 :is(.clarity-feature-copy,.brandpod-feature-copy){grid-column:1;grid-row:1}
 :is(.clarity-feature,.brandpod-feature) .okto-lens{grid-column:2;grid-row:1/span 3;position:sticky;top:calc(var(--heart-primary-height) + var(--heart-index-height) + 32px);width:min(100%,calc(100svh - var(--heart-primary-height) - var(--heart-index-height) - 64px));justify-self:end}
 :is(.clarity-feature-output-band,.brandpod-feature-output-band){grid-column:1;grid-row:2}
 :is(.clarity-feature,.brandpod-feature) .okto-deliverables-grid{grid-template-columns:minmax(0,1fr)}
 :is(.clarity-feature,.brandpod-feature) .product-feature-footer{grid-column:1;grid-row:3;flex-direction:column;align-items:flex-start;gap:24px}
}
/* One headline scale. Display (the POD wordmark size) opens a section; Heading and Subheading sit below it. */
@media(min-width:701px){
 :root{--okto-chapter-space:clamp(160px,19.5svh,240px);--okto-display:clamp(56px,7.778vw,112px);--okto-subheading:clamp(36px,3.9vw,56px)}
 .home-offerings .services-intro h2,.connection.section-pad>h2,.offering-page .engagement-heading.okto-type-banner{font-size:var(--okto-display);line-height:.96}
 .okto-product-name--teaser.okto-product-name--teaser,.home-product-identity .okto-product-name.okto-product-name{font-size:clamp(72px,7.778vw,112px)}
 :is(.home-clarity-copy,.brandpod-copy,.clarity-feature-copy,.brandpod-feature-copy) .okto-product-title.okto-product-title{font-size:var(--okto-subheading);line-height:1.06}
 .contact.section-pad .contact-heading h2{font-size:clamp(45.6px,4.8vw,72px)}
}
/* Every homepage section uses the same chapter spacing as the heart pages. */
.home-offerings.services.section-pad,.home-testimonials.home-testimonials,.connection.section-pad,.contact.section-pad{padding-top:var(--okto-chapter-space);padding-bottom:var(--okto-chapter-space)}
@media(max-width:700px){
 :root{--pad:24px;--okto-chapter-space:120px;--okto-chapter-gap:48px}
 .offering-main .engagement-item-body.okto-type-supporting,.okto-deliverable.okto-deliverable p{font-size:18px;line-height:26px}
}

/* Product inscriptions: two measured lines, painted through the glass.
   Font sizes belong to the bubble's container, not the viewport. */
.okto-lens--value .pod-inscription.pod-inscription,
.brandpod-visual .brandpod-glass-word.pod-inscription{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 width:max-content;max-width:none;gap:.35cqw;margin:0;
 font-family:var(--okto-font);line-height:.94;letter-spacing:-.055em;
 text-align:center;white-space:nowrap;color:var(--okto-ink);
}
.pod-inscription.pod-inscription>span{display:block;flex:none;line-height:.94;letter-spacing:-.055em;white-space:nowrap}
.pod-inscription--clarity .pod-inscription-lead{font-size:16cqw;font-weight:100}
.pod-inscription--clarity .pod-inscription-outcome{font-size:11.5cqw;font-weight:700}
.pod-inscription--brandpod .pod-inscription-lead{font-size:11.5cqw;font-weight:200}
.pod-inscription--brandpod .pod-inscription-outcome{font-size:12.5cqw;font-weight:700}
:lang(de) .pod-inscription--clarity .pod-inscription-outcome{font-size:9cqw}
:lang(de) .pod-inscription--brandpod .pod-inscription-lead{font-size:10.3cqw}

/* Compact dialog typography: one utility composition on every site. */
#cookie-dialog[data-okto-system]{box-sizing:border-box;width:calc(100% - 40px);max-width:560px;max-height:calc(100svh - 40px);overflow:auto;margin:auto;padding:48px 40px 40px;border:0;border-radius:0;background:var(--okto-paper);color:var(--okto-ink);font-family:var(--okto-font)}
#cookie-dialog[data-okto-system] h2{font-family:var(--okto-font);font-size:36px;line-height:42px;font-weight:700;letter-spacing:-.035em;text-transform:none;margin:0 0 24px}
#cookie-dialog[data-okto-system] p{font-family:var(--okto-font);font-size:20px;line-height:29px;font-weight:200;letter-spacing:-.02em;margin:0 0 24px}
#cookie-dialog[data-okto-system]::backdrop{background:#181b1888}
#cookie-dialog[data-okto-system] .dialog-close{position:absolute;top:8px;right:8px}
#cookie-dialog[data-okto-system] form{display:flex;flex-direction:column;align-items:flex-start}
#cookie-dialog[data-okto-system] .okto-text-action{max-width:100%;white-space:normal}
#cookie-dialog[data-okto-system] .dialog-done{margin-top:24px}
#cookie-dialog[data-okto-system] :is(.okto-action,.okto-text-action,.okto-control):focus-visible{outline:2px solid var(--okto-focus);outline-offset:4px;box-shadow:0 0 0 4px var(--okto-focus-gap)}
@media(max-width:700px){#cookie-dialog[data-okto-system]{padding:48px 24px 24px}#cookie-dialog[data-okto-system] h2{font-size:25px;line-height:31px}}

/* /case-system.css */
/* Shared editorial system for all 17 original case compositions.
   Media dimensions, grids, overlaps, sources and source order are untouched.
   Surface decisions follow each case's transparent artwork; five stay dark. */
:root:has([data-okto-surface="white"]) { background-color: #fff !important; color-scheme: light; }
body:has([data-okto-surface="white"]),
body:has([data-okto-surface="white"]) :is(#__next, #smooth-wrapper, #smooth-content, main) { background-color: #fff; }
[data-okto-case][data-okto-case] {
  --case-ink: #f7f7f7;
  --case-muted: #b9bcb8;
  font-family: var(--okto-font);
  color: var(--case-ink);
}
[data-okto-case][data-okto-surface="white"] { --case-ink: #181b18; --case-muted: var(--okto-muted, #62665f); background: #fff; }
[data-okto-case][data-okto-case] :is(.h3-cap,.h5-locator,.h4-primary-bold,.h4-primary,.h2,.h4-ps,.p-ps,p) { font-family: var(--okto-font); color: var(--case-ink); }
[data-okto-case="pirate-ship-fun-shipping"] :is(.case-ps,.bg-ps,.bg-ps-b,.bg-ps-bl,.ps-case_PSBackgroundAWrapper__dbdrh,.ps-case_PSBackgroundBWrapper__tl3Go) { background-color:#fff; }
/* The title and discipline label share a text column; image wrappers stay intact. */
[data-okto-case][data-okto-case] .container > div > div:has(> .h3-cap) {
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}
[data-okto-case][data-okto-case] .h3-cap {
  width: 100%;
  font-size: clamp(44px, 4.45vw, 64px);
  font-weight: 700;
  line-height: .96;
  letter-spacing: -.045em;
  text-transform: none;
}
/* Use each heading's authored casing in both languages. Never lowercase the
   source: project names, acronyms and German nouns retain their spelling.
   Locator labels and image/SVG artwork remain outside this headline role. */
[data-okto-case][data-okto-case] :is(.h2,.h4-ps,h2.h4-primary-bold,h1.title,h2.title,h3.title,h4.title) {
  text-transform: none;
}
[data-okto-case][data-okto-case] .h5-locator {
  width: 100%;
  font-size: var(--type-label, 14px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .14em;
  text-transform: uppercase;
  opacity: 1;
  color: var(--case-muted);
}
/* Case lead: Body role (the five-role system retired the separate lead size). */
[data-okto-case][data-okto-case] p.h4-primary-bold {
  font-size: var(--type-body, 22px);
  font-weight: var(--type-light, 200);
  line-height: 1.45;
  letter-spacing: -.01em;
  max-width: 27ch;
}

/* Statement / Title / Body roles: the same tokens as every other page (assets/okto-system.css). */
[data-okto-case][data-okto-case] .h2 {
  font-size: var(--type-statement, 48px);
  font-weight: var(--type-light, 200);
  line-height: 1.12;
  letter-spacing: -.03em;
  max-width: 29ch;
  text-wrap: balance;
}
[data-okto-case][data-okto-case] :is(.h4-ps, h2.h4-primary-bold) {
  font-size: var(--type-title, 32px);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.025em;
  text-wrap: balance;
}
[data-okto-case][data-okto-case] .h4-ps:has(+ .p-ps) {
  margin-bottom: 24px;
}
[data-okto-case][data-okto-case] .p-ps,
[data-okto-case][data-okto-case] ul.h4-primary {
  font-size: var(--type-body, 22px);
  font-weight: var(--type-light, 200);
  line-height: 1.45;
  letter-spacing: -.01em;
  max-width: 58ch;
  opacity: 1;
}
[data-okto-case][data-okto-case] .p-ps span {
  opacity: 1;
  color: var(--case-muted);
}
[data-okto-case][data-okto-case] .bg-ps-b .h4-ps {
  font-size: var(--type-statement, 48px);
  font-weight: var(--type-light, 200);
  line-height: 1.12;
  letter-spacing: -.03em;
}

/* Identical paths, dimensions and viewBoxes; only white marks become Ink.
   Original src/alt/order remain owned by React, including dynamic arrivals. */
[data-okto-case][data-okto-case] img[src$="ps-img-3.2edc7184.svg"] { content: url('/assets/case-details/ps-img-3-paper.svg'); }
[data-okto-case][data-okto-case] img[src$="ps-img-6.404fa442.svg"] { content: url('/assets/case-details/ps-img-6-paper.svg'); }
[data-okto-case][data-okto-case] img[src$="ps-img-13.svg"] { content: url('/assets/case-details/ps-img-13-paper.svg?v=2'); }
[data-okto-case][data-okto-case] img[src$="ps-img-14.svg"] { content: url('/assets/case-details/ps-img-14-paper.svg?v=2'); }

@media (max-width: 767px) {
  [data-okto-case][data-okto-case] .h3-cap { font-size: clamp(44px, 11vw, 72px); line-height: 1.02; }
  [data-okto-case][data-okto-case] .container > div > div:has(> .h3-cap) { gap: 20px; }
  /* Statement, Title and Body scale down through their tokens. */
}


/* Long institutional name needs a compact display role in its original column. */
[data-okto-case="adg"][data-okto-case] .h3-cap { font-size:clamp(28px,2.65vw,40px); line-height:1.06; overflow-wrap:anywhere; }
[data-okto-case="pirate-ship-fun-shipping"][data-okto-case] .h3-cap { font-size:clamp(44px,7.778vw,112px); }
[data-okto-case][data-okto-case]  :is(h4,div).h4-primary { font-size:var(--type-body,22px); font-weight:var(--type-light,200); line-height:1.45; letter-spacing:-.01em; }
[data-okto-case][data-okto-case] p:not([class]) { font-size:var(--type-body,22px); line-height:1.45; font-weight:var(--type-light,200); letter-spacing:-.01em; }
[data-okto-case="ado-reborn"] svg:not(.logo-horizontal) .SVG_fill { fill:var(--case-ink); }
[data-okto-case="ado-reborn"] [class*="Block_Logos_B"] { color:var(--case-muted); }

/* The original Fader owns each media surface. Match the homepage cadence
   without adding a second transform, changing crops or clipping overlaps. */
[data-okto-case][data-okto-case] .Fader_Fader__koW22 { --FaderTranlation:32px; }
[data-okto-case][data-okto-case] .Fader_ShortVersion__zvEMp { --FaderTranlation:16px; }
[data-okto-case][data-okto-case] .Fader_EffectTarget__jFidD { transition:transform 1.1s cubic-bezier(.22,1,.36,1),opacity .8s cubic-bezier(.22,1,.36,1); }
[data-okto-case][data-okto-case] .Fader_Fader__koW22:not(.fade-up-in) > .Fader_EffectTarget__jFidD { opacity:0; }
[data-case-hold] { opacity:0; }
@media(prefers-reduced-motion:reduce) {
 [data-okto-case][data-okto-case] .Fader_EffectTarget__jFidD { transition:none;transform:none;opacity:1!important; }
 [data-case-hold] { opacity:1; }
}
@media(max-width:767px) {
}
/* Lead sizing follows the canonical role, including its 700px breakpoint. */
@media(max-width:700px) {
}
@media print { [data-case-hold],[data-okto-case] .Fader_EffectTarget__jFidD { opacity:1!important;transform:none!important; } }

[data-okto-case][data-okto-case] .Fader_Fader__koW22:focus-within > .Fader_EffectTarget__jFidD { opacity:1!important;transform:none;transition:none; }

/* Retired agency marks (SPARK, CORE, REAL, LINK, FOCUS): remove the complete
   strip, including its margins. Unrelated case captions and artwork are untouched. */
[data-okto-case] [data-case-agency],
[data-okto-case] [data-case-obsolete-agencies] { display:none!important; }

/* Approved spacing audit, 31 October: only empty/text/scope spacing changes.
   Native media geometry and media-only clearances remain authored. */
[data-okto-case][data-okto-case] .container > div > div:has(> .h3-cap) > .h3-cap + div:empty,
[data-okto-case][data-okto-case] .container > div > div:has(> .h3-cap) > .h5-locator:empty,
[data-okto-case][data-okto-case] [data-case-empty-copy] { display:none; }
[data-okto-case][data-okto-case] [data-case-gap="0"] { height:0; }
[data-okto-case][data-okto-case] [data-case-gap="64"] { height:64px; }
[data-okto-case][data-okto-case] [data-case-gap="80"] { height:80px; }
[data-okto-case][data-okto-case] [data-case-gap="112"] { height:112px; }
@media(min-width:768px) {
  [data-okto-case][data-okto-case] [data-case-scope-copy] { padding-block:48px; }
  [data-okto-case="routewise-smart-logistics"][data-okto-case] .container.gap-48 { gap:64px; }
}
@media(max-width:767px) {
  [data-okto-case][data-okto-case] [data-case-scope-grid] { gap:64px; }
  [data-okto-case][data-okto-case] [data-case-empty-scope-grid] { gap:0; }
  [data-okto-case][data-okto-case] [data-case-empty-scope-column] { display:none; }
  [data-okto-case][data-okto-case] .container > .flex > .md\:w-1\/12:empty { display:none; }
  [data-okto-case][data-okto-case] .container > .flex > div:has(> .h3-cap:empty):has(> .h5-locator:empty) { display:none; }
  /* The original sm:h-0 starts at 375px; hide at 320px as well. */
  [data-okto-case][data-okto-case] :is(.h-28,.h-56).sm\:h-0 { height:0; }
  [data-okto-case][data-okto-case] .h4-primary.py-20,
  [data-okto-case][data-okto-case] .py-20:has(> p:not(.hidden)) { padding-block:40px; }
  [data-okto-case="violife-join-the-good-life"][data-okto-case] .pt-20:has(> p),
  [data-okto-case="adg"][data-okto-case] .pt-20:has(ul.h4-primary) { padding-top:48px; }
  [data-okto-case="routewise-smart-logistics"][data-okto-case] .container.gap-48 { gap:40px; }
  [data-okto-case="ado-virtual-journey"][data-okto-case] .Block_0_01_D_Content3Wrapper__nfbKo { gap:40px; }
  [data-okto-case="ado-virtual-journey"][data-okto-case] .Block_0_01_D_Content3Wrapper__nfbKo > .h4-primary { margin-top:0; }
  [data-okto-case="ado-reborn"][data-okto-case] .Block_Logos_B_ContentWrapper__r2W_4 { padding-block:64px; }
}

/* Native next-case titles sit outside the tagged editorial content. Keep the
   same authored casing through the incoming/outgoing photographic handoff. */
.case-original [class*="MobileParallaxTeaser_Title__"] { text-transform: none; }

/* /assets/okto-motion.css */
/* Shared scroll motion (assets/okto-motion.js). Hold states only apply while
   the script runs, so content never depends on it. */
.okto-motion .okto-hold-block,.okto-motion .okto-hold-lines,.okto-motion .okto-hold-list .okto-lead,.okto-motion .okto-hold-list .okto-row>*{opacity:0}
.okto-motion .okto-hold-list .okto-row{border-color:transparent!important;border-image-source:none!important}
.okto-motion .okto-hold-image{clip-path:inset(100% 0 0 0)}

/* Headline lines rise inside their own mask. */
.okto-line{display:block;clip-path:inset(-0.3em -0.6em -0.14em -0.6em)}
.okto-line-inner{display:block;white-space:nowrap;will-change:transform}

/* List dividers draw from the left before their row arrives. */
.okto-rule{position:absolute;left:0;right:0;transform-origin:left center;pointer-events:none}

/* Buttons: the label rolls up to a copy of itself and the arrow leans toward its direction. */
.okto-roll{position:relative;display:inline-block;overflow:hidden;vertical-align:top}
.okto-roll-text{display:inline-block}
.okto-roll::after{content:attr(data-label);content:attr(data-label) / "";position:absolute;left:0;top:100%;white-space:nowrap}
.okto-roll-text,.okto-roll::after,.okto-action .button-arrow{transition:transform .36s cubic-bezier(.22,1,.36,1)}
.okto-action:is(:hover,:focus-visible) .okto-roll-text,.okto-action:hover .okto-roll::after,.okto-action:focus-visible .okto-roll::after{transform:translateY(-100%)}
.okto-action:is(:hover,:focus-visible) .button-arrow[data-dir=ne]{transform:translate(3px,-3px)}
.okto-action:is(:hover,:focus-visible) .button-arrow[data-dir=e]{transform:translateX(4px)}
.okto-action:is(:hover,:focus-visible) .button-arrow[data-dir=s]{transform:translateY(3px)}

@media(prefers-reduced-motion:reduce){
 .okto-roll-text,.okto-roll::after,.okto-action .button-arrow{transition:none}
 .okto-action:is(:hover,:focus-visible) :is(.okto-roll-text,.button-arrow),.okto-action:hover .okto-roll::after,.okto-action:focus-visible .okto-roll::after{transform:none}
}
:is(.motion-paused,.bp-motion-paused) :is(.okto-roll-text,.button-arrow),:is(.motion-paused,.bp-motion-paused) .okto-roll::after{transition:none}
@media print{
 .okto-motion :is(.okto-hold-block,.okto-hold-lines,.okto-hold-list .okto-lead,.okto-hold-list .okto-row>*){opacity:1!important}
 .okto-motion .okto-hold-image{clip-path:none!important}
}

/* /case-shell.css */
/* Current approved shell only. Original case CSS owns everything inside #__next.
   Load the unchanged menu.css after this file. */
@font-face{font-family:Lausanne;src:url('/assets/lausanne-light.woff2') format('woff2');font-weight:200 500;font-display:swap}
@font-face{font-family:Lausanne;src:url('/assets/lausanne-bold.woff2') format('woff2');font-weight:600 900;font-display:swap}

/* --pad matches the shared side margin in assets/okto-system.css (24px at 700px and below). */
.site-header,.menu-panel,#cookie-dialog{--paper:#f8f8f8;--ink:#181b18;--lime:#c3e660;--muted:#62665f;--line:#d9dcd5;--pad:clamp(32px,calc(13.77vw - 70px),160px);font-family:Lausanne,Arial,sans-serif;font-size:16px;font-weight:300;font-style:normal;line-height:normal;letter-spacing:normal;text-transform:none;-webkit-font-smoothing:antialiased;color-scheme:light}
:where(.site-header,.menu-panel,#cookie-dialog),:where(.site-header,.menu-panel,#cookie-dialog) *{box-sizing:border-box}
:where(.site-header,.menu-panel,#cookie-dialog) a{color:inherit;text-decoration:none}
:where(.site-header,.menu-panel,#cookie-dialog) button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}
:where(.site-header,.menu-panel,#cookie-dialog) :is(h1,h2,h3,h4,p){margin:0}
:where(.site-header,.menu-panel,#cookie-dialog) img{display:block;width:100%;height:auto}
:where(.site-header,.menu-panel,#cookie-dialog) :is(button,a){-webkit-tap-highlight-color:transparent}
:where(.site-header,.menu-panel,#cookie-dialog) ::selection{background:var(--lime);color:var(--ink)}
:where(.site-header,.menu-panel,#cookie-dialog) :focus-visible{outline:2px solid #83ab42;outline-offset:6px}

/* Header and legacy menu base, extracted from style.css in their original order. */
.site-header{position:fixed;inset:0 0 auto;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;height:64px;padding:0 var(--pad);color:var(--paper);transition:background .25s,color .25s}
.site-header .header-actions{display:contents}
.site-header .brand{width:35px;padding:12px 0}
.site-header .dotmark{display:grid;grid-template-columns:repeat(4,4px);gap:3px}
.site-header .dotmark i{display:block;width:4px;height:4px;background:currentColor;border-radius:50%}
.site-header .language-toggle{justify-self:start;font-size:14px;min-width:28px;padding:10px 0}
.site-header .talk-link{justify-self:end;text-transform:uppercase;font-size:14px;letter-spacing:.02em}
.site-header .talk-link>span{display:none}
.site-header .menu-toggle{justify-self:end;border:1px solid currentColor;border-radius:100px;font-size:13px;padding:9px 16px;min-width:78px}
.past-hero .site-header{color:var(--ink);background:rgba(248,248,248,.93);backdrop-filter:blur(12px)}
.menu-open .site-header{color:var(--ink);background:transparent}
.menu-panel{position:fixed;inset:0;z-index:25;background:var(--paper);padding:125px max(var(--pad),5vw) 40px;overflow:auto}
.menu-panel[hidden]{display:none}
.menu-panel nav{max-width:1050px}
.menu-panel nav a{display:flex;align-items:baseline;gap:35px;font-size:clamp(46px,7vw,96px);line-height:1.5;border-bottom:1px solid var(--line)}
.menu-panel nav small{font-size:13px}
.menu-panel nav a>span{margin-left:auto;font-size:.65em}
.menu-panel .menu-email{display:block;font-size:22px;margin-top:45px}

/* The menu's existing native dialog, scoped so original project dialogs are untouched. */
#cookie-dialog{margin:auto;max-width:420px;width:calc(100% - 40px);border:0;background:var(--paper);color:var(--ink);padding:35px}
#cookie-dialog::backdrop{background:#181b1888}
#cookie-dialog h2{font-size:30px;font-weight:300;margin-bottom:20px}
#cookie-dialog p{line-height:1.5;margin-bottom:25px}
#cookie-dialog a:not(.okto-text-action){font-size:13px;text-decoration:underline}
#cookie-dialog .dialog-close{position:absolute;right:12px;top:8px}
#cookie-dialog .dialog-close:not(.okto-control){font-size:25px}
#cookie-dialog .dialog-done{margin-top:25px}
#cookie-dialog .dialog-done:not(.okto-action){display:block;padding:12px 25px;background:var(--lime)}

@media(max-width:700px){
 .site-header,.menu-panel,#cookie-dialog{--pad:24px}
 .site-header{height:60px;grid-template-columns:repeat(4,1fr)}
 .site-header .talk-link{font-size:10px;white-space:nowrap}
 .site-header .language-toggle{font-size:12px}
 .site-header .menu-toggle{font-size:10px;padding:7px 12px;min-width:62px}
 .site-header .dotmark{gap:2px;grid-template-columns:repeat(4,3px)}
 .site-header .dotmark i{width:3px;height:3px}
 .menu-panel{padding-top:100px}
 .menu-panel nav a{font-size:52px;gap:20px}
 .menu-panel .menu-email{font-size:19px}
}
@media(prefers-reduced-motion:reduce){
 .site-header,.site-header *,.menu-panel,.menu-panel *,#cookie-dialog,#cookie-dialog *{transition:none!important}
}
/* Later approved header refinements from style.css lines 18–19. */
.site-header .dotmark{grid-template-columns:repeat(8,7px);gap:5px}
.site-header .dotmark i{width:7px;height:7px}
.site-header .brand{width:100px}
.site-header .menu-toggle{border-radius:0}
@media(max-width:700px){
 .site-header .dotmark{grid-template-columns:repeat(8,4px);gap:3px}
 .site-header .dotmark i{width:4px;height:4px}
 .site-header .brand{width:56px}
}
/* Place the original fixed scroll canvas below the approved site shell. */
#__next{position:relative;z-index:0;isolation:isolate}

/* /menu.css */
/* Open menu, translated from the approved Figma layout. Header styles are owned by style.css. */

/* Opening the menu locks page scroll. Keep the scrollbar's space reserved so the
   page never widens and the fixed header (logo, Menu/Close) stays exactly put. */
html { scrollbar-gutter: stable; }
@font-face {
  font-family: "Lausanne Menu";
  src: url("/assets/menu-lausanne-400.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

#menu.site-menu {
  --menu-header-height: 64px;
  position: fixed;
  inset: 0;
  z-index: 25;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: var(--paper, #f8f8f8);
  color: var(--ink, #181b18);
  font-family: "Lausanne Menu", Lausanne, Arial, sans-serif;
  font-weight: 400;
  -webkit-overflow-scrolling: touch;
}

#menu.site-menu[hidden] { display: none; }
#menu.site-menu::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: var(--menu-header-height);
  z-index: 1;
  background: var(--paper, #f8f8f8);
  pointer-events: none;
}

#menu .site-menu-body {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 64px;
  /* Same side edges as the header: rows line up with the logo and Menu/Close. */
  padding: calc(var(--menu-header-height) + 96px) var(--pad, 16px) 32px;
}

#menu .site-menu-primary { width: 100%; max-width: none; }
#menu .site-menu-columns,
#menu .site-menu-secondary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 96px;
}
#menu .site-menu-group { min-width: 0; }
#menu .site-menu-label {
  margin: 0 0 24px;
  color: var(--muted, #62665f);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 2.24px;
}
#menu .site-menu-list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  margin: 0;
  padding: 0;
  list-style: none;
}
#menu .site-menu-list > li { min-width: 0; }
#menu .menu-entry {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  width: 100%;
  padding: 8px 0;
  border: 0;
  font-size: 44px;
  line-height: 52px;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
  scroll-margin-top: calc(var(--menu-header-height) + 16px);
}
#menu .menu-entry .menu-entry-title {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}
#menu .menu-entry-heading { display:flex; align-items:center; gap:8px; width:100%; font-size:inherit; line-height:inherit; letter-spacing:inherit; }
#menu .menu-entry-heading .menu-entry-title { flex:1; min-width:0; }
#menu .menu-entry-external { display:block; flex:none; width:30px; height:30px; }
#menu .menu-entry-external img { display:block; width:30px; height:30px; }
#menu .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#menu .menu-entry > .menu-entry-promise {
  margin: 0;
  color: var(--muted, #62665f);
  font-size: 17px;
  line-height: 24px;
  letter-spacing: 0;
}
#menu .menu-entry:hover .menu-entry-title {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .14em;
}
#menu .site-menu-lower { margin-top: 64px; }
#menu .site-menu-rule {
  height: 1px;
  margin-bottom: 24px;
  background: linear-gradient(90deg, #ffd400 0%, #ffd400 12%, #c8e82e 30%, #3fe07a 52%, #00e5ff 66%, #00e5ff 100%);
}

#menu .site-menu-utilities { width: 100%; }
#menu .site-menu-contact-row,
#menu .site-menu-legal-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
#menu .site-menu-email { font-size: 28px; line-height: 1.2; }
#menu .site-menu-social,
#menu .site-menu-legal {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 24px;
}
#menu .site-menu-utilities a,
#menu .site-menu-utilities button { scroll-margin-top: calc(var(--menu-header-height) + 16px); }
#menu .site-menu-social,
#menu .site-menu-legal-row {
  color: var(--muted, #62665f);
  font-size: 14px;
  line-height: 1.2;
}
#menu .site-menu-legal-row {
  align-items: flex-start;
  border-top: 1px solid var(--line, #d9dcd5);
  margin-top: 8px;
  padding-top: 16px;
}
#menu .site-menu-utilities button { padding: 0; font: inherit; }
#menu .site-menu-utilities a:hover,
#menu .site-menu-utilities button:hover { text-decoration: underline; text-underline-offset: 3px; }
#menu .site-menu-location { white-space: nowrap; }

@media (min-width: 801px) and (max-width: 1199px) {
  #menu .menu-entry { font-size: 36px; line-height: 44px; }
}

@media (max-width: 800px) {
  #menu .site-menu-body { gap: 64px; padding-top: calc(var(--menu-header-height) + 24px); padding-bottom: 24px; }
  #menu .site-menu-columns { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  #menu .site-menu-label { margin-bottom: 16px; }
  #menu .site-menu-list { height: auto; }
  #menu .menu-entry { font-size: 28px; line-height: 36px; }
  #menu .menu-entry-external, #menu .menu-entry-external img { width:24px; height:24px; }
  #menu .menu-entry > .menu-entry-promise { font-size: 16px; line-height: 22px; }
  #menu .site-menu-lower { margin-top: 32px; }
  #menu .site-menu-rule { margin-bottom: 16px; }
  #menu .site-menu-secondary { gap: 32px; }
  #menu .site-menu-contact-row { flex-direction: column; align-items: flex-start; gap: 16px; }
  #menu .site-menu-email { font-size: 20px; }
  #menu .site-menu-social,
  #menu .site-menu-legal { gap: 8px 16px; }
  #menu .site-menu-legal-row { padding-top: 8px; }
  #menu .site-menu-location { display: none; }
}

@media (max-width: 700px) {
  #menu.site-menu { --menu-header-height: 60px; }
}

/* /type-system.css */
/* One type system: seven roles, nothing in between. 6 November 2026.
   Sizes live as tokens in assets/okto-system.css (--type-*); this sheet maps
   page classes onto them and is loaded last. It sets family, size, weight,
   line height and colour only — never layout.

   Display    112 caps, 700  section banners (unchanged compositions keep theirs)
   Chapter     72, 700       chapter headings, contact and legal titles
   Statement   48, light     intro statements, product promises, case names in heart pages
   Title       32, 700       item titles: services, cases, deliverables, subsections
   Body        22, light     all running text, always ink (incl. .okto-type-supporting)
   Supporting  16, 400       captions, hints, footer, small links (matches boost.oktopods.com)
   Label       14 caps, 400  eyebrows, numbers, client names — muted

   "Light" is --type-light (200): Lausanne ships no 300, so 300 always rendered
   as 200. Declaring 200 changes nothing on screen; it makes the rule honest.
   Every role sets font-family, because the same Lausanne files are loaded
   under four family names and the "Lausanne" family maps 400 to its 200 file. */

/* ── Home ──────────────────────────────────────────────────────────────── */

/* Statement */
html body :is(.intro.section-pad > h2, .home-clarity .okto-product-title) {
  font-family: var(--okto-font); font-size: var(--type-statement); font-weight: var(--type-light); line-height: 1.12; letter-spacing: -.03em;
}

/* Title */
html body :is(
  .services .service-copy > h3,
  .ado-content > h3,
  .ado-proof-title,
  .home-clarity .okto-lead
) {
  font-family: var(--okto-font); font-size: var(--type-title); font-weight: 700; line-height: 1.15; letter-spacing: -.025em; text-transform: none;
}

/* Body */
html body :is(
  .work .project-description,
  .services-intro > p,
  .services .service-delivery,
  .services-engagement,
  .ado-lead,
  .ado-content li p,
  .home-clarity .okto-product-descriptor,
  .home-clarity .okto-copy-lead,
  .home-clarity .okto-deliverable p,
  .home-clarity .home-clarity-scope,
  .contact-bottom > p,
  .contact-email
) {
  font-family: var(--okto-font); font-size: var(--type-body); font-weight: var(--type-light); line-height: 1.45; letter-spacing: -.01em; color: var(--okto-ink, #181b18);
}

/* Label */
html body :is(
  .section-label,
  .work .project-disciplines,
  .services .service-number,
  .ado-story ol > li > span:first-child,
  .home-clarity-eyebrow
) {
  font-family: var(--okto-font); font-size: var(--type-label); font-weight: 400; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase;
  color: var(--okto-muted, #62665f);
}

/* Names inside a list read as body text set in bold, so tight grids never hyphenate. */
html body .home-clarity .okto-deliverable h4 {
  font-family: var(--okto-font); font-size: var(--type-body); font-weight: 700; line-height: 1.3; letter-spacing: -.01em; hyphens: manual;
}
/* An eyebrow is one line. */
html body .home-clarity .home-clarity-eyebrow { max-width: none; width: max-content; white-space: nowrap; }

/* Case text sits on photographs and keeps its white. */
html body .work .project .project-description,
html body .work .project .project-disciplines { color: inherit; }

/* Product blocks: the shared system and scene styles set these with doubled
   classes, so the roles repeat that weight here. */
html body .home-clarity .okto-product-name.okto-product-name--teaser.okto-product-name--teaser { font-size: var(--type-product, clamp(64px, 7.778vw, 112px)); line-height: .95; }
html body .home-pod-scene .home-product-identity .okto-product-descriptor.okto-product-descriptor,
html body .home-pod-scene .home-product-footer .home-clarity-scope.okto-type-caption.okto-type-caption {
  font-family: var(--okto-font); font-size: var(--type-body); font-weight: var(--type-light); line-height: 1.45; letter-spacing: -.01em; color: var(--okto-ink, #181b18);
}

/* ── Other pages ─────────────────────────────────────────────────────────
   The shared content classes carry the roles; page classes fill the gaps.
   Text on ink or photographs keeps its own colour (see the last rule).
   Page styles here use deep selectors (and #about-main), so these roles add
   one ID step with :not(#type-roles), an ID no element carries. */

/* Chapter */
html body:not(#type-roles) :is(
  .okto-type-chapter.okto-type-chapter,
  .offering-heading,
  .journey-chapter,
  .journey-statement-copy > h3
) {
  font-family: var(--okto-font); font-size: var(--type-chapter); font-weight: 700; line-height: 1.02; letter-spacing: -.04em;
}

/* Statement */
html body:not(#type-roles) :is(
  .offering-lead,
  .clarity-feature-title,
  .brandpod-feature-title,
  .okto-product-title.okto-product-title,
  .offering-case-caption > h2
) {
  font-family: var(--okto-font); font-size: var(--type-statement); font-weight: var(--type-light); line-height: 1.12; letter-spacing: -.03em;
}

/* Title */
html body:not(#type-roles) :is(
  .okto-type-subsection.okto-type-subsection,
  .okto-lead.okto-lead,
  .about-brand-point-heading,
  .engagement-item-title,
  .case-caption :is(h2, h3),
  .journey-dna-cards h3,
  .journey-scope-result h3,
  .case-campaign .intro-heading
) {
  font-family: var(--okto-font); font-size: var(--type-title); font-weight: 700; line-height: 1.15; letter-spacing: -.025em; text-transform: none;
}

/* Body */
html body:not(#type-roles) :is(
  .okto-type-body.okto-type-body,
  .okto-copy-lead.okto-copy-lead,
  .okto-type-supporting.okto-type-supporting,
  .okto-product-descriptor.okto-product-descriptor,
  .about-brand-intro-copy,
  .about-brand-point-body,
  .about-heart-descriptor,
  .about-heart-copy,
  .about-brand-transformation-bottom,
  .SkillsRows_content__Eos_9 p,
  .engagement-item-body,
  .offering-body,
  .offering-email,
  .case-description,
  .okto-deliverable p,
  .bp-plain-list li,
  .bp-closing-line,
  .contact-intro,
  .home-clarity-scope.okto-type-caption,
  .brandpod-feature-scope.okto-type-caption,
  .journey-body,
  .journey-octopus-body p,
  .journey-dna-cards p,
  .journey-scope-result p,
  .journey-meet-actions a:not(.journey-talk),
  .case-campaign :is(.intro-paragraph, .campaign-tagline, .okto-row)
) {
  font-family: var(--okto-font); font-size: var(--type-body); font-weight: var(--type-light); line-height: 1.45; letter-spacing: -.01em; color: var(--okto-ink, #181b18);
}
/* Names inside lists: body size, bold. (Legal text reads the tokens in legal.css, which keeps its print sizes.) */
html body:not(#type-roles) .okto-deliverable h4.product-output-title {
  font-family: var(--okto-font); font-size: var(--type-body); font-weight: 700; line-height: 1.3; letter-spacing: -.01em;
}

/* Supporting — one size for everything secondary. */
html body:not(#type-roles) :is(
  .okto-type-caption.okto-type-caption:not(.home-clarity-scope, .brandpod-feature-scope),
  figcaption,
  .form-hint,
  .optional,
  .offering-case-link,
  .case-campaign :is(.result-caption, .services-list)
) {
  font-family: var(--okto-font); font-size: var(--type-supporting); font-weight: 400; line-height: 1.5; letter-spacing: 0;
}
html body:not(#type-roles) :is(figcaption, .okto-type-caption.okto-type-caption:not(.home-clarity-scope, .brandpod-feature-scope), .form-hint, .optional, .case-campaign .result-caption) {
  color: var(--okto-muted, #62665f);
}
/* Footer: one size, one weight, its own colour on ink. */
html body:not(#type-roles) .site-footer :is(.footer-meta span, .footer-links a, .footer-links .okto-control) {
  font-family: var(--okto-font); font-size: var(--type-supporting); font-weight: 400; line-height: 1.5;
}

/* Label */
html body:not(#type-roles) :is(
  .okto-type-label.okto-type-label,
  .about-brand-team-label,
  .case-client,
  .bp-hero-index,
  .bp-section-word,
  .journey-eyebrow,
  .journey-toggle span,
  .case-campaign .services-label
) {
  font-family: var(--okto-font); font-size: var(--type-label); font-weight: 400; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase;
  color: var(--okto-muted, #62665f);
}

/* Actions: one size and family for every button label. */
html body:not(#type-roles) :is(.okto-action .okto-roll-text, .handoff-link > span) {
  font-family: var(--okto-font); font-size: 16px; font-weight: 700; line-height: 1.25;
}

/* Ink sections and photographs keep their own text colour. */
/* Only the role classes above are recoloured, never gradient text
   (.heart-gradient and friends rely on color: transparent). */
html body:not(#type-roles) :is(.bp-section-ink, .offering-hero, .work .project, .journey-octopus, .site-footer) :is(
  .okto-type-body, .okto-copy-lead, .okto-type-supporting, .okto-product-descriptor,
  .offering-body, .offering-lead, .engagement-item-body, .case-description,
  .bp-plain-list li, .bp-closing-line, .okto-type-label, .case-client, .bp-hero-index, .bp-section-word,
  .journey-body, .journey-octopus-body p, .journey-eyebrow, .footer-meta span, .footer-links a, .footer-links .okto-control
) { color: inherit; }

/* /case-typography.css */
/* Case editorial typography — ADO reference, 11 November 2026.
   Sources: Alex's frame 1225:1401 and his subsequent header-weight 100 edit.
   Keep authored copy/casing, surfaces, media, grids and motion. Only editorial
   text roles opt in; original artwork, result figures and handoff scenes do not.
   Style 50 and style 100 are distinct original fonts, despite their unusual
   OS/2 weights. Separate family names prevent either from substituting for the other. */
@font-face {
  font-family: CaseLausanne100;
  src: url('/assets/system/fonts/lausanne-100.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: CaseLausanne50;
  src: url('/assets/ado-campaign/lausanne-50.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: CaseInter;
  src: url('/assets/ado-campaign/inter-200.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: CaseInter;
  src: url('/assets/ado-campaign/inter-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: CaseInter;
  src: url('/assets/ado-campaign/inter-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* The native ADO page keeps its precise text measures in its local sheet.
   Archived cases keep their original columns and use the same editorial roles. */
html body.case-original:not(#case-type-scope) [data-okto-case] .h3-cap:not(:has(svg,img,video,picture,canvas,iframe)) {
  font-family: var(--okto-font);
  font-size: clamp(44px, 5.416667vw, 78px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0;
  text-transform: none;
  /* The authored header has one empty column between title and introduction.
     The title can use that text-only space without moving either column. */
  width: calc(100% + 16.666667%);
  max-width: none;
  hyphens: manual;
  overflow-wrap: normal;
}
html body.case-original:not(#case-type-scope) [data-okto-case] .h5-locator {
  font-family: CaseInter, Inter, Arial, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
  /* Keep font swaps painted inside the native transformed scroll wrapper. */
  transform: translateZ(0);
}
/* ADO's services strip belongs immediately below the banner, before the
   original title/introduction columns. Only that opening spacer is replaced. */
html body.case-original:not(#case-type-scope) [data-okto-case] .h-28:empty:has(+ [data-case-intro]) {
  height: 0;
}
html body.case-original:not(#case-type-scope) [data-okto-case] [data-case-intro] {
  padding-top: 2.708333vw;
}
html body.case-original:not(#case-type-scope) [data-okto-case] [data-case-intro-grid] {
  margin-top: 6.111111vw;
}
html body.case-original:not(#case-type-scope) [data-okto-case] .case-services {
  width: 100%;
  max-width: 43.888889vw;
  transform: translateZ(0);
}
html body.case-original:not(#case-type-scope) [data-okto-case] .case-services :is(.services-label,.services-list) {
  font-family: CaseInter, Inter, Arial, sans-serif;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  margin: 0;
}
html body.case-original:not(#case-type-scope) [data-okto-case] .case-services .services-label {
  font-size: 14px;
  line-height: normal;
  color: var(--case-muted);
  margin-bottom: 5px;
}
html body.case-original:not(#case-type-scope) [data-okto-case] .case-services .services-list {
  font-size: 17px;
  line-height: 1.4;
  color: var(--case-ink);
  overflow-wrap: break-word;
}
html body.case-original:not(#case-type-scope) [data-okto-case] p.h4-primary-bold {
  font-family: CaseLausanne100, var(--okto-font);
  font-size: clamp(22px, 2.083333vw, 30px);
  font-weight: 100;
  line-height: 1.4;
  letter-spacing: 0;
  max-width: 100%;
}

/* Full editorial statements, including the custom statement modules. */
html body.case-original:not(#case-type-scope) [data-okto-case] :is(.h2,h4.h4-primary,div.h4-primary):not(:has(svg,img,video,picture,canvas,iframe)),
html body.case-original:not(#case-type-scope) [data-okto-case] div.h4-primary:not(:has(svg,img,video,picture,canvas,iframe)) p {
  font-family: CaseLausanne50, var(--okto-font);
  font-size: clamp(26px, 2.777778vw, 40px);
  font-weight: 100;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
  text-wrap: wrap;
  max-width: 100%;
  overflow-wrap: break-word;
}

/* Supporting prose in mixed artwork/text columns keeps a prose role. */
html body.case-original:not(#case-type-scope) [data-okto-case] .p-ps,
html body.case-original:not(#case-type-scope) [data-okto-case] p:not([class]):not(:where(button p,a p,[role="button"] p)) {
  font-family: CaseLausanne100, var(--okto-font);
  font-size: clamp(22px, 2.083333vw, 30px);
  font-weight: 100;
  line-height: 1.4;
  letter-spacing: 0;
  max-width: 100%;
  overflow-wrap: break-word;
}

/* ADO's Inter scope treatment, independent of narrative paragraphs. */
html body.case-original:not(#case-type-scope) [data-okto-case] :is(h2.h4-primary-bold,.h4-ps) {
  font-family: CaseInter, Inter, Arial, sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 42px;
  letter-spacing: -1.26px;
  text-transform: none;
  text-wrap: wrap;
}
html body.case-original:not(#case-type-scope) [data-okto-case] :is(ul.h4-primary,ul.h4-primary > li) {
  font-family: CaseInter, Inter, Arial, sans-serif;
  font-size: 21px;
  font-weight: 200;
  line-height: 38px;
  letter-spacing: -.42px;
  max-width: 100%;
}

/* This is a campaign-credit sentence, rather than a technical subheading. */
html body.case-original:not(#case-type-scope) [data-okto-case="pirate-ship-fun-shipping"] .bg-ps-b .h4-ps {
  font-family: CaseLausanne50, var(--okto-font);
  font-size: clamp(26px, 2.777778vw, 40px);
  font-weight: 100;
  line-height: 1.2;
  letter-spacing: 0;
}

/* Retain the existing compact fit for the unusually long institution name. */
html body.case-original:not(#case-type-scope) [data-okto-case="adg"] .h3-cap:not(:has(svg)) {
  font-size: clamp(28px, 2.777778vw, 40px);
  line-height: 1.2;
  overflow-wrap: break-word;
}

@media (max-width: 767px) {
  html body.case-original:not(#case-type-scope) [data-okto-case] [data-case-intro] {
    padding-top: 40px;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case] [data-case-intro-grid] {
    margin-top: 56px;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case] .case-services {
    max-width: none;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case] .h3-cap:not(:has(svg,img,video,picture,canvas,iframe)) {
    font-size: clamp(34px, 11.282051vw, 44px);
    line-height: 1.02;
    width: 100%;
    overflow-wrap: break-word;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case] :is(.h2,h4.h4-primary,div.h4-primary):not(:has(svg,img,video,picture,canvas,iframe)),
  html body.case-original:not(#case-type-scope) [data-okto-case] div.h4-primary:not(:has(svg,img,video,picture,canvas,iframe)) p {
    font-size: 24px;
    line-height: 1.3;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case] :is(h2.h4-primary-bold,.h4-ps) {
    font-size: 28px;
    line-height: 34px;
    letter-spacing: -.98px;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case="pirate-ship-fun-shipping"] .bg-ps-b .h4-ps {
    font-size: 24px;
    line-height: 1.3;
    letter-spacing: 0;
  }
  html body.case-original:not(#case-type-scope) [data-okto-case="adg"] .h3-cap:not(:has(svg)) {
    font-size: 28px;
    line-height: 1.2;
  }
}

/* /assets/pirateship-case/next-case.css */
/* Original case handoff composition, scoped to the Pirate Ship case. */
.pirate-case-next{position:relative;height:100svh;min-height:440px;overflow:hidden;isolation:isolate;background:#171918;color:#f8f8f8}
.pirate-case-next .pirate-next-visual{position:absolute;inset:0;overflow:hidden;opacity:var(--pirate-next-opacity,1)}
.pirate-case-next .pirate-next-image{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(var(--pirate-next-scale,1));transform-origin:center}
.pirate-case-next .pirate-next-caption{position:absolute;left:32px;right:32px;top:var(--pirate-next-caption-top,50%);transform:translateY(-50%);opacity:var(--pirate-next-opacity,1)}
.pirate-case-next .pirate-next-link{display:inline-flex;flex-direction:column;gap:3px;max-width:100%;color:inherit;text-decoration:none;text-align:left;font-family:Lausanne,Arial,sans-serif;font-weight:300;line-height:1.2;text-shadow:0 1px 14px #0008}
.pirate-case-next .pirate-next-label{font-size:16px}
.pirate-case-next .pirate-next-title{font-size:clamp(16px,2.5vw,36px);overflow-wrap:anywhere}
.pirate-case-next .pirate-next-link:focus-visible{outline:2px solid currentColor;outline-offset:10px}
.pirate-case-next .pirate-next-progress-track{height:3px;max-width:80vw;width:max-content;min-width:220px;margin-top:12px;overflow:hidden;border-radius:3px;background:#808080}
.pirate-case-next .pirate-next-progress{display:block;width:var(--case-next-progress,100%);height:100%;background:#f0f0f0}
@media(max-width:700px){.pirate-case-next{min-height:400px}.pirate-case-next .pirate-next-caption{left:24px;right:24px}.pirate-case-next .pirate-next-title{font-size:24px}.pirate-case-next .pirate-next-progress-track{min-width:min(280px,80vw)}}
@media(prefers-reduced-motion:reduce){.pirate-case-next .pirate-next-visual,.pirate-case-next .pirate-next-caption{opacity:1}.pirate-case-next .pirate-next-image{transform:none}.pirate-case-next .pirate-next-caption{top:50%}.pirate-case-next .pirate-next-progress{width:100%}}

/* /assets/pirateship-case/page.css */
.pirate-case .pa-1{background:#fff;position:relative;width:100%;height:100%;}
.pirate-case .pa-2{position:absolute;height:33.6111111cqw;left:74.6527778cqw;top:0cqw;width:34.3055556cqw;}
.pirate-case .pa-3{position:absolute;align-content:stretch;display:flex;height:4.4444444cqw;align-items:center;left:0;padding-inline:var(--okto-space - 16,1.1111111cqw);right:0;top:0;}
.pirate-case .pa-4{align-content:stretch;display:flex;flex:1 0 0;height:4.4444444cqw;align-items:center;min-width:1px;overflow:clip;position:relative;}
.pirate-case .pa-5{height:0.4861111cqw;position:relative;flex-shrink:0;width:6.3194444cqw;}
.pirate-case .pa-6{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-7{align-content:stretch;display:flex;flex:1 0 0;height:4.4444444cqw;align-items:center;min-width:1px;overflow:clip;position:relative;}
.pirate-case .pa-8{overflow-wrap:break-word;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200;line-height:1.1805556cqw;font-style:normal;position:relative;flex-shrink:0;font-size:0.9722222cqw;color:var(--ink,#181b18);width:6.9444444cqw;}
.pirate-case .pa-9{align-content:stretch;display:flex;flex:1 0 0;height:4.4444444cqw;align-items:center;justify-content:flex-end;min-width:1px;overflow:clip;position:relative;}
.pirate-case .pa-10{overflow-wrap:break-word;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200;line-height:1.1805556cqw;font-style:normal;position:relative;flex-shrink:0;font-size:0.9722222cqw;color:var(--ink,#181b18);width:6.25cqw;}
.pirate-case .pa-11{align-content:stretch;display:flex;flex:1 0 0;height:4.4444444cqw;align-items:center;justify-content:flex-end;min-width:1px;overflow:clip;position:relative;}
.pirate-case .pa-12{border-width:1px;border-color:var(--ink,#181b18);border-style:solid;align-content:stretch;display:flex;height:2.3611111cqw;align-items:center;justify-content:center;overflow:clip;position:relative;flex-shrink:0;width:5.5555556cqw;}
.pirate-case .pa-13{overflow-wrap:break-word;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200;line-height:1.1805556cqw;font-style:normal;position:relative;flex-shrink:0;font-size:0.9027778cqw;color:var(--ink,#181b18);text-align:center;width:3.3333333cqw;}
.pirate-case .pa-14{overflow-wrap:break-word;position:absolute;align-content:stretch;display:flex;flex-direction:column;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;gap:0.5555556cqw;align-items:flex-start;left:4.4444444cqw;font-style:normal;overflow:clip;top:59.375cqw;width:43.8888889cqw;}
.pirate-case .pa-15{line-height:normal;position:relative;flex-shrink:0;color:#737373;font-size:0.9722222cqw;width:43.8888889cqw;}
.pirate-case .pa-16{line-height:1.4;position:relative;flex-shrink:0;color:#121212;font-size:1.1805556cqw;width:43.8888889cqw;}
.pirate-case .pa-17{position:absolute;background:#d9d9d9;height:1px;left:4.4444444cqw;right:4.4444444cqw;top:76.9659722cqw;}
.pirate-case .pa-18{position:absolute;height:2.3611111cqw;left:4.4444444cqw;top:78.7020833cqw;width:43.8888889cqw;}
.pirate-case .pa-19{overflow-wrap:break-word;position:absolute;align-content:stretch;display:flex;flex-direction:column;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;gap:1.6666667cqw;align-items:flex-start;line-height:1.5;left:51.6666667cqw;font-style:normal;overflow:clip;color:#121212;font-size:1.25cqw;top:78.6805556cqw;width:43.8888889cqw;}
.pirate-case .pa-20{position:relative;flex-shrink:0;width:38.8888889cqw;white-space:normal;}
.pirate-case .pa-22{position:relative;flex-shrink:0;width:38.8888889cqw;}
.pirate-case .pa-23{overflow-wrap:break-word;position:absolute;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1.5;left:4.4444444cqw;font-style:normal;color:#121212;font-size:5.4166667cqw;top:68.8888889cqw;width:38.8888889cqw;}
.pirate-case .pa-24{position:absolute;background:#fff;height:51.25cqw;left:4.4444444cqw;overflow:clip;top:-0.0001736cqw;width:91.1111111cqw;}
.pirate-case .pa-25{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:15.1670139cqw;line-height:1.3;left:calc(50% + 0.2611111cqw);font-style:normal;font-size:8.7827083cqw;color:#000;text-align:center;top:calc(50% - 6.6909722cqw);width:79.213125cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-26{position:absolute;height:51.3888889cqw;left:4.3055556cqw;overflow:clip;border-radius:0.5555556cqw;top:151.1805555cqw;width:91.3194444cqw;}
.pirate-case .pa-27{position:absolute;background:var(--white,white);height:51.25cqw;left:0;overflow:clip;top:0;width:91.1111111cqw;}
.pirate-case .pa-28{position:absolute;height:60.7407639cqw;left:0;top:-6.1215278cqw;width:91.1111111cqw;}
.pirate-case .pa-29{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-30{--tx:-50%;position:absolute;height:53.1944444cqw;left:50%;top:0cqw;width:106.6666667cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-31{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-32{position:absolute;height:71.5972222cqw;left:0;top:56.25cqw;width:100%;}
.pirate-case .pa-33{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-34{position:absolute;height:201.58%;left:-0.28%;max-width:none;top:-35.14%;width:100.55%;}
.pirate-case .pa-35{position:absolute;background:#000;height:78.3333333cqw;left:0.2083333cqw;top:127.8472222cqw;width:99.7916667cqw;}
.pirate-case .pa-36{position:absolute;border-width:1px;border-style:solid;border-color:#fff;height:44.8611111cqw;left:52.6388889cqw;border-radius:1.3888889cqw;top:144.5833333cqw;width:35.9027778cqw;}
.pirate-case .pa-37{position:absolute;border-width:1px;border-style:solid;border-color:#fff;height:44.8611111cqw;left:12.0138889cqw;border-radius:1.3888889cqw;top:144.5833333cqw;width:35.9027778cqw;}
.pirate-case .pa-38{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;border-radius:1.3888889cqw;width:100%;height:100%;}
.pirate-case .pa-39{position:absolute;height:51.0416667cqw;left:35.625cqw;border-radius:2.0833333cqw;top:12.5cqw;width:28.75cqw;}
.pirate-case .pa-40{position:absolute;height:42.9861111cqw;left:8.1145833cqw;border-radius:2.0833333cqw;top:16.5277778cqw;width:24.2182639cqw;}
.pirate-case .pa-41{position:absolute;height:42.9861111cqw;left:67.6388889cqw;border-radius:2.0833333cqw;top:16.5277778cqw;width:24.1666667cqw;}
.pirate-case .pa-42{position:absolute;left:46.7361111cqw;width:1.25cqw;height:1.25cqw;top:1099.2361111cqw;}
.pirate-case .pa-43{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-44{position:absolute;left:49.1666667cqw;width:1.6666667cqw;height:1.6666667cqw;top:1099.0277778cqw;}
.pirate-case .pa-45{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-46{position:absolute;left:52.0138889cqw;width:1.25cqw;height:1.25cqw;top:1099.2361111cqw;}
.pirate-case .pa-47{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-48{position:absolute;left:54.6527778cqw;width:1.25cqw;height:1.25cqw;top:1099.2361111cqw;}
.pirate-case .pa-49{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-50{position:absolute;left:44.0972222cqw;width:1.25cqw;height:1.25cqw;top:1099.2361111cqw;}
.pirate-case .pa-51{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-52{position:absolute;height:42.6388889cqw;left:34.6527778cqw;top:24.9305556cqw;width:31.25cqw;}
.pirate-case .pa-53{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-54{position:absolute;height:50cqw;left:-16.0416667cqw;top:37.1527778cqw;width:40.9722222cqw;}
.pirate-case .pa-55{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-56{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:18.1944444cqw;line-height:0;left:49.4097222cqw;font-style:normal;font-size:8.7827083cqw;color:#000;text-align:center;top:37.1527778cqw;width:79.2361111cqw;white-space:normal;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-57{line-height:1.04;}
.pirate-case .pa-59{line-height:1.04;color:#fff;}
.pirate-case .pa-60{position:absolute;left:64.0972222cqw;width:10.5555556cqw;height:10.5555556cqw;top:45.625cqw;}
.pirate-case .pa-61{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-62{position:absolute;left:0;max-width:none;width:100%;height:100%;top:0;}
.pirate-case .pa-63{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:18.1944444cqw;line-height:1.04;left:51.0069444cqw;font-style:normal;font-size:8.7827083cqw;color:#000;text-align:center;top:83.4722222cqw;width:79.2361111cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-64{--tx:-100%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:31.3194444cqw;line-height:1.04;left:87.3611111cqw;font-style:normal;font-size:8.7827083cqw;color:#000;text-align:right;top:4.7916666cqw;width:35.7638889cqw;white-space:normal;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-66{overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:200;height:10.8333333cqw;line-height:1.04;left:71.1805556cqw;font-style:normal;font-size:1.5604167cqw;color:#000;top:155.9722222cqw;width:20.9722222cqw;}
.pirate-case .pa-67{position:absolute;display:block;left:3.6805556cqw;top:-0cqw;width:46.0416667cqw;height:59.2361111cqw;overflow:hidden;}
.pirate-case .pa-68{position:absolute;background:#010101;height:59.2361111cqw;left:0cqw;top:-0cqw;width:46.0416667cqw;}
.pirate-case .pa-69{position:absolute;display:contents;left:3.6805556cqw;top:162.3611111cqw;}
.pirate-case .pa-70{position:absolute;display:flex;height:90.5363889cqw;align-items:center;justify-content:center;left:-18.5416667cqw;top:-10.3472222cqw;width:72.8410417cqw;}
.pirate-case .pa-71{flex:none;--rot:-104.04deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-72{height:55.1942361cqw;position:relative;width:79.5195139cqw;}
.pirate-case .pa-73{position:absolute;height:64.7498611cqw;left:7.1527778cqw;top:-0cqw;width:49.3414583cqw;}
.pirate-case .pa-74{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-75{position:absolute;height:161.78%;left:-26.67%;max-width:none;top:-5.9%;width:141.41%;}
.pirate-case .pa-76{position:absolute;height:52.0833333cqw;left:9.1666667cqw;top:1836.1111111cqw;width:80.6944444cqw;}
.pirate-case .pa-77{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-78{position:absolute;height:125.2%;left:-2.89%;max-width:none;top:-8.67%;width:105.77%;}
.pirate-case .pa-79{position:absolute;height:52.0833333cqw;left:9.1666667cqw;top:-0cqw;width:80.6944444cqw;}
.pirate-case .pa-80{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-81{position:absolute;height:125.2%;left:-2.89%;max-width:none;top:-8.67%;width:105.77%;}
.pirate-case .pa-82{position:absolute;height:26.3888889cqw;left:52.5694444cqw;top:102.5cqw;width:35.9722222cqw;}
.pirate-case .pa-83{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-84{position:absolute;height:34.8611111cqw;left:4.2361111cqw;top:63.1944445cqw;width:57.5694444cqw;}
.pirate-case .pa-85{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-86{overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;line-height:1.04;left:24.8611111cqw;font-style:normal;color:#b9bab5;font-size:1.5604167cqw;top:1844.9305556cqw;white-space:nowrap;}
.pirate-case .pa-87{position:absolute;left:8.2638889cqw;width:103.4722222cqw;height:103.4722222cqw;top:11.5277777cqw;}
.pirate-case .pa-88{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:15.1670139cqw;line-height:1.04;left:calc(50% + 1.1638889cqw);font-style:normal;font-size:8.7827083cqw;color:#000;text-align:center;top:29.0972222cqw;width:79.213125cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-89{position:absolute;height:15.5555556cqw;left:9.7916667cqw;top:312.2006944cqw;width:43.8888889cqw;}
.pirate-case .pa-90{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;line-height:1.5;left:calc(50% + 0.9722222cqw);font-style:normal;color:#121212;font-size:1.25cqw;text-align:center;top:49.4444444cqw;width:38.8888889cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-91{position:absolute;display:contents;inset:18.07% 31.5% 80.31% 33.33%;}
.pirate-case .pa-92{position:absolute;display:block;align-items:center;justify-content:center;left:33.3333333cqw;top:3.125cqw;width:35.1677778cqw;height:32.6409722cqw;}
.pirate-case .pa-93{--sx:-1;flex:none;height:100%;width:100%;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-94{position:relative;width:100%;height:100%;}
.pirate-case .pa-95{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-96{position:absolute;height:14.895cqw;left:43.2638889cqw;top:61.7361111cqw;width:31.5613889cqw;}
.pirate-case .pa-97{position:absolute;inset:-0.97% -0.32% -0.97% -0.46%;}
.pirate-case .pa-98{display:block;max-width:none;width:100%;height:100%;}
.pirate-case .pa-99{position:absolute;height:34.6527778cqw;left:19.5138889cqw;top:81.3444444cqw;width:66.5277778cqw;}
.pirate-case .pa-100{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-101{position:absolute;display:contents;inset:22.17% 59.28% 77.04% 23.51%;}
.pirate-case .pa-102{position:absolute;display:block;align-items:center;justify-content:center;left:23.5136111cqw;top:85.9689583cqw;width:17.2097222cqw;height:15.973125cqw;}
.pirate-case .pa-103{--sx:-1;flex:none;height:100%;width:100%;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-104{position:relative;width:100%;height:100%;}
.pirate-case .pa-105{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-106{position:absolute;display:contents;inset:20.96% 59.28% 78.25% 23.51%;}
.pirate-case .pa-107{position:absolute;display:block;align-items:center;justify-content:center;left:23.5136111cqw;top:61.5972222cqw;width:17.2097222cqw;height:15.9732639cqw;}
.pirate-case .pa-108{--sx:-1;flex:none;height:100%;width:100%;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-109{position:relative;width:100%;height:100%;}
.pirate-case .pa-110{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-111{position:absolute;height:37.2916667cqw;left:2.7083333cqw;top:126.7361111cqw;width:66.2963194cqw;}
.pirate-case .pa-112{position:absolute;height:37.2916667cqw;left:31.4583333cqw;top:166.5972222cqw;width:66.2963194cqw;}
.pirate-case .pa-113{--tx:-100%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:200;line-height:1.04;left:29.0972222cqw;font-style:normal;font-size:1.5604167cqw;color:#000;text-align:right;top:197.5694445cqw;width:20.9722222cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-114{line-height:1.04;}
.pirate-case .pa-115{line-height:1.04;}
.pirate-case .pa-117{line-height:1.04;}
.pirate-case .pa-118{overflow-wrap:break-word;position:absolute;align-content:stretch;display:flex;flex-direction:column;gap:2.2540278cqw;align-items:flex-start;left:4.2361111cqw;font-style:normal;top:1980.5576389cqw;width:91.5389583cqw;white-space:nowrap;}
.pirate-case .pa-119{background-clip:text;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1;position:relative;flex-shrink:0;font-size:18.7836806cqw;color:transparent;letter-spacing:-0.7513472cqw;}
.pirate-case .pa-120{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;line-height:normal;position:relative;flex-shrink:0;color:#1a1a1a;font-size:1.8783333cqw;letter-spacing:-0.0375694cqw;}
.pirate-case .pa-121{overflow-wrap:break-word;position:absolute;align-content:stretch;display:flex;gap:2.8801389cqw;align-items:flex-start;left:4.2361111cqw;font-style:normal;overflow:clip;top:2011.1125cqw;width:91.5389583cqw;}
.pirate-case .pa-122{border-color:#787878;border-style:solid;border-top-width:0.0626389cqw;align-content:stretch;display:flex;flex:1 0 0;flex-direction:column;gap:1.1270139cqw;align-items:flex-start;min-width:1px;overflow:clip;padding-top:2.0036111cqw;position:relative;}
.pirate-case .pa-123{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1;position:relative;flex-shrink:0;color:#1a1a1a;font-size:5.1341667cqw;letter-spacing:-0.2053681cqw;white-space:nowrap;}
.pirate-case .pa-124{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;line-height:1.5;min-width:100%;position:relative;flex-shrink:0;color:#666;font-size:1.2522222cqw;letter-spacing:-0.0125208cqw;width:min-content;}
.pirate-case .pa-125{border-color:#787878;border-style:solid;border-top-width:0.0626389cqw;align-content:stretch;display:flex;flex:1 0 0;flex-direction:column;gap:1.1270139cqw;align-items:flex-start;min-width:1px;overflow:clip;padding-top:2.0036111cqw;position:relative;}
.pirate-case .pa-126{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1;position:relative;flex-shrink:0;color:#1a1a1a;font-size:5.1341667cqw;letter-spacing:-0.2053681cqw;white-space:nowrap;}
.pirate-case .pa-127{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;line-height:1.5;min-width:100%;position:relative;flex-shrink:0;color:#666;font-size:1.2522222cqw;letter-spacing:-0.0125208cqw;width:min-content;}
.pirate-case .pa-128{border-color:#787878;border-style:solid;border-top-width:0.0626389cqw;align-content:stretch;display:flex;flex:1 0 0;flex-direction:column;gap:1.1270139cqw;align-items:flex-start;min-width:1px;overflow:clip;padding-top:2.0036111cqw;position:relative;}
.pirate-case .pa-129{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1;position:relative;flex-shrink:0;color:#1a1a1a;font-size:5.1341667cqw;letter-spacing:-0.2053681cqw;white-space:nowrap;}
.pirate-case .pa-130{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;line-height:1.5;min-width:100%;position:relative;flex-shrink:0;color:#666;font-size:1.2522222cqw;letter-spacing:-0.0125208cqw;width:min-content;}
.pirate-case .pa-131{border-color:#787878;border-style:solid;border-top-width:0.0626389cqw;align-content:stretch;display:flex;flex:1 0 0;flex-direction:column;gap:1.1270139cqw;align-items:flex-start;min-width:1px;overflow:clip;padding-top:2.0036111cqw;position:relative;}
.pirate-case .pa-132{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;line-height:1;position:relative;flex-shrink:0;color:#1a1a1a;font-size:5.1341667cqw;letter-spacing:-0.2053681cqw;white-space:nowrap;}
.pirate-case .pa-133{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:400;line-height:1.5;min-width:100%;position:relative;flex-shrink:0;color:#666;font-size:1.2522222cqw;letter-spacing:-0.0125208cqw;width:min-content;}
.pirate-case .pa-134{position:absolute;display:contents;left:33.3333333cqw;top:1772.5cqw;}
.pirate-case .pa-135{position:absolute;height:56.7361111cqw;left:33.3333333cqw;top:0.9722222cqw;width:19.2361111cqw;}
.pirate-case .pa-136{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-137{position:absolute;height:117.01%;left:-497.76%;max-width:none;top:-17.01%;width:613.42%;}
.pirate-case .pa-138{position:absolute;display:block;left:55.5555556cqw;top:3.4027778cqw;width:11.1805556cqw;height:40.7638889cqw;}
.pirate-case .pa-139{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-140{position:absolute;height:99.93%;left:0.52%;max-width:none;top:0;width:98.99%;}
.pirate-case .pa-141{position:absolute;height:47.7083333cqw;left:44.8611111cqw;top:0cqw;width:12.7777778cqw;}
.pirate-case .pa-142{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-143{position:absolute;left:35.4166667cqw;width:29.0277778cqw;height:29.0277778cqw;top:11.0416666cqw;}
.pirate-case .pa-144{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-145{position:absolute;height:38.8888889cqw;left:4.3055556cqw;overflow:clip;border-radius:0.5555556cqw;top:60.4861111cqw;width:60cqw;}
.pirate-case .pa-146{position:absolute;display:contents;left:-0.0506944cqw;top:0;}
.pirate-case .pa-147{position:absolute;display:flex;height:38.8888889cqw;align-items:center;justify-content:center;left:-0.0506944cqw;top:0;width:60.1009722cqw;}
.pirate-case .pa-148{flex:none;--rot:90deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-149{background:#151515;height:60.1009722cqw;position:relative;width:38.8888889cqw;}
.pirate-case .pa-150{position:absolute;display:contents;left:24.2319444cqw;top:0;}
.pirate-case .pa-151{position:absolute;height:34.5833333cqw;left:17.2222222cqw;mask-mode:alpha;mask-repeat:no-repeat;mask-position:7.0094444cqw -1.4583333cqw;mask-size:35.81875cqw 38.8701389cqw;top:1.4583333cqw;width:53.3333333cqw;mask-image:url("/assets/pirateship-case/static/tiki-box-reveal-and-push1.svg");}
.pirate-case .pa-152{position:absolute;display:contents;left:3.8006944cqw;top:11.5819444cqw;}
.pirate-case .pa-153{position:absolute;background:#ffc700;height:4.9975694cqw;left:3.9666667cqw;top:16.2618056cqw;width:10.6297917cqw;}
.pirate-case .pa-154{overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;inset:29.78% 43.32% 20.93% 6.33%;line-height:0;font-style:normal;font-size:0cqw;color:#fff;white-space:normal;}
.pirate-case .pa-155{margin-bottom:0;}
.pirate-case .pa-156{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-157{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-158{line-height:1.05;color:#151515;font-size:0.1214583cqw;}
.pirate-case .pa-159{line-height:1.05;color:#151515;font-size:4.5790278cqw;}
.pirate-case .pa-161{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-163{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-164{line-height:1.05;font-size:2.9534577cqw;}
.pirate-case .pa-165{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-166{line-height:1.05;font-size:2.9534577cqw;}
.pirate-case .pa-167{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-168{line-height:1.05;font-size:4.5790278cqw;}
.pirate-case .pa-169{overflow-wrap:break-word;position:absolute;display:flex;flex-direction:column;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;inset:81.62% 44.22% 10.17% 6.7%;justify-content:flex-end;line-height:0;font-style:normal;font-size:1.5086111cqw;color:#fff;white-space:nowrap;}
.pirate-case .pa-170{line-height:1.05;margin-bottom:0;}
.pirate-case .pa-171{line-height:1.05;}
.pirate-case .pa-172{position:absolute;height:8.0135417cqw;left:49.6583333cqw;top:23.3222222cqw;width:6.5035417cqw;}
.pirate-case .pa-173{position:absolute;display:contents;inset:10.2% 69.97% 71.68% 6.48%;}
.pirate-case .pa-174{position:absolute;inset:10.2% 87.05% 79.76% 6.48%;}
.pirate-case .pa-175{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-176{position:absolute;display:contents;inset:11.82% 69.97% 71.68% 15.09%;}
.pirate-case .pa-177{position:absolute;inset:19.87% 74.03% 71.68% 15.09%;}
.pirate-case .pa-178{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-179{position:absolute;inset:11.82% 69.97% 81.69% 15.15%;}
.pirate-case .pa-180{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-181{position:absolute;left:37.3611111cqw;width:7.0138889cqw;height:7.0138889cqw;top:26.3194444cqw;}
.pirate-case .pa-182{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-183{position:absolute;height:56.25cqw;left:-0.6944444cqw;top:-0cqw;width:100.8333333cqw;}
.pirate-case .pa-184{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-185{position:absolute;height:119.46%;left:-11.9%;max-width:none;top:-5.73%;width:119.4%;}
.pirate-case .pa-186{position:absolute;left:77.7083333cqw;width:7.0138889cqw;height:7.0138889cqw;top:853.3333333cqw;}
.pirate-case .pa-187{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-188{position:absolute;display:contents;left:-114.0972222cqw;top:1370.9027778cqw;}
.pirate-case .pa-189{position:absolute;display:contents;left:-114.0972222cqw;top:1370.9027778cqw;}
.pirate-case .pa-190{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:-12.9347222cqw;top:22.0506944cqw;width:44.4877083cqw;}
.pirate-case .pa-191{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-192{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-193{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-194{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:-48.4763889cqw;top:0cqw;width:44.4877083cqw;}
.pirate-case .pa-195{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-196{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-197{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-198{position:absolute;display:flex;height:32.1682639cqw;align-items:center;justify-content:center;left:-81.2180556cqw;top:18.4236111cqw;width:44.5882639cqw;}
.pirate-case .pa-199{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-200{height:32.1682639cqw;position:relative;width:44.5882639cqw;}
.pirate-case .pa-201{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-202{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-203{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-204{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:24.85625cqw;top:42.9409722cqw;width:44.4151389cqw;}
.pirate-case .pa-205{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-206{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-207{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-208{position:absolute;display:flex;height:32.1682639cqw;align-items:center;justify-content:center;left:-8.2479167cqw;top:61.3645833cqw;width:44.5882639cqw;}
.pirate-case .pa-209{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-210{height:32.1682639cqw;position:relative;width:44.5882639cqw;}
.pirate-case .pa-211{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-212{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-213{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-214{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:-44.5597222cqw;top:40.1840278cqw;width:44.4877083cqw;}
.pirate-case .pa-215{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-216{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-217{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-218{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-219{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-220{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:-40.425cqw;top:80.36875cqw;width:44.4151389cqw;}
.pirate-case .pa-221{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-222{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-223{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-224{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:-114.0972222cqw;top:37.2826389cqw;width:44.4151389cqw;}
.pirate-case .pa-225{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-226{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-227{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-228{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-229{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-230{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:-77.5631944cqw;top:59.04375cqw;width:44.4151389cqw;}
.pirate-case .pa-231{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-232{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-233{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-234{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:28.0208333cqw;top:85.5555555cqw;width:44.4151389cqw;}
.pirate-case .pa-235{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-236{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-237{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-238{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-239{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-240{position:absolute;display:contents;left:-5.7298611cqw;top:1435.6041667cqw;}
.pirate-case .pa-241{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:95.4326389cqw;top:86.7520833cqw;width:44.4877083cqw;}
.pirate-case .pa-242{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-243{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-244{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-245{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:59.8909722cqw;top:64.7013889cqw;width:44.4877083cqw;}
.pirate-case .pa-246{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-247{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-248{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-249{position:absolute;display:flex;height:32.1682639cqw;align-items:center;justify-content:center;left:27.1493056cqw;top:83.125cqw;width:44.5882639cqw;}
.pirate-case .pa-250{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-251{height:32.1682639cqw;position:relative;width:44.5882639cqw;}
.pirate-case .pa-252{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-253{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-254{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-255{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:133.2236111cqw;top:107.6416666cqw;width:44.4151389cqw;}
.pirate-case .pa-256{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-257{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-258{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-259{position:absolute;display:flex;height:32.1682639cqw;align-items:center;justify-content:center;left:100.1194444cqw;top:126.0659722cqw;width:44.5882639cqw;}
.pirate-case .pa-260{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-261{height:32.1682639cqw;position:relative;width:44.5882639cqw;}
.pirate-case .pa-262{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-263{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-264{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-265{position:absolute;display:flex;height:32.0957639cqw;align-items:center;justify-content:center;left:63.8076389cqw;top:104.8854166cqw;width:44.4877083cqw;}
.pirate-case .pa-266{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-267{height:32.0957639cqw;position:relative;width:44.4877083cqw;}
.pirate-case .pa-268{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-269{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-270{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-271{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:67.9423611cqw;top:145.0868055cqw;width:44.4151389cqw;}
.pirate-case .pa-272{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-273{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-274{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-275{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:-5.7298611cqw;top:101.9840278cqw;width:44.4151389cqw;}
.pirate-case .pa-276{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-277{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-278{position:absolute;inset:0;pointer-events:none;}
.pirate-case .pa-279{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-280{position:absolute;max-width:none;object-fit:cover;width:100%;height:100%;}
.pirate-case .pa-281{position:absolute;display:flex;height:32.0434028cqw;align-items:center;justify-content:center;left:30.8041667cqw;top:123.7444444cqw;width:44.4151389cqw;}
.pirate-case .pa-282{--sy:-1;flex:none;--rot:180deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-283{height:32.0434028cqw;position:relative;width:44.4151389cqw;}
.pirate-case .pa-284{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-285{overflow-wrap:break-word;position:absolute;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200;line-height:normal;left:23.5416667cqw;font-style:normal;color:#ff1313;font-size:8.8888889cqw;top:621.1111111cqw;white-space:nowrap;}
.pirate-case .pa-286{position:absolute;background:#010101;height:59.2361111cqw;left:50.5555556cqw;overflow:clip;top:-0cqw;width:45cqw;}
.pirate-case .pa-287{position:absolute;display:flex;height:90.8617361cqw;align-items:center;justify-content:center;left:-1.3888889cqw;top:-23.4722222cqw;width:76.8786111cqw;}
.pirate-case .pa-288{flex:none;--rot:-29.61deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-289{height:80.1419444cqw;position:relative;width:42.8779861cqw;}
.pirate-case .pa-290{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-291{position:absolute;height:100.04%;left:-53.08%;max-width:none;top:-0.02%;width:153.08%;}
.pirate-case .pa-292{position:absolute;height:42.9861111cqw;left:24.2361111cqw;top:0.7638889cqw;width:23.2638889cqw;}
.pirate-case .pa-293{position:absolute;display:contents;left:10.5555556cqw;top:8.3333333cqw;}
.pirate-case .pa-294{position:absolute;display:flex;height:65.4180556cqw;align-items:center;justify-content:center;left:10.5555556cqw;top:8.3333333cqw;width:60.2028472cqw;}
.pirate-case .pa-295{flex:none;--rot:0.68deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-296{height:64.7222222cqw;position:relative;width:59.4444444cqw;}
.pirate-case .pa-297{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-298{position:absolute;display:contents;left:14.9625cqw;top:12.8541667cqw;}
.pirate-case .pa-299{position:absolute;background:#131313;height:3.7461111cqw;left:16.4756944cqw;border-radius:1.1111111cqw;top:12.8541667cqw;width:12.8952778cqw;}
.pirate-case .pa-300{position:absolute;height:26.0786806cqw;left:16.4756944cqw;border-radius:1.6894444cqw;top:13.575cqw;width:12.8952778cqw;}
.pirate-case .pa-301{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:1.6894444cqw;}
.pirate-case .pa-302{position:absolute;height:107.63%;left:-0.18%;max-width:none;top:-6.05%;width:100.22%;}
.pirate-case .pa-303{position:absolute;background:#fff;height:24.2361111cqw;left:16.4583333cqw;border-radius:1.6666667cqw;top:15.4166667cqw;width:12.9166667cqw;}
.pirate-case .pa-304{position:absolute;height:6.6277083cqw;left:16.4756944cqw;border-radius:1.6666667cqw;top:33.0256944cqw;width:12.8952778cqw;}
.pirate-case .pa-305{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:1.6666667cqw;}
.pirate-case .pa-306{position:absolute;height:429%;left:-1.78%;max-width:none;top:-329.01%;width:101.59%;}
.pirate-case .pa-307{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:4.8267361cqw;line-height:0;left:calc(50% + 0.2430556cqw);font-style:normal;font-size:1.0247222cqw;color:#000;text-align:center;top:calc(50% - 7.1875cqw);width:9.6534028cqw;white-space:normal;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-308{line-height:1.04;margin-bottom:0.0034584cqw;}
.pirate-case .pa-309{line-height:1.04;margin-bottom:0.0034584cqw;}
.pirate-case .pa-310{line-height:1.04;margin-bottom:0.0034584cqw;}
.pirate-case .pa-311{line-height:1.04;margin-bottom:0.0034584cqw;}
.pirate-case .pa-312{line-height:1.04;}
.pirate-case .pa-313{position:absolute;display:contents;left:14.9625cqw;top:17.1527778cqw;}
.pirate-case .pa-314{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:5.0071528cqw;line-height:1.04;left:calc(50% + 0.1708333cqw);font-style:normal;font-size:2.39625cqw;color:#000;text-align:center;top:calc(50% - 12.4652778cqw);width:15.4166667cqw;white-space:normal;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-316{position:absolute;display:flex;inset:33.15% 40.12% 62.63% 47.22%;align-items:center;justify-content:center;}
.pirate-case .pa-317{flex:none;height:100%;--rot:90deg;width:100%;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-318{position:relative;width:100%;height:100%;}
.pirate-case .pa-319{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-320{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:2.7375694cqw;line-height:1.04;left:calc(50% + 1.3395833cqw);font-style:normal;font-size:2.520625cqw;color:#000;text-align:center;top:calc(50% - 10.0409722cqw);width:5.7632639cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-321{--tx:-50%;overflow-wrap:break-word;position:absolute;font-family:PirateCaseARR,Arial,sans-serif;font-weight:700;height:5.0071528cqw;line-height:1.04;left:calc(50% + 0.1708333cqw);font-style:normal;font-size:2.39625cqw;color:#000;text-align:center;top:calc(50% - 12.4652778cqw);width:15.4166667cqw;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-322{position:absolute;height:10.4459028cqw;left:23.4631944cqw;top:21.2111111cqw;width:5.9072917cqw;}
.pirate-case .pa-323{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-324{position:absolute;height:114.58%;left:18.59%;max-width:none;top:-33.28%;width:163.41%;}
.pirate-case .pa-325{position:absolute;display:contents;left:17.4305556cqw;top:26.9444444cqw;}
.pirate-case .pa-326{position:absolute;display:contents;left:17.4305556cqw;top:26.9444444cqw;}
.pirate-case .pa-327{position:absolute;display:flex;height:1.5969444cqw;align-items:center;justify-content:center;left:17.4305556cqw;top:27.1527778cqw;width:1.5590278cqw;}
.pirate-case .pa-328{--sy:-1;flex:none;--rot:-24.58deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-329{height:1.2290278cqw;position:relative;width:1.1522222cqw;}
.pirate-case .pa-330{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-331{position:absolute;display:flex;height:1.2232639cqw;align-items:center;justify-content:center;left:20.5486111cqw;top:27.75625cqw;width:1.2954167cqw;}
.pirate-case .pa-332{--sy:-1;flex:none;--rot:93.41deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-333{height:1.2290278cqw;position:relative;width:1.1522222cqw;}
.pirate-case .pa-334{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-335{position:absolute;display:flex;align-items:center;justify-content:center;left:18.8888889cqw;width:0.91625cqw;height:0.91625cqw;top:28.125cqw;}
.pirate-case .pa-336{--sy:-1;flex:none;--rot:-24.58deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-337{position:relative;width:0.6913194cqw;height:0.6913194cqw;}
.pirate-case .pa-338{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-339{position:absolute;display:flex;height:1.4951389cqw;align-items:center;justify-content:center;left:19.5138889cqw;top:27.7777778cqw;width:1.4572222cqw;}
.pirate-case .pa-340{--sy:-1;flex:none;--rot:-24.58deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-341{height:1.1522222cqw;position:relative;width:1.0754167cqw;}
.pirate-case .pa-342{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-343{position:absolute;display:flex;align-items:center;justify-content:center;left:19.3833333cqw;width:0.91625cqw;height:0.91625cqw;top:26.9444444cqw;}
.pirate-case .pa-344{--sy:-1;flex:none;--rot:-24.58deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-345{position:relative;width:0.6913194cqw;height:0.6913194cqw;}
.pirate-case .pa-346{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-347{position:absolute;display:flex;align-items:center;justify-content:center;left:17.7923611cqw;width:0.91625cqw;height:0.91625cqw;top:28.7513889cqw;}
.pirate-case .pa-348{--sy:-1;flex:none;--rot:-24.58deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-349{position:relative;width:0.6913194cqw;height:0.6913194cqw;}
.pirate-case .pa-350{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-351{position:absolute;height:4.8267361cqw;left:17.6277778cqw;top:28.775cqw;width:10.2297222cqw;}
.pirate-case .pa-352{position:absolute;inset:0;overflow:hidden;pointer-events:none;}
.pirate-case .pa-353{position:absolute;height:513.77%;left:-6.32%;max-width:none;top:-277.27%;width:112.68%;}
.pirate-case .pa-354{position:absolute;height:56.5972222cqw;left:1.1805556cqw;top:0cqw;width:97.6388889cqw;}
.pirate-case .pa-355{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-356{position:absolute;left:76.5972222cqw;width:7.0138889cqw;height:7.0138889cqw;top:537.2916667cqw;}
.pirate-case .pa-357{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-358{overflow-wrap:break-word;position:absolute;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200;line-height:normal;left:65.8333333cqw;font-style:normal;color:#ff1313;font-size:8.8888889cqw;top:572.8472222cqw;white-space:nowrap;}
.pirate-case .pa-359{position:absolute;height:50.5555556cqw;left:55.9027778cqw;top:90.3472222cqw;width:33.1944444cqw;}
.pirate-case .pa-360{position:absolute;left:57.2916667cqw;width:7.0138889cqw;height:7.0138889cqw;top:626.5972222cqw;}
.pirate-case .pa-361{position:absolute;display:block;inset:0;max-width:none;width:100%;height:100%;}
.pirate-case .pa-362{position:absolute;left:0;width:44.4444444cqw;height:44.4444444cqw;top:64.7222223cqw;}
.pirate-case .pa-363{position:absolute;height:36.5277778cqw;left:26.4583333cqw;top:159.5833334cqw;width:65.1388889cqw;}
.pirate-case .pa-364{position:absolute;height:37.2222222cqw;left:10.2777778cqw;top:183.1944445cqw;width:26.875cqw;}
.pirate-case .pa-365{position:absolute;inset:0;max-width:none;object-fit:cover;pointer-events:none;width:100%;height:100%;}
.pirate-case .pa-366{position:absolute;display:flex;height:3.6111111cqw;align-items:center;justify-content:center;left:78.4722222cqw;top:532.2222222cqw;width:5.9722222cqw;}
.pirate-case .pa-367{flex:none;--rot:-31.16deg;transform:translateX(var(--tx,0)) rotate(var(--rot,0deg)) scale(var(--sx,1),var(--sy,1));}
.pirate-case .pa-368{position:relative;width:6.9790972cqw;}
.pirate-case .pa-369{position:absolute;inset:-0.0694444cqw 0 0 0;}
.pirate-case .pa-370{display:block;max-width:none;width:100%;height:100%;}
/* Native Pirate Ship case; the coordinate artwork follows the approved board.
   Text, navigation, metrics and player controls are regular responsive HTML. */
@font-face{font-family:PirateCaseARR;src:url('/assets/pirateship-case/arrrrial-regular.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:PirateCaseARR;src:url('/assets/pirateship-case/arrrrial-bold.otf') format('opentype');font-weight:700;font-display:swap}
html{scroll-behavior:auto}
body.case-pirateship{background:#fff;margin:0}
.pirate-case{container-type:inline-size;position:relative;width:100%;padding-top:67px;background:#fff;overflow:clip;color:#181b18;font-family:var(--okto-font,Lausanne,Arial,sans-serif)}
.pirate-case *{box-sizing:border-box}
.pirate-case :is(p,h1,h2,h3,dl,dt,dd,figure){margin:0}
.pirate-case img{display:block;max-width:none}
.ps-art{position:relative;height:var(--ps-height);width:100%}
.ps-art,.ps-intro,.ps-results{scroll-margin-top:64px}
.ps-opening{overflow:hidden;background:#000}
.pirate-case .ps-loop,.pirate-case .ps-film{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.ps-film-frame{background:#000;overflow:hidden}
.pirate-case .ps-film{object-fit:contain}
.ps-intro{display:grid;grid-template-columns:1fr 1fr;column-gap:48px;padding:24px 4.444444% 0;min-height:44.861111cqw;align-content:start}
.ps-services{grid-column:1/-1;margin-bottom:72px;max-width:680px}
.ps-label{display:block;font-size:var(--type-label,14px);line-height:1.4;color:#737373;margin-bottom:8px}
.ps-services p{font-size:var(--type-supporting,16px);font-weight:200;line-height:1.4}
.ps-intro h1{grid-column:1/-1;font-size:clamp(48px,5.416667cqw,96px);font-weight:700;line-height:1.5;border-bottom:1px solid #d9d9d9;margin-bottom:24px}
.ps-intro-copy{grid-column:2;font-size:var(--type-body,22px);font-weight:200;line-height:1.45;letter-spacing:-.01em;max-width:632px}
.ps-intro-copy p+p{margin-top:24px}
.ps-spacer{width:100%}
.ps-after-promise{height:8.402778cqw}.ps-after-two-up{height:8.958333cqw}.ps-after-type{height:10.555556cqw}.ps-after-outdoor{height:6.25cqw}.ps-after-digital{height:15.208333cqw}.ps-after-social{height:36.805556cqw}.ps-after-merch{height:7.152778cqw}.ps-after-bottles{height:5.277778cqw}
.ps-boxes{margin-top:-4.097222cqw}
.ps-merch{margin-top:-2.777778cqw}
.pirate-case .ps-chapter-title{font-family:PirateCaseARR,Arial,sans-serif;font-weight:700}
.pirate-case .ps-type-caption{font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:700;font-size:var(--type-supporting,16px)}
.ps-emoji-space{display:inline-block;width:13cqw;height:1px}
.ps-carousel-controls{position:absolute;left:50%;bottom:13.888889cqw;transform:translateX(-50%);display:flex;align-items:center;gap:24px}
.ps-carousel-controls button{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:#181b18;font:24px/1 var(--okto-font,Arial);cursor:pointer;padding:0}
.ps-carousel-dots{display:flex;align-items:center;gap:12px}
.ps-carousel-dots button{width:18px;height:18px;position:relative}
.ps-carousel-dots button:before{content:'';width:12px;height:12px;border-radius:50%;background:#c4c4c4;transition:background .2s,transform .2s}
.ps-carousel-dots button[aria-pressed=true]:before{background:#737373;transform:scale(1.4)}
.pirate-case button:focus-visible{outline:2px solid #181b18;outline-offset:5px}
.ps-social [data-media]{transition:left .45s ease,top .45s ease,width .45s ease,height .45s ease,transform .45s ease,opacity .45s ease}
.ps-results{padding:15.555556cqw 4.236111% 100px}
.ps-result-hero{margin-bottom:104px}
.ps-result-number{font-size:18.783681cqw;font-weight:700;line-height:1;letter-spacing:-.04em;background:linear-gradient(90deg,#ffcf00 0%,#ff1f1e 100%);background-clip:text;-webkit-background-clip:text;color:transparent;width:max-content;max-width:100%;font-variant-numeric:tabular-nums}
.ps-result-hero>p:last-child{font-size:var(--type-body,22px);font-weight:200;line-height:1.4;margin-top:32px}
.ps-result-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.880139cqw}
.ps-result-grid>div{border-top:1px solid #787878;padding-top:28px}
.ps-result-grid dt{font-size:5.134167cqw;font-weight:700;line-height:1;letter-spacing:-.04em;margin-bottom:16px;font-variant-numeric:tabular-nums}
.ps-result-grid dd{font-size:var(--type-supporting,16px);line-height:1.5;font-weight:200;color:#62665f}
.ps-animated-still{display:none}
@media(min-width:1800px){.ps-intro-copy{max-width:none}.ps-services{max-width:800px}}
@media(max-width:760px){
 .pirate-case{padding-top:64px}
 .ps-intro{display:block;padding:24px;min-height:0;margin-bottom:48px}
 .ps-services{margin-bottom:40px}.ps-services p{font-size:16px}
 .ps-intro h1{font-size:44px;line-height:1.15;padding-bottom:20px;margin-bottom:24px}
 .ps-intro-copy{font-size:var(--type-body,19px);max-width:none;line-height:1.45}
 .ps-intro-copy br{display:none}
 .ps-promise{height:44cqw}
 .ps-promise>[data-node-id]{inset:0;width:100%;height:100%}
 .ps-promise .ps-chapter-title{top:50%;transform:translate(-50%,-50%);left:50%;width:90%;height:auto;font-size:9cqw;line-height:1.04}
 .ps-after-promise{height:12cqw}.ps-after-two-up{height:16cqw}
 .ps-after-social{height:12cqw}
 .ps-campaign{height:250cqw}
 .ps-campaign [data-node-id="1412:964"]{top:4cqw;left:35%;width:30cqw;height:41cqw}
 .ps-campaign [data-node-id="1412:969"]{top:58cqw;left:50%;width:88%;height:auto;font-size:9cqw}
 .ps-campaign [data-node-id="1412:1080"]{top:88cqw;left:6%;width:88%;height:49.5cqw}
 .ps-campaign [data-node-id="1412:971"]{top:144cqw;left:6%;width:88%;height:auto;font-size:16px;line-height:1.35;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200}
 .ps-campaign [data-node-id="1412:1081"]{top:181cqw;left:6%;width:88%;height:49.5cqw}
 .ps-campaign [data-node-id="1412:1082"]{top:236cqw;left:6%;width:88%;transform:none;font-size:16px;line-height:1.35;text-align:left;font-family:var(--okto-font,Lausanne,Arial,sans-serif);font-weight:200}
 .ps-campaign [data-node-id="1412:1082"] span{line-height:1.35}
 .ps-campaign [data-node-id="1412:1082"] br{display:none}
 .ps-boxes{margin-top:12cqw}
 .ps-merch{margin-top:0}
 .ps-carousel-controls{bottom:7cqw;gap:14px}
 .ps-carousel-dots{gap:8px}
 .ps-social{height:105cqw}
 .ps-results{padding:48px 24px 64px}
 .ps-result-number{font-size:23cqw;line-height:1.05}
 .ps-result-hero{margin-bottom:48px}
 .ps-result-hero>p:last-child{font-size:var(--type-body,19px);margin-top:20px}
 .ps-result-grid{grid-template-columns:1fr 1fr;gap:32px 20px}
 .ps-result-grid>div{padding-top:20px}
 .ps-result-grid dt{font-size:44px;margin-bottom:12px}
 .ps-result-grid dd{font-size:16px;line-height:1.4}
}
@media(max-width:350px){.ps-intro h1{font-size:38px}.ps-campaign{height:285cqw}.ps-campaign [data-node-id="1412:1081"]{top:201cqw}.ps-campaign [data-node-id="1412:1082"]{top:258cqw}.ps-result-grid dt{font-size:38px}}
@media(prefers-reduced-motion:reduce){.ps-social [data-media],.ps-carousel-dots button:before{transition:none}.ps-animated-source{display:none!important}.ps-animated-still{display:block!important}}