/* Navico product system */
.brand { letter-spacing:-.04em; text-transform:uppercase; }
.brand b { color:var(--rust); font-size:.48em; letter-spacing:.08em; margin-left:4px; }
.brand-mark { color:var(--rust); font-size:23px; transform:none; }
.header-cta, .button-link { background:var(--ink); color:#f8f4e9; }
.header-cta { border-color:var(--ink); }
.hero-copy { padding-right:6vw; }
.hero-copy h1 { font-size:clamp(43px, 5.1vw, 77px); }
.hero-copy h1 em, h1 em, h2 em { color:var(--rust); }
.hero-actions { align-items:center; display:flex; flex-wrap:wrap; gap:22px; }
.button-link { display:inline-block; font-size:11px; font-weight:700; padding:14px 18px; }
.button-link span { color:#dbb276; padding-left:12px; }
.hero-photo { background:#d5ddd9; }
.hero-photo img { filter:saturate(.72) contrast(1.04); }
.photo-note, .card-tag { color:var(--ink); }
.intro-band { background:var(--sage); }
.intro-grid h2 { max-width:540px; font-size:clamp(35px, 4vw, 59px); }
.product-grid { display:grid; gap:25px; grid-template-columns:1.1fr .9fr; }
.product-card { display:block; }
.product-card-wide { grid-row:span 2; }
.product-card .card-image { height:285px; overflow:hidden; position:relative; }
.product-card-wide .card-image { height:595px; }
.product-card img { filter:saturate(.72); transition:transform .6s ease, filter .6s ease; }
.product-card:hover img { filter:saturate(.95); transform:scale(1.035); }
.product-copy { border-bottom:1px solid var(--line); padding:17px 2px 23px; }
.product-copy h3 { margin-bottom:5px; }
.product-copy p { color:var(--muted); font-size:12px; margin:0; max-width:360px; }
.capability-strip { background:var(--ink); color:#f5f1e7; padding:77px 8vw; }
.capability-strip .eyebrow { color:#dbb276; }
.capability-list { display:flex; flex-wrap:wrap; gap:0; margin:28px 0 35px; max-width:970px; }
.capability-list span { border-bottom:1px solid #49606a; border-top:1px solid #49606a; font-family:var(--serif); font-size:19px; margin:-1px 15px 0 0; padding:13px 18px; }
.light-button { background:#c18e4f; }
.capability-strip-light { background:var(--sage); color:var(--ink); }
.capability-strip-light .capability-list span { border-color:#aebfbd; }
.quote-section { background:#31505a; }
.quote-mark { color:#d3a866; }
.collection-grid.product-collection { gap:45px 25px; }
.product-collection .product-card-wide { grid-column:span 2; grid-row:auto; }
.product-collection .product-card-wide .card-image { height:480px; }
.muted { color:var(--muted); }
.site-footer { background:#e3e5df; }
.footer-brand b { font-size:.45em; }
.vision-section { align-items:center; background:#31505a; color:#f5f1e7; display:grid; gap:10vw; grid-template-columns:.65fr 1.35fr; padding:105px 10vw; }
.vision-badge { align-items:center; border:1px solid rgba(211,168,102,.65); border-radius:50%; color:#d3a866; display:flex; flex-direction:column; font-size:68px; height:205px; justify-content:center; justify-self:center; line-height:1; transform:rotate(-8deg); width:205px; }
.vision-badge span { color:#c4d0ce; font:9px var(--mono); letter-spacing:.08em; margin-top:20px; text-transform:uppercase; transform:rotate(8deg); }
.vision-copy .eyebrow { color:#d3a866; }
.vision-copy h2 { font-size:clamp(34px,4vw,60px); margin-bottom:25px; }
.vision-copy h2 em { color:#d3a866; }
.vision-copy > p:not(.eyebrow) { color:#c4d0ce; font-size:14px; margin-bottom:25px; max-width:560px; }
.vision-copy .text-link { color:#f5f1e7; }
@media (max-width:700px) { .vision-section { gap:50px; grid-template-columns:1fr; padding:75px 8vw; } .vision-badge { font-size:52px; height:155px; width:155px; } }
.product-directory { background:#ebe8de; padding:100px 8vw 115px; }
.directory-intro { display:grid; gap:20px 8vw; grid-template-columns:1fr 1fr; margin-bottom:55px; }
.directory-intro .eyebrow { grid-column:span 2; margin-bottom:0; }
.directory-intro h2 { font-size:clamp(36px,4.4vw,64px); }
.directory-intro > p:last-child { color:var(--muted); max-width:390px; padding-top:10px; }
.directory-grid { border-top:1px solid #bbc5c2; display:grid; grid-template-columns:repeat(3,1fr); }
.directory-card { border-bottom:1px solid #bbc5c2; border-right:1px solid #bbc5c2; min-height:260px; padding:23px 25px 25px 0; transition:background .25s ease, padding .25s ease; }
.directory-card:nth-child(3n+2), .directory-card:nth-child(3n+3) { padding-left:25px; }
.directory-card:nth-child(3n) { border-right:0; }
.directory-card:hover { background:#e2e0d6; padding-top:29px; }
.directory-card > span, .services-detail-list article > span { color:var(--rust); font:11px var(--mono); }
.directory-card h3 { margin:44px 0 10px; }
.directory-card p { color:var(--muted); font-size:12px; max-width:260px; min-height:58px; }
.directory-card b { color:var(--rust); font:10px var(--mono); text-transform:uppercase; }
.directory-card-featured { background:var(--ink); color:#f5f1e7; }
.directory-card-featured p { color:#b7c6c6; }
.services-detail { display:grid; gap:10vw; grid-template-columns:.8fr 1.2fr; padding:105px 8vw 120px; }
.services-detail-intro h2 { font-size:clamp(38px,4.5vw,65px); }
.services-detail-intro > p:last-child { color:var(--muted); max-width:310px; }
.services-detail-list { border-top:1px solid var(--line); }
.services-detail-list article { align-items:start; border-bottom:1px solid var(--line); display:grid; gap:28px; grid-template-columns:35px 1fr; padding:25px 0; }
.services-detail-list h3 { margin:0 0 6px; }
.services-detail-list p { color:var(--muted); font-size:12px; margin:0; max-width:520px; }
@media (max-width:700px) { .directory-intro { display:block; } .directory-intro .eyebrow { margin-bottom:28px; } .directory-intro > p:last-child { padding-top:25px; } .directory-grid { grid-template-columns:1fr 1fr; } .directory-card { min-height:270px; padding-right:14px; } .directory-card:nth-child(3n+2), .directory-card:nth-child(3n+3) { padding-left:14px; } .directory-card:nth-child(even) { border-right:0; padding-left:14px; } .directory-card:nth-child(odd) { border-right:1px solid #bbc5c2; } .directory-card h3 { font-size:20px; margin-top:35px; } .directory-card p { min-height:0; } .services-detail { display:block; padding:70px 8vw 80px; } .services-detail-list { margin-top:45px; } }
.main-nav a:nth-child(3) { display:inline-block !important; }
@media (max-width:700px) { .main-nav { gap:8px; } .main-nav a { font-size:8px; } .main-nav a:nth-child(3) { display:inline-block !important; } }
@media (max-width:700px) { .product-grid { grid-template-columns:1fr; } .product-card-wide { grid-row:auto; } .product-card-wide .card-image, .product-collection .product-card-wide .card-image { height:300px; } .product-collection .product-card-wide { grid-column:auto; } .capability-list span { font-size:16px; } }
:root { --ink:#182c32; --muted:#627176; --paper:#f4f1e9; --sage:#dce6e3; --rust:#a9783e; --line:#d1d5cd; --serif:'Libre Baskerville', Georgia, serif; --sans:'Manrope', sans-serif; --mono:'DM Mono', monospace; }
.utility-bar { background:var(--ink); color:#d7c29d; display:flex; font:9px var(--mono); justify-content:space-between; letter-spacing:.08em; padding:8px 5vw; text-transform:uppercase; }
.services-section { background:#ebe8de; padding:105px 8vw 115px; }
.services-section .section-heading { align-items:end; }
.section-lead { color:var(--muted); font-size:13px; max-width:310px; }
.service-grid { border-top:1px solid #bec6c2; display:grid; grid-template-columns:repeat(4,1fr); margin-top:50px; }
.service-item { border-right:1px solid #bec6c2; min-height:205px; padding:23px 24px 20px 0; }
.service-item:not(:first-child) { padding-left:24px; }
.service-item:last-child { border-right:0; }
.service-item > span { color:var(--rust); font:11px var(--mono); }
.service-item h3 { margin:38px 0 10px; }
.service-item p { color:var(--muted); font-size:12px; max-width:190px; }
.buyer-note { align-items:center; background:#dce6e3; display:grid; gap:10vw; grid-template-columns:1.1fr .9fr; padding:90px 10vw; }
.buyer-note h2 { font-size:clamp(34px,4vw,58px); max-width:560px; }
.buyer-note > p { color:#52676b; font-size:15px; max-width:360px; }
.collectibles-feature { align-items:center; background:var(--ink); color:#f5f1e7; display:grid; grid-template-columns:1.1fr .9fr; }
.collectibles-image { min-height:540px; position:relative; }
.collectibles-image img { filter:saturate(.72); height:100%; min-height:540px; object-fit:cover; }
.collectibles-image .photo-note { background:var(--rust); color:#fff; }
.collectibles-copy { padding:70px 8vw 70px 7vw; }
.collectibles-copy .eyebrow { color:#d3a866; }
.collectibles-copy h2 { font-size:clamp(36px,4.2vw,62px); margin-bottom:25px; }
.collectibles-copy h2 em { color:#d3a866; }
.collectibles-copy > p:not(.eyebrow) { color:#c4d0ce; font-size:14px; margin-bottom:30px; max-width:450px; }
@media (max-width:700px) { .collectibles-feature { display:block; } .collectibles-image, .collectibles-image img { min-height:350px; height:350px; } .collectibles-copy { padding:60px 8vw 70px; } }
@media (max-width:700px) { .services-section { padding:70px 8vw; } .services-section .section-heading { align-items:start; } .service-grid { grid-template-columns:1fr 1fr; margin-top:30px; } .service-item { min-height:220px; padding-right:14px; } .service-item:not(:first-child) { padding-left:14px; } .service-item:nth-child(2) { border-right:0; } .service-item:nth-child(3), .service-item:nth-child(4) { border-top:1px solid #bec6c2; } .buyer-note { gap:25px; grid-template-columns:1fr; padding:70px 8vw; } }
.site-header { background:var(--paper); border-bottom:1px solid var(--line); height:96px; }
.brand { font-size:21px; }
.brand-logo { border-radius:50%; height:42px; object-fit:cover; width:42px; }
.footer-brand .brand-logo { height:38px; width:38px; }
.main-nav { gap:42px; }
.main-nav a { font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.header-cta { letter-spacing:.03em; text-transform:uppercase; }
.hero-kicker { align-items:center; background:var(--paper); border-bottom:1px solid var(--line); color:var(--muted); display:flex; font:9px var(--mono); justify-content:space-between; letter-spacing:.09em; padding:12px 10vw; text-transform:uppercase; }
.hero-kicker span:first-child { color:var(--rust); font-size:16px; }
.home-hero { background:#18353d; color:#f4f1e9; grid-template-columns:51% 49%; min-height:650px; }
.home-hero .eyebrow { color:#d3a866; }
.home-hero .hero-intro { color:#b9c8c8; }
.home-hero .text-link { color:#e9dfcb; }
.hero-copy h1 { font-family:var(--serif); font-weight:400; }
.hero-photo { border-left:1px solid #547078; min-height:650px; }
.hero-photo:after { border:1px solid rgba(211,168,102,.7); content:''; inset:22px; pointer-events:none; position:absolute; }
.photo-note { background:#d3a866; font-weight:600; }
.feature-section { background:#f4f1e9; }
.section-heading h2 { font-size:clamp(35px, 4.5vw, 64px); }
.product-card { background:#ebe8de; }
.product-copy { padding:20px 22px 25px; }
.product-copy h3 { font-size:23px; }
.product-grid { gap:18px; }
.product-card .card-image { height:300px; }
.product-card-wide .card-image { height:610px; }
.capability-strip { position:relative; }
.capability-strip:before { border:1px solid rgba(211,168,102,.35); content:''; inset:18px; pointer-events:none; position:absolute; }
.capability-strip > * { position:relative; }
.quote-section { border-top:6px solid #c18e4f; }
.site-footer { position:relative; }
.footer-compass { color:var(--rust); font-family:var(--serif); font-size:92px; line-height:1; opacity:.18; position:absolute; right:7vw; top:35px; transform:rotate(20deg); }
@media (max-width:700px) { .utility-bar span:nth-child(2) { display:none; } .utility-bar { font-size:8px; } .hero-kicker { padding:10px 8vw; } .hero-kicker span:nth-child(2) { display:none; } .home-hero { min-height:0; } .hero-photo { border-left:0; min-height:390px; } .hero-photo:after { inset:14px; } .footer-compass { font-size:65px; right:6vw; top:25px; } }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); font-size:15px; line-height:1.6; } a { color:inherit; text-decoration:none; } img { display:block; width:100%; object-fit:cover; } .site-header { align-items:center; display:flex; height:88px; justify-content:space-between; padding:0 5vw; } .brand { align-items:center; display:flex; font-size:20px; font-weight:600; gap:9px; letter-spacing:-.06em; } .brand-mark { align-items:center; color:var(--rust); display:flex; font-size:25px; height:30px; justify-content:center; transform:rotate(15deg); width:22px; } .main-nav { display:flex; gap:35px; margin-left:11%; } .main-nav a { color:var(--muted); font-size:12px; letter-spacing:.02em; padding:6px 0; } .main-nav a.is-active, .main-nav a:hover { color:var(--ink); border-bottom:1px solid var(--rust); } .header-cta, .text-link { font-size:12px; font-weight:600; } .header-cta { border:1px solid var(--ink); padding:10px 14px; } .header-cta span, .text-link span { color:var(--rust); padding-left:8px; } .home-hero { display:grid; grid-template-columns:46% 54%; min-height:620px; } .hero-copy { align-self:center; padding:7vw 9vw 7vw 10vw; } .eyebrow { align-items:center; color:var(--rust); display:flex; font-family:var(--mono); font-size:10px; letter-spacing:.08em; margin:0 0 28px; text-transform:uppercase; } .rule { background:var(--rust); display:inline-block; height:1px; margin-left:13px; width:32px; } h1, h2, h3, p { margin-top:0; } h1, h2 { font-family:var(--serif); font-weight:400; letter-spacing:-.055em; line-height:1.02; } h1 { font-size:clamp(48px, 5.7vw, 89px); margin-bottom:28px; } h1 em, h2 em { color:var(--rust); font-style:italic; } .hero-intro { color:var(--muted); max-width:300px; margin-bottom:28px; } .hero-photo { min-height:620px; position:relative; } .hero-photo img { height:100%; } .photo-note { background:var(--paper); bottom:0; font-family:var(--mono); font-size:10px; left:0; padding:15px 20px; position:absolute; text-transform:uppercase; } .intro-band { background:var(--sage); padding:100px 10vw; } .intro-grid { display:grid; gap:10vw; grid-template-columns:1fr 1fr; } h2 { font-size:clamp(38px, 4vw, 62px); margin-bottom:0; } .intro-grid p { color:#526156; max-width:410px; padding-top:11px; } .feature-section { padding:105px 7vw; } .section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:35px; } .section-heading .eyebrow { margin-bottom:18px; } .stay-grid { display:grid; gap:28px; grid-template-columns:1.25fr .75fr; } .stay-card { display:block; } .card-image { height:335px; overflow:hidden; position:relative; } .stay-card.large .card-image { height:430px; } .card-image img { height:100%; transition:transform .6s ease; } .stay-card:hover img { transform:scale(1.035); } .card-tag { background:var(--rust); color:white; font-family:var(--mono); font-size:10px; left:15px; padding:4px 10px; position:absolute; text-transform:uppercase; top:15px; } .card-meta { align-items:start; display:flex; justify-content:space-between; padding-top:17px; } h3 { font-family:var(--serif); font-size:25px; font-weight:400; letter-spacing:-.03em; margin-bottom:2px; } .card-meta p, .card-meta strong { color:var(--muted); font-size:11px; font-weight:400; margin:0; } .card-meta strong { color:var(--ink); padding-top:8px; } .card-meta small { color:var(--muted); font-weight:400; } .quote-section { background:#27352f; color:#f1eee5; padding:100px 18vw; text-align:center; } .quote-mark { color:#d17b5b; font-family:var(--serif); font-size:75px; height:50px; } blockquote { font-family:var(--serif); font-size:clamp(27px, 3.2vw, 48px); letter-spacing:-.04em; line-height:1.15; margin:15px auto 25px; max-width:850px; } .quote-section p { color:#abb7aa; font-family:var(--mono); font-size:10px; text-transform:uppercase; } .page-hero { padding:90px 10vw 80px; } .page-hero h1 { max-width:800px; } .page-hero .hero-intro { font-size:17px; max-width:450px; } .collection-grid { display:grid; gap:45px 25px; grid-template-columns:repeat(2, 1fr); padding:0 7vw 110px; } .collection-grid .stay-card:first-child { grid-column:span 2; } .collection-grid .stay-card:first-child .card-image { height:520px; } .journal-grid { display:grid; gap:55px 25px; grid-template-columns:repeat(2, 1fr); padding:0 10vw 110px; } .journal-card img { height:290px; margin-bottom:22px; } .journal-card .eyebrow { margin-bottom:12px; } .journal-card h3 { font-size:30px; } .story-section { display:grid; grid-template-columns:1fr 1fr; padding:0 7vw 115px; } .story-section img { height:600px; } .story-copy { align-self:center; padding:8vw; } .story-copy p { color:var(--muted); max-width:380px; } .contact-grid { display:grid; grid-template-columns:1fr 1fr; padding:10px 10vw 120px; } .contact-details { padding-right:10vw; } .contact-details h2 { margin-bottom:28px; } .contact-details p { color:var(--muted); max-width:350px; } .contact-form { border-top:1px solid var(--line); } label { display:block; font-family:var(--mono); font-size:10px; letter-spacing:.06em; padding-top:22px; text-transform:uppercase; } input, textarea { background:transparent; border:0; border-bottom:1px solid var(--line); color:var(--ink); font:inherit; outline:0; padding:12px 0; width:100%; } textarea { height:95px; resize:vertical; } button { background:var(--rust); border:0; color:#fff; cursor:pointer; font:600 12px var(--sans); margin-top:28px; padding:14px 23px; } .site-footer { background:#e8e6dd; padding:65px 7vw 25px; } .footer-top { display:flex; justify-content:space-between; padding-bottom:70px; } .footer-brand { margin-bottom:14px; } .site-footer p { color:var(--muted); font-size:12px; } .footer-links { display:flex; gap:100px; } .footer-links div { display:flex; flex-direction:column; gap:6px; } .footer-links a { font-size:12px; } .label { color:var(--rust); font-family:var(--mono); font-size:10px; margin-bottom:8px; text-transform:uppercase; } .footer-bottom { border-top:1px solid var(--line); color:var(--muted); display:flex; font-family:var(--mono); font-size:9px; justify-content:space-between; padding-top:18px; text-transform:uppercase; } @media (max-width:700px) { .site-header { height:72px; padding:0 6vw; } .main-nav { gap:13px; margin-left:0; } .main-nav a:nth-child(3) { display:none; } .header-cta { font-size:0; padding:8px 11px; } .header-cta span { font-size:15px; padding:0; } .home-hero { display:flex; flex-direction:column; } .hero-copy { padding:70px 9vw 65px; } .hero-photo, .hero-photo img { min-height:390px; height:390px; } .intro-band, .feature-section { padding:70px 8vw; } .intro-grid, .story-section, .contact-grid { grid-template-columns:1fr; } .intro-grid { gap:25px; } .stay-grid, .collection-grid, .journal-grid { grid-template-columns:1fr; } .collection-grid .stay-card:first-child { grid-column:auto; } .stay-card.large .card-image, .collection-grid .stay-card:first-child .card-image, .card-image { height:300px; } .section-heading { align-items:start; flex-direction:column; gap:20px; } .quote-section { padding:75px 9vw; } .page-hero { padding:65px 8vw 55px; } .journal-grid, .collection-grid { padding:0 8vw 75px; } .journal-card img { height:240px; } .story-section { padding:0 8vw 75px; } .story-section img { height:380px; } .story-copy { padding:55px 0 0; } .contact-grid { padding:0 8vw 75px; } .contact-details { padding:0 0 50px; } .footer-top { flex-direction:column; gap:35px; } .footer-links { gap:50px; } .footer-bottom { gap:12px; flex-wrap:wrap; } }