@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap');
/* Noah's Ocean brand edition: supplied style guide, applied across all pages. */
:root{--navy:#0B2238;--blue:#028090;--ink:#0B2238;--red:#F4A261;--muted:#536577;--pale:#F8FAFC;--secondary:#028090;--tertiary:#F4A261;--line:#dde7ed}
body{background:#F8FAFC;color:#0B2238;font-family:'Plus Jakarta Sans',Arial,sans-serif;line-height:1.55}
h1,h2,h3,h4,.brand strong{font-family:'Space Grotesk',Arial,sans-serif;letter-spacing:-.035em}
button,.button,.tabs button,.filters label,.overline,.eyebrow,.badge,.benefit-grid small,.section-heading a,.nav a,.breadcrumbs,.category-grid span,.product-card .rating,.collections a{font-family:'JetBrains Mono',monospace;letter-spacing:-.035em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #F4A261;outline-offset:3px}
.utility{background:#0B2238;color:#dbe9f0}.utility-inner{height:35px}
.site-header{box-shadow:0 4px 20px #0b223810;background:#fff}.header-main{height:96px;gap:28px}
.brand{gap:10px}.brand-emblem{display:block;width:70px;height:72px;object-fit:contain;mix-blend-mode:multiply;flex:none}.brand strong{font-size:24px;line-height:1;letter-spacing:-.045em;color:#0B2238}.brand small{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:500;color:#536577;margin-top:5px;letter-spacing:-.04em}
.search{border:1px solid #cfdbe3;background:#F8FAFC;height:44px;border-radius:7px;max-width:555px}.search input{font-family:'JetBrains Mono',monospace;font-size:12px}.search button{border-radius:0;width:50px;background:#0B2238;font-size:24px}.search button:hover{background:#028090}
.header-actions{gap:13px}.plain{font-size:23px;color:#0B2238;padding:6px 4px}.plain span{font:600 10px 'JetBrains Mono',monospace}.plain b{background:#028090}
.nav{height:50px;gap:28px;border-color:#e8eef2;font-size:11px}.nav a{font-weight:600}.nav a:hover,.section-heading a:hover{color:#028090}.nav .red{color:#9b5325}.tagline{font:italic 16px/1.08 'Space Grotesk',sans-serif;color:#028090;font-weight:600}
.hero{background:#0B2238;height:425px}.hero-slide{background-image:linear-gradient(90deg,#0b2238ee 0%,#0b2238da 35%,#0b22385a 72%),var(--sea-image)}.hero-content{padding-top:59px}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.08em;color:#f5b873;opacity:1}.hero h1{font:700 clamp(54px,5.2vw,79px)/1 'Space Grotesk',Arial,sans-serif;letter-spacing:-.06em}.hero h2{font:600 clamp(27px,2.8vw,38px)/1.15 'Space Grotesk',Arial,sans-serif;letter-spacing:-.045em}.hero-content>p:not(.eyebrow){font-size:15px;line-height:1.65}.hero-photo{mask-image:linear-gradient(90deg,transparent,#000 28%)}.hero-controls>button{background:#ffffff30;border:1px solid #ffffff80}.dots button.active{background:#F4A261}
.button{font-weight:600;font-size:12px;letter-spacing:-.025em;border-radius:5px;transition:background .2s,transform .2s}.button:hover{transform:translateY(-1px);filter:none}.button.light{background:#F8FAFC;color:#0B2238}.button.light:hover{background:#e6f2f4}.button.outline{border:1px solid #F8FAFC;color:#fff;background:transparent}.button.outline:hover{background:#ffffff22}.blue-button{background:#0B2238;color:#fff}.blue-button:hover{background:#028090}.red-button{background:#F4A261;color:#0B2238}.red-button:hover{background:#f6b481}
.worlds{padding-top:20px;padding-bottom:20px}.world-card{border-radius:8px;box-shadow:0 5px 18px #0b223814}.world-card:after{background:linear-gradient(#0b2238d9 0%,#0b22386e 38%,transparent 72%,#0b223877 100%)}.world-card:nth-child(2):after{background:linear-gradient(#0b2238b8,transparent 63%,#0b223866)}.world-card:nth-child(4):after{background:linear-gradient(#f8fafc 0%,#f8fafcdd 34%,transparent 70%,#0b223855)}.world-copy h3{font:700 22px/1.08 'Space Grotesk',Arial,sans-serif;letter-spacing:-.045em}.world-copy p{font-size:11px}.gift-world .world-copy,.gift-world .world-copy p{color:#0B2238}.gift-world .world-icon{color:#C99643}
.benefits{background:#eff5f7;border-block:1px solid #e6edf0}.benefit-grid b{color:#028090}.benefit-grid strong{font-weight:700}.benefit-grid small{font-size:10px;color:#536577}
.section-heading h2,.inner-page h1{font:700 30px/1.1 'Space Grotesk',Arial,sans-serif;letter-spacing:-.055em}.section-heading a{color:#028090}.category-grid img{background:#edf3f6;border:1px solid #e8eff2}.category-grid a:hover img{border-color:#028090;transform:translateY(-2px);transition:.2s}.category-grid a{font-size:10px}.product-heading .tabs button{font-size:11px}.tabs button.active{border-color:#028090;color:#028090}
.product-card{background:#fff;border-color:#dde7ed;box-shadow:0 3px 12px #0b223809;border-radius:8px}.product-card h3{font:600 12px/1.35 'Plus Jakarta Sans',Arial,sans-serif;letter-spacing:0}.product-card strong{font-family:'Space Grotesk',sans-serif}.product-card .add{background:#0B2238;color:#fff;font:600 10px 'JetBrains Mono',monospace;border-radius:5px}.product-card .add:hover{background:#028090}.heart.saved{color:#bc5e39}.badge{background:#F4A261;color:#0B2238}
.send-home{background:#fff5eb;box-shadow:0 3px 16px #0b22380b}.send-main h2{font:700 29px 'Space Grotesk',sans-serif;color:#0B2238}.send-main h2 span{color:#bd8b3e}.send-main>p{color:#79533b}.send-steps b{color:#028090}.send-steps span{color:#684c3a}.collections{box-shadow:0 3px 12px #0b22380a}.collections a:hover{color:#028090}
.banner{box-shadow:0 5px 18px #0b223813}.banner h2{font:700 26px/1.1 'Space Grotesk',sans-serif;letter-spacing:-.045em}.marine-banner{background-image:linear-gradient(90deg,#0b2238ef,transparent 85%),url('assets/banner-marine.webp')}.family-banner{background-image:linear-gradient(90deg,#f8fafcdb,transparent 85%),url('assets/banner-family.webp');color:#0B2238}
.newsletter{background:#eaf3f5}.newsletter-intro>span,.social p,.newsletter em{color:#028090}.newsletter h3{font-size:13px}.newsletter form{border-radius:7px}.newsletter input{font-family:'JetBrains Mono',monospace}.newsletter em{font:italic 18px 'Space Grotesk',sans-serif}
footer{background:#0B2238;color:#eaf3f5}.footer-brand{background:#fff;padding:6px 10px 6px 3px;border-radius:7px;width:max-content;max-width:100%}.footer-brand .brand-emblem{width:48px;height:50px}.footer-brand strong{font-size:19px}.footer-brand small{font-size:8px}.footer-grid h4{color:#F4A261;font-size:12px}.footer-grid a:hover{color:#F4A261}.footer-mark{font:italic 22px 'Space Grotesk',sans-serif;color:#e7b678}.footer-bottom{border-color:#ffffff35}
/* Inner pages and forms */
.inner-page h1{font-size:clamp(32px,4vw,46px)}.inner-page h2{font:700 24px/1.15 'Space Grotesk',sans-serif;letter-spacing:-.045em}.breadcrumbs{color:#66798a}.breadcrumbs a,.result-count,.account-nav a,.info-links a,.order-card a,.track-status a,.info-copy a,.summary>a:not(.button){color:#028090}
.panel{border-color:#dce6eb;box-shadow:0 4px 18px #0b223809}.filters{background:#edf4f6}.filters label,.detail-content label,.checkout-form label,.contact-form label{font-size:11px;font-family:'JetBrains Mono',monospace}.filters input,.filters select,.detail-content input,.detail-content select,.checkout-form input:not([type=radio]),.checkout-form select,.checkout-form textarea,.contact-form input,.contact-form textarea,.inline-form input{border-color:#cbd9df;border-radius:6px;outline-color:#028090}.detail-image{background:#f0f5f7;border-color:#dce6eb}.detail-price{color:#0B2238}.stock{color:#028090}.light-border{border-color:#0B2238;color:#0B2238}.notice{background:#e5f2f3;color:#0B2238;border-color:#028090}.summary .full{background:#0B2238}.send-hero{background:#fff2e5}.send-hero h2{color:#0B2238}.collection-pills button{border-color:#e6b987;color:#744b28}.collection-pills button.selected{background:#0B2238;color:#fff;border-color:#0B2238}.track-status{background:#e7f4f4}.track-status h2{color:#028090}.account-nav a.active,.info-links a.active,.account-nav a:hover,.info-links a:hover{background:#e4f2f3}
@media(max-width:1100px){.header-main{gap:14px}.nav{gap:14px}.brand strong{font-size:22px}.brand-emblem{width:58px;height:62px}}
@media(max-width:720px){.header-main{min-height:77px;height:auto}.brand-emblem{width:51px;height:54px}.brand strong{font-size:20px}.brand small{font-size:8px}.hero-content{padding-top:75px}.hero h1{font-size:48px}.hero h2{font-size:26px}.world-copy h3{font-size:18px}.footer-brand .brand-emblem{width:45px;height:48px}}