/* Azimuth Sailing Holidays — site styles */
:root{
  --navy:#15425f; --navy-deep:#0b2a3e; --navy-ink:#071c2a;
  --sky:#33a7d8; --sky-soft:#d9eef8;
  --sand:#f4efe6; --sand-deep:#e7ddcb; --white:#fff;
  --ink:#16222c; --muted:#5d6b77; --line:#dfe4e8; --grey:#7a8794;
  --ok:#1d7a52; --warn:#b5651d; --err:#b3261e;
  --radius:14px; --shadow:0 18px 50px -24px rgba(7,28,42,.45);
  --ff-head:"Jost",system-ui,sans-serif; --ff-body:"Inter",system-ui,sans-serif; --ff-mono:"JetBrains Mono",ui-monospace,monospace;
  --wrap:1180px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ff-body);color:var(--ink);background:var(--white);font-size:17px;line-height:1.65}
img{max-width:100%;display:block}
a{color:var(--navy)} a:hover{color:var(--sky)}
h1,h2,h3,h4{font-family:var(--ff-head);font-weight:500;line-height:1.12;color:var(--navy-deep);margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2.4rem,5.4vw,4.4rem)} h2{font-size:clamp(1.9rem,3.6vw,2.9rem)} h3{font-size:1.35rem}
p{margin:0 0 1em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.eyebrow{font-family:var(--ff-mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sky);display:inline-flex;gap:.6em;align-items:center;margin-bottom:1rem}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.lead{font-size:1.18rem;color:var(--muted);max-width:62ch}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:99;background:#fff;padding:8px 12px}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.55em;font:500 .98rem var(--ff-head);letter-spacing:.02em;padding:.9em 1.5em;border-radius:999px;border:1.5px solid var(--navy);background:var(--navy);color:#fff;text-decoration:none;cursor:pointer;transition:.2s}
.btn:hover{background:var(--navy-deep);border-color:var(--navy-deep);color:#fff;transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--navy)} .btn.ghost:hover{background:var(--navy);color:#fff}
.btn.light{background:#fff;color:var(--navy-deep);border-color:#fff}.btn.light:hover{background:var(--sand);color:var(--navy-deep)}
.btn.outline-light{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}.btn.outline-light:hover{background:#fff;color:var(--navy-deep)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}
.btn.block{width:100%;justify-content:center}

/* header */
.site-header{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;height:76px}
.site-header .logo img{height:40px;width:auto}
.site-header .logo .dark{display:none}
.site-header.solid,.site-header.always{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);box-shadow:0 1px 0 var(--line)}
.site-header.solid .logo .dark,.site-header.always .logo .dark{display:block}
.site-header.solid .logo .light,.site-header.always .logo .light{display:none}
.nav{display:flex;align-items:center;gap:26px}
.nav a{font:500 .95rem var(--ff-head);color:#fff;text-decoration:none;letter-spacing:.02em}
.site-header.solid .nav a,.site-header.always .nav a{color:var(--navy-deep)}
.nav a:hover{color:var(--sky)!important}
.nav .lang{font-family:var(--ff-mono);font-size:.78rem;border:1px solid currentColor;border-radius:999px;padding:.25em .7em}
.nav .btn{padding:.6em 1.15em;color:#fff!important}
.menu-toggle{display:none;background:none;border:0;color:#fff;cursor:pointer;padding:8px}
.site-header.solid .menu-toggle,.site-header.always .menu-toggle{color:var(--navy-deep)}
@media (max-width:900px){
  .menu-toggle{display:block}
  .nav{position:fixed;inset:76px 0 auto;flex-direction:column;align-items:flex-start;gap:0;background:#fff;padding:8px 20px 20px;box-shadow:var(--shadow);display:none}
  .nav.open{display:flex}
  .nav a{color:var(--navy-deep)!important;padding:12px 0;width:100%;border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:12px;width:100%;justify-content:center;border-bottom:0}
  .nav .lang{border:0;padding:12px 0}
}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--navy-ink)}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,28,42,.55) 0%,rgba(7,28,42,.05) 35%,rgba(7,28,42,.75) 100%)}
.hero .wrap{position:relative;z-index:2;padding-top:calc(76px + clamp(28px,5vh,56px));padding-bottom:clamp(40px,8vh,100px);width:100%}
.hero h1{color:#fff;max-width:14ch;font-weight:400}
.hero h1 b{font-weight:600}
.hero p{font-size:1.2rem;max-width:52ch;color:rgba(255,255,255,.9)}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero .coords{position:absolute;right:96px;bottom:30px;z-index:2;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.14em;color:rgba(255,255,255,.75);text-align:right}
.hero.small{min-height:62vh}
.hero.small h1{max-width:20ch}

/* sections */
section{padding:clamp(64px,9vw,120px) 0}
.bg-sand{background:var(--sand)} .bg-navy{background:var(--navy-deep);color:#e8f1f6}
.bg-navy h2,.bg-navy h3{color:#fff} .bg-navy .lead{color:#b9cfdc}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.section-head .lead{margin:0}

.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:48px}
.pillar{border-top:1px solid var(--line);padding-top:22px}
.pillar .n{font-family:var(--ff-mono);font-size:.78rem;color:var(--sky);letter-spacing:.12em}
.pillar h3{margin-top:.6em}
.pillar p{color:var(--muted);margin:0}
@media(max-width:820px){.pillars{grid-template-columns:1fr}}

/* program cards */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cards.three{grid-template-columns:repeat(2,1fr)}
.cards.cards-3{grid-template-columns:repeat(3,1fr)}.cards.cards-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:1050px){.cards,.cards.cards-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.cards,.cards.three,.cards.cards-2,.cards.cards-3{grid-template-columns:1fr}}
.card{background:#fff;border-radius:var(--radius);overflow:hidden;text-decoration:none;color:inherit;display:flex;flex-direction:column;box-shadow:0 1px 0 var(--line),0 10px 30px -22px rgba(7,28,42,.5);transition:.25s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);color:inherit}
.card .ph{aspect-ratio:4/3;overflow:hidden;position:relative}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover .ph img{transform:scale(1.05)}
.card .tag{position:absolute;left:14px;top:14px;background:rgba(255,255,255,.92);color:var(--navy-deep);font:500 .72rem var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;padding:.35em .7em;border-radius:999px}
.card .bd{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.card h3{font-size:1.25rem;margin-bottom:.35em}
.card .meta{font-size:.9rem;color:var(--muted);margin-bottom:.8em}
.card .price{margin-top:auto;display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:14px;font-family:var(--ff-head)}
.card .price b{font-size:1.25rem;color:var(--navy-deep);font-weight:600}
.card .price span{font-size:.82rem;color:var(--muted)}

/* route strip (atlantic) */
.route{display:grid;grid-template-columns:repeat(4,1fr);margin:10px 0 48px;position:relative}
.route::before{content:"";position:absolute;left:4%;right:4%;top:15px;border-top:1.5px dashed rgba(255,255,255,.35)}
.route .stop{position:relative;padding-top:42px;text-align:center}
.route .stop::before{content:"";position:absolute;top:8px;left:50%;width:16px;height:16px;margin-left:-8px;border-radius:50%;background:var(--sky);box-shadow:0 0 0 6px rgba(51,167,216,.2)}
.route .stop b{display:block;font-family:var(--ff-head);font-weight:500;font-size:1.15rem;color:#fff}
.route .stop small{font-family:var(--ff-mono);font-size:.7rem;letter-spacing:.1em;color:#8fb4c8}
@media(max-width:700px){.route{grid-template-columns:repeat(2,1fr);row-gap:20px}.route::before{display:none}}
.bg-navy .card{background:#0f3550;color:#e8f1f6;box-shadow:none}
.bg-navy .card h3{color:#fff}.bg-navy .card .meta,.bg-navy .card .price span{color:#9fbdcf}
.bg-navy .card .price{border-color:rgba(255,255,255,.12)}.bg-navy .card .price b{color:#fff}

/* split */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.split.rev>:first-child{order:2}
@media(max-width:900px){.split{grid-template-columns:1fr}.split.rev>:first-child{order:0}}
.mosaic{display:grid;grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr;gap:12px;height:clamp(360px,48vw,560px)}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius)}
.mosaic img:first-child{grid-row:1/3}
.specs{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin:26px 0}
.specs div{background:#fff;padding:16px}
.specs b{display:block;font:500 1.5rem var(--ff-head);color:var(--navy-deep)}
.specs span{font-size:.82rem;color:var(--muted)}

/* widgets */
.widget-box{min-height:240px;border-radius:var(--radius)}
.widget-fallback{font-size:.95rem;color:var(--muted)}

/* faq */
.faq{max-width:860px}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}
.faq summary{cursor:pointer;font:500 1.15rem var(--ff-head);color:var(--navy-deep);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";font-family:var(--ff-mono);color:var(--sky)}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:.8em 0 0;color:var(--muted)}

/* cta band */
.cta-band{position:relative;color:#fff;overflow:hidden;background:var(--navy-ink)}
.cta-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45}
.cta-band .wrap{position:relative;text-align:center}
.cta-band h2{color:#fff;max-width:18ch;margin:0 auto .4em}
.cta-band .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}

/* program page */
.program{display:grid;grid-template-columns:1fr 420px;gap:56px;align-items:start}
@media(max-width:1000px){.program{grid-template-columns:1fr}}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px;padding:0;list-style:none}
.facts li{font-size:.9rem;background:var(--sand);border-radius:999px;padding:.45em .95em;color:var(--navy-deep)}
.includes{list-style:none;padding:0;margin:0 0 32px;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}
.includes li{padding-left:26px;position:relative}
.includes li::before{content:"";position:absolute;left:0;top:.55em;width:12px;height:12px;border:2px solid var(--sky);border-radius:50%}
@media(max-width:620px){.includes{grid-template-columns:1fr}}
.gallery3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:32px 0}
.gallery3 img{aspect-ratio:1;object-fit:cover;border-radius:10px;width:100%}
.dates-table{width:100%;border-collapse:collapse;margin:8px 0 28px;font-size:.95rem}
.dates-table th,.dates-table td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line)}
.dates-table th{font:500 .72rem var(--ff-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.crumbs{font-size:.85rem;color:rgba(255,255,255,.8);margin-bottom:14px}
.crumbs a{color:#fff}

/* booking widget */
.booking{position:sticky;top:96px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.booking header{background:var(--navy-deep);color:#fff;padding:20px 22px}
.booking header small{font-family:var(--ff-mono);letter-spacing:.12em;text-transform:uppercase;font-size:.7rem;color:#8fb4c8}
.booking header .p{font:500 1.7rem var(--ff-head)} .booking header .p span{font-size:.85rem;color:#b9cfdc;font-family:var(--ff-body)}
.booking .body{padding:20px 22px}
.bk-step{display:none}.bk-step.on{display:block}
.bk-label{font:500 .72rem var(--ff-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:14px 0 8px;display:block}
.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.cal-head b{font:500 1.05rem var(--ff-head);color:var(--navy-deep);text-transform:capitalize}
.cal-head button{background:none;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;cursor:pointer;color:var(--navy)}
.cal-head button:disabled{opacity:.3;cursor:default}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.cal .dow{font:500 .66rem var(--ff-mono);color:var(--grey);padding:4px 0}
.cal button{height:38px;border:0;border-radius:8px;background:var(--sky-soft);color:var(--navy-deep);font:500 .9rem var(--ff-body);cursor:pointer;position:relative}
.cal button:hover{background:var(--sky);color:#fff}
.cal button[disabled]{background:transparent;color:#c3cbd2;cursor:default;text-decoration:line-through}
.cal button.blank{visibility:hidden}
.cal button.sel{background:var(--navy);color:#fff}
.cal button.inrange{background:#bfe0f0}
.cal button.dep{background:var(--navy);color:#fff}
.cal button.dep.full{background:#e9ecef;color:#9aa5ae;text-decoration:line-through}
.cal-legend{display:flex;gap:14px;font-size:.78rem;color:var(--muted);margin-top:10px;flex-wrap:wrap}
.cal-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.choice{display:grid;gap:8px}
.choice label{display:flex;justify-content:space-between;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:11px 13px;cursor:pointer;font-size:.93rem}
.choice label:has(input:checked){border-color:var(--navy);background:var(--sky-soft)}
.choice label.off{opacity:.45;cursor:not-allowed}
.choice input{accent-color:var(--navy)}
.choice em{font-style:normal;color:var(--muted);font-size:.82rem}
.field{margin-bottom:12px}
.field label{display:block;font-size:.84rem;color:var(--muted);margin-bottom:4px}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:.95rem;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--sky);border-color:transparent}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;width:max-content}
.stepper button{border:0;background:var(--sand);width:40px;height:42px;font-size:1.2rem;cursor:pointer;color:var(--navy)}
.stepper output{min-width:48px;text-align:center;font-weight:600}
.summary{background:var(--sand);border-radius:12px;padding:14px 16px;margin:16px 0;font-size:.92rem}
.summary div{display:flex;justify-content:space-between;gap:10px;padding:3px 0}
.summary .total{border-top:1px solid var(--sand-deep);margin-top:6px;padding-top:8px;font-weight:600;color:var(--navy-deep)}
.note{font-size:.8rem;color:var(--muted);margin:10px 0 0}
.msg{padding:12px 14px;border-radius:10px;font-size:.92rem;margin-top:12px}
.msg.err{background:#fbe9e7;color:var(--err)} .msg.ok{background:#e6f4ec;color:var(--ok)}
.hp{position:absolute;left:-5000px}
.done{text-align:center;padding:12px 0}
.done .tick{width:56px;height:56px;border-radius:50%;background:#e6f4ec;color:var(--ok);display:grid;place-items:center;margin:0 auto 12px;font-size:1.6rem}

/* article */
.article{max-width:760px;margin:0 auto}
.article h2{font-size:1.8rem;margin-top:1.4em}
.article img{border-radius:var(--radius);margin:24px 0}
.article ul{padding-left:1.2em}

/* footer */
footer{background:var(--navy-ink);color:#9fb6c5;font-size:.93rem;padding:72px 0 32px}
footer a{color:#d7e6ef;text-decoration:none} footer a:hover{color:#fff}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
footer h4{color:#fff;font-size:1rem;margin-bottom:1em}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
footer .legal{border-top:1px solid rgba(255,255,255,.1);margin-top:48px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.82rem}

/* whatsapp */
.wa{position:fixed;right:18px;bottom:18px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25d366;display:grid;place-items:center;box-shadow:0 10px 28px -8px rgba(0,0,0,.45);transition:transform .2s}
.wa:hover{transform:scale(1.07)} .wa svg{width:30px;height:30px;fill:#fff}
.wa .tip{position:absolute;right:70px;white-space:nowrap;background:#fff;color:var(--ink);font-size:.85rem;padding:.45em .8em;border-radius:8px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.2s}
.wa:hover .tip{opacity:1}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}*{transition:none!important;scroll-behavior:auto}}

@media(max-width:620px){.hero .coords{display:none}}
html,body{overflow-x:hidden}

/* spacing fixes */
.hero.small{min-height:clamp(380px,58vh,620px)}
.hero.small + section{padding-top:clamp(40px,5vw,64px)}
.program + *{margin-top:0}
.program article > :last-child{margin-bottom:0}
.booking{top:92px;max-height:calc(100vh - 108px);overflow:auto}
@media(max-width:1000px){.booking{position:static;max-height:none;overflow:visible}}
@media(max-width:620px){.wa{right:14px;bottom:14px;width:52px;height:52px}footer{padding-bottom:84px}}

/* booking widget: breathing room between guests, summary and buttons */
.booking .stepper{margin-bottom:22px}
.booking .summary{margin:4px 0 20px}
.booking [data-next]{margin-top:4px}
.booking .note{margin-top:14px}
footer .credit{margin:18px 0 0;text-align:center;font-size:.78rem;color:#6f8a9b}
footer .credit a{color:#b9cfdc;text-decoration:underline;text-underline-offset:3px}