/* Pilgrim’s Compass palette, sampled from the supplied brand reference. */
:root{--forest:#46513d;--gold:#f6c86b;--teal:#214354;--cream:#eee8d5;--paper:#e3dfcc;--ink:#214354;--muted:#4d5849;--rust:#214354;--line:#b9bda9}
body{background:var(--cream);color:var(--ink)}
header,footer{background:var(--forest);color:var(--cream);border-color:#75806a}
header .brand,footer .brand{color:var(--gold)}
.brand small{color:var(--cream)}.brand-compass{background:var(--cream);border-radius:12%;padding:3px}
nav a:hover,nav a[aria-current="page"]{color:var(--gold)}
.button,.button.small,.plan .button{background:var(--gold);border-color:var(--gold);color:var(--teal)}
.button:hover,.button.small:hover,.plan .button:hover{background:var(--teal);border-color:var(--teal);color:var(--cream)}
header .button:hover{background:var(--cream);border-color:var(--cream);color:var(--teal)}
.menu{color:var(--cream);border-color:#aeb69f}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--teal);outline-offset:4px}
header :focus-visible,footer :focus-visible,.plan :focus-visible{outline-color:var(--gold)}
.hero{background:var(--forest)}
.hero::after{background:linear-gradient(90deg,#eee8d5fa 0%,#eee8d5ed 25%,#eee8d570 38%,transparent 52%)}
.hero h1,.hero .eyebrow,.hero-copy>p:not(.eyebrow),.hero-promises,.hero-explore{color:var(--teal)}
.hero-promises::before{border-color:var(--forest)}.hero-explore{border-color:var(--teal)}
.pin-label{background:#eee8d5f5;color:var(--teal);border:1px solid #46513d55}.ocean{color:var(--teal)}
.eyebrow,.journey-showcase .eyebrow{color:var(--teal)}
.photo::after{background:linear-gradient(transparent 35%,#214354ef)}
.card-title,.card-title h3{color:var(--cream)}.card-title small,.card-title>span{color:var(--gold);border-color:var(--gold)}
.card-departures{color:var(--teal)}.departure-status{color:var(--forest)}.departure-status.is-full{color:var(--teal)}
.difference{background:var(--forest);color:var(--cream);border-top:4px solid var(--gold)}
.difference>.eyebrow,.difference-grid h3{color:var(--gold)}.difference-grid p{color:var(--cream)}
.difference-grid>div{border-color:#7b856e}.difference-grid img{background:var(--cream);border-radius:50%;padding:7px}
.approach,.route-section{background:var(--paper)}.principle{border-color:var(--line)}.principle>span{color:var(--teal)}
em,.text-link,.stories-link{color:var(--teal)}.text-link,.stories-link{border-color:var(--forest)}
.quote{background:var(--teal);border-color:var(--teal);color:var(--cream)}
.quote .eyebrow{color:var(--gold)}.quote blockquote,.quote p,.quote p span{color:var(--cream)}.quote .stories-link{color:var(--gold);border-color:var(--gold)}
.testimonial-mark{color:var(--forest)}.testimonial-feature figcaption strong{color:var(--teal)}
.plan{background:var(--forest);color:var(--cream)}.plan h2,.plan p,.plan label{color:var(--cream)}.plan .eyebrow{color:var(--gold)}
.plan input,.plan select,.plan textarea{background:#eee8d50d;border-color:#b9bda9;color:var(--cream)}
.plan input::placeholder,.plan textarea::placeholder{color:#e0dfcf}.plan select option{background:var(--forest);color:var(--cream)}
footer p,footer small{color:var(--cream)}footer small{border-color:#75806a}footer a:hover{color:var(--gold)}
.tour-hero{background:var(--teal);color:var(--cream)}.tour-hero::after{background:linear-gradient(0deg,#214354ed,transparent 95%)}
.tour-hero h1,.tour-hero p,.tour-hero .back{color:var(--cream)}.tour-hero .eyebrow{color:var(--gold)}
.stops summary{color:var(--teal)}.stops summary:hover{color:var(--forest)}
::selection{background:var(--gold);color:var(--teal)}
@media(max-width:760px){nav{background:var(--forest);color:var(--cream);border-color:#75806a}.hero::after{background:linear-gradient(#eee8d5 0%,#eee8d5f5 40%,#eee8d555 58%,transparent 68%)}}

/* Cream benefits section below the homepage slideshow. */
.difference{background:var(--cream);color:var(--teal)}
.difference>.eyebrow,.difference-grid h3{color:var(--teal)}
.difference-grid p{color:var(--muted)}
.difference-grid>div{border-color:var(--line)}

/* Match the name to the tagline width, with the logo spanning both lines. */
header .brand{--tagline-size:9px;--brand-gap:8px;gap:12px}
header .brand-text{display:flex;flex-direction:column;gap:var(--brand-gap);font-size:var(--tagline-size)}
header .brand-name{display:block;font-size:4em;line-height:1.3;letter-spacing:0}
header .brand small{margin-top:0;font-size:1em;line-height:1.4;letter-spacing:.1em}
header .brand-compass{height:calc(var(--tagline-size)*6.6 + var(--brand-gap));width:calc(var(--tagline-size)*6.6 + var(--brand-gap))}
@media(min-width:761px) and (max-width:1100px){header .brand{--tagline-size:7px}}
@media(max-width:760px){header .brand{--tagline-size:6px;--brand-gap:6px;gap:10px}}